Visual Regression Tester

Note: Use pixel-perfect by default (free); use this skill for hosted Chromatic baselines.

When to use / NOT for

• Use when: the user asks to set up visual regression / screenshot testing, a visual diff pipeline, hosted Chromatic baselines, or to debug why screenshots changed.
• NOT for: functional/E2E behavior testing (assert behavior, not pixels — this skill never replaces behavioral assertions); performance testing; purely local one-off pixel comparisons without a baseline pipeline (pixel-perfect covers that). If the user only wants "check this page looks right once", propose pixel-perfect first and use this skill when they need baselines + CI.

Core Workflow

1. Choose tool: Playwright, Chromatic

2. Setup baseline: Capture initial screenshots

3. Configure thresholds: Define acceptable diff

4. Integrate CI: Automated testing

5. Review changes: Approve or reject

6. Update baselines: Accept intentional changes

Playwright Visual Testing