arrow-left Back to topicQuizVisual comparisonsCheck yourself1.You run npx playwright test and a visual test fails with: 'snapshot doesn't exist, writing actual'. What should you do?This is a bug — fix the test so it doesn't fail on first runReview the generated screenshot, then commit it — this is the expected first-run behaviorRun --update-snapshots to fix the failure2.Visual tests fail intermittently on CI because the order list shows different timestamps on each run. What's the best fix?Set maxDiffPixelRatio: 0.5 — allow 50% pixel difference to absorb the timestamp changesMask the timestamp column using the mask option or hide it via screenshot.cssMock Date.now() so timestamps are always the same3.What is the difference between expect(page).toHaveScreenshot() and expect(locator).toHaveScreenshot()?There is no difference — both capture the full pageexpect(page) captures the full viewport; expect(locator) captures only the bounding box of that specific elementexpect(locator) is deprecated — always use expect(page)expect(page) only works on the landing page; expect(locator) works anywhere4.Where does Playwright store generated screenshot reference files by default?In a __snapshots__ folder inside the project rootIn a folder named <testFile>-snapshots next to the test fileIn the test-results directory alongside trace and video filesIn a .playwright/screenshots hidden folder5.You intentionally updated the checkout page design. How do you update the visual references so tests stop failing?Delete the snapshot directory and re-run tests — they will regenerate automaticallyRun npx playwright test --update-snapshots to regenerate reference screenshotsIncrease maxDiffPixelRatio to absorb the visual differencesRename the snapshot files to force Playwright to treat them as new references6.What does maxDiffPixels: 100 do when passed to toHaveScreenshot()?It scales the comparison to only check 100 pixels sampled randomlyIt allows up to 100 individual pixels to differ between the screenshot and reference before the assertion failsIt sets the image resolution to 100 DPI for comparisonIt limits comparison to the first 100 pixels of the screenshot7.A test captures a screenshot named dashboard.png. What does the actual filename on disk look like on a macOS machine running Chromium?dashboard.png — the name is used exactly as givendashboard-chromium-darwin.png — browser and OS are appended automaticallydashboard-1.png — a run counter is always appendeddashboard-snap.png — Playwright adds a -snap suffix to distinguish references from regular images8.You want to hide a live chat widget globally across all visual tests without adding a mask option to every individual assertion. What is the recommended approach?Add mask: [page.locator('.live-chat')] to every toHaveScreenshot() callCreate a screenshot.css file that hides the widget and reference it via stylePath in playwright.config.tsUse beforeEach to click the close button on the chat widget before every testDisable the chat widget feature flag in the environment config for all test runsSubmit answersUI ModeNext arrow-right