The Tool Desk
Outbyte PC Repair FREEClear out junk files and repair common Windows errorsFree Scan →Outbyte Driver Updater FREEScan for outdated or missing drivers - takes under a minuteDriver Scan →Install Applitools’ Playwright SDK, import its test fixture, and add a named eyes.check() call at each UI state you want to compare. The fixture supplies both Playwright’s page and an Eyes instance; after the run, review visual differences before accepting any baseline change.
Install and initialize the Playwright integration
Applitools’ March 11, 2026 setup guide gives this starting path: install the SDK, then run its setup command. The CLI setup flow configures imports and settings and adds a demo test. Applitools’ Playwright SDK setup guide
As an Amazon Associate I earn from qualifying purchases.
npm install @applitools/eyes-playwrightnpx eyes-playwright setup
The commands are documented by Applitools; they have not been independently run here. Package versions and CLI behavior can change, so consult the current Applitools Playwright integration documentation if a command or API differs from your installed version.
Do these 3 things before closing this tab:
1Clear out junk files and repair common Windows errors2Fix the driver behind crashes, sound loss and screen glitches3Repair Windows errors before they cause bigger problemsSet the API key securely
Tests need an Applitools API key to connect to the Eyes cloud service. Obtain it from your Applitools account and set it as the APPLITOOLS_API_KEY environment variable rather than placing it in a configuration file that may be committed. Treat it as a secret in local development and CI. Applitools Dashboard API key documentation
#1 Best Overall
Write a test with a visual checkpoint
Import the SDK’s fixture test function instead of Playwright’s ordinary test import. The fixture provides page for normal browser actions and eyes for visual checks. Navigate and interact with the application using Playwright, then capture the state that matters:
import { test } from '@applitools/eyes-playwright/fixture';
test('Homepage visual check', async ({ page, eyes }) => {
await page.goto('https://example.com');
await eyes.check('Homepage', {
fully: true,
matchLevel: 'Strict',
});
});This follows the integration example in Applitools’ Playwright documentation. The checkpoint name, Homepage, identifies the captured UI state in results. Keep application setup, navigation, and user interactions in Playwright; place a checkpoint after the actions have produced the state you want to protect.
Choose what each checkpoint captures
A checkpoint is a named visual capture compared with a stored baseline. Choose its scope based on the regression signal you need:
Rank #2
| Capture choice | When it fits | Example |
|---|---|---|
| Full page | When the complete rendered page state matters. | fully: true |
| Focused region | When a component or area needs an independent checkpoint. | Pass a locator as the region option. |
The integration guide also documents comparison and region controls. Use them to describe legitimate variability, not to hide unexplained visual changes:
matchLevelcontrols how Eyes compares the checkpoint to its baseline; the guide recommendsStrict.ignoreRegionsmarks areas whose visual changes should not affect comparison.floatingRegionsaccounts for elements or containers that may move within a bounded area.IgnoreDisplacementssuppresses differences caused by elements shifting position.regiontargets a particular element or area rather than the whole page.
Ignore only content that is expected to vary and is not part of the behavior the check is meant to protect. A region setting does not explain why a difference appeared. These options and the Strict recommendation are documented in Applitools’ integration guide.
Keep checks maintainable
Give checkpoints names that describe the user-visible state or component, such as a page or dialog state, rather than a generic label. For a small test, an inline eyes.check() is straightforward. As checks spread across a suite, Applitools recommends organizing them in page-object methods or custom fixtures so the checks remain near the actions that create the relevant states. Integration with Playwright
Configure reporting and failure timing
To include Eyes visual-test information in Playwright’s enhanced HTML report, configure @applitools/eyes-playwright/reporter as the Playwright reporter. Open the report with:
npx playwright show-reportApplitools documents the reporter and its visual-difference review flow in the Playwright integration guide. The same documentation lists global eyesConfig settings such as appName, batch, and failTestsOnDiff. The latter accepts 'afterEach', 'afterAll', or false; choose timing that matches how your team wants CI failures and triage to work. Setting it to false means differences do not automatically fail tests through that setting, so it should be an intentional workflow choice rather than a way to ignore results.
Review differences before changing a baseline
When a checkpoint differs, the baseline is the reference used for future comparisons. Accepting an intentional UI change updates that reference; rejecting an unintended difference leaves it for investigation. Use this review loop:
Rank #4
- Used Book in Good Condition
- Open the Playwright/Eyes report or the batch results in Eyes Test Manager.
- Compare the current checkpoint with its baseline and inspect the highlighted differences.
- Decide whether the UI change is intended. Accept it only when the new appearance is correct; reject an unintended difference and investigate the application or test.
- Re-run after making the relevant code or baseline change, according to your project’s workflow.
The report and accept/reject flow are described in the integration guide; dashboard documentation covers baseline review and updates at Applitools Dashboard.
What happens during a run
The test suite exercises your application, the Eyes SDK captures screenshots at visual checkpoints and sends them to Eyes Server, and the server compares them with stored baselines. Results are reviewed in Eyes Test Manager, where a tester can update a baseline when a change is intentional or mark a bug and annotate regions. Applitools describes public cloud, dedicated cloud, and on-premises Eyes server configurations; this workflow description does not establish the suitability or requirements of a particular deployment. Applitools System Overview
Free tools Windows power users keep installed
One-click scans. No signup required.
Adopt the SDK in an existing project
Applitools’ March 11, 2026 article presents the fixture-oriented SDK updates, CLI onboarding, configuration insertion, and enhanced reporter as backward-compatible, while recommending gradual migration: try a few tests in both SDK patterns, move simpler tests first, then migrate critical tests over time. That is vendor guidance, not a guarantee that every older project configuration will work unchanged. Applitools’ Playwright SDK setup guide
Best Value
Troubleshooting
| Symptom | Likely cause | What to check |
|---|---|---|
| SDK package or setup command is not found. | The package may not be installed in the project, or the command may not match the installed SDK version. | Install @applitools/eyes-playwright in the project and check the current integration documentation for version-specific setup. |
The test does not receive eyes. |
The test imports Playwright’s standard test instead of the Applitools fixture. |
Use import { test } from '@applitools/eyes-playwright/fixture'; for the visual test. |
| Eyes cannot connect or results do not appear. | The API key may be missing or unavailable to the test process. | Confirm APPLITOOLS_API_KEY is set in the environment used by the local run or CI job; do not put the key in committed configuration. |
| A test fails on a visual difference. | The current checkpoint differs from its baseline, or failure timing is configured to surface the diff. | Inspect the highlighted change and decide whether to fix the UI/test or accept an intentional new baseline. |
| The HTML report lacks Eyes details. | The Eyes reporter may not be configured as the Playwright reporter, or the report may not have been opened. | Check the reporter configuration in the integration guide and run npx playwright show-report. |
Or skip the browser setup
If you need a screenshot endpoint rather than an Applitools visual-baseline test, ScreenshotNeo returns a screenshot or PDF from one GET request. It is a separate screenshot API, not an Eyes integration: it does not replace checkpoint baselines or visual-diff review. Its API documentation covers the request and options.
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webpScreenshotNeo removes cookie/consent banners, newsletter popups, and chat widgets before capture, with each step configurable. Bot checks, blank pages, failed loads, timeouts, and cache hits are not billed. Its MCP server provides screenshot tools for AI agents, and the free plan includes 1,000 screenshots per month with no card; paid plans start at $5 for 3,000. Sign up free for 1,000 screenshots a month, no card required.
Frequently Asked Questions
Does the Applitools Playwright fixture replace Playwright’s normal test runner?
No. It is an alternative test import for tests that need Eyes; Playwright still performs navigation and browser interactions.
Can I use Eyes for just one component instead of a full page?
Yes. The integration guide documents targeting a locator or area with the region option.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
