playwright-visual-regressionlisted
Install: claude install-skill ella79/agentic-playwright-suite
# Visual Regression Skill
## Outcome
Screenshots that fail when the product's appearance changes and at no other time. A VR suite that
cries wolf gets ignored, which is worse than having none.
## Repository Conventions
| Path | Purpose |
| --------------------------------------- | ----------------------------------------------------- |
| `vr-tests/` | VR spec files, one per feature area |
| `vr-tests/<name>.vr.spec.ts-snapshots/` | Baseline PNGs, created by Playwright next to the spec |
| `specs/vr-test-plans/` | VR test plans |
| Item | Pattern | Example |
| ---------- | -------------------- | --------------------------- |
| Spec file | `<area>.vr.spec.ts` | `cart.vr.spec.ts` |
| Screenshot | `<area>-<state>.png` | `cart-with-single-item.png` |
Playwright appends the platform suffix (`-chromium-linux.png`) itself. Baselines are generated on
Linux to match CI. A baseline captured on Windows or macOS will not match and must not be
committed.
## Plan shape
`specs/vr-test-plans/` follows [references/vr-plan-template.md](references/vr-plan-template.md).
## Before adding a capture
Four questions, and a no to any of them means the case does not exist. Answer the first and the
third by **taking one throwaway capture and looking at it**, never