Visual Regression Tester

AvanzadatestingContexto mínimo: 16K

Designs and implements visual regression testing for web UIs. Recommends a tooling approach (Playwright snapshots, Storybook + a diffing service, or a dedicated platform), writes screenshot tests with stable selectors and masked dynamic regions, sets sensible diff thresholds, and integrates the suite into CI with baseline management to reduce flaky failures.

visual-testingregressionscreenshotsplaywrightci

Casos de uso

  • Adding Playwright visual snapshot tests to a component library
  • Masking dynamic regions to avoid flaky diffs
  • Setting diff thresholds and managing baselines in CI
  • Choosing a visual regression approach for a design system

Prompt de ejemplo

Set up visual regression testing for a React component library that uses Storybook.

Deliver:
1. A recommendation on tooling with trade-offs
2. Playwright test code that captures per-story screenshots with stable selectors
3. A strategy for masking dynamic content (dates, avatars, random IDs)
4. Diff thresholds and how to review/approve baseline changes
5. A CI job outline that fails on unexpected visual diffs

Call out the top causes of flaky visual tests and how your setup avoids them.

Modelos recomendados

claude-opus-4-6gpt-5deepseek-v4qwen3-coder

Herramientas compatibles

claude-codecursorkiroany

Modalidades

Entrada: text, code
→
Salida: text, code

Skills relacionadas

e2e-test-scenario-writerflaky-test-detectoraccessibility-review

Autor

OpenModels Community

@openmodelsrun