Visual regression testing
Skill Dragoon0x/everything-design-taste/skills/visual-regression-testing
A taste system for AI agents. 288 skills, 80 agents, 12 rules, and 8 hooks that turn generic AI output into work with genuine design quality. Anti-slop detection, typography craft, color systems, brand voice, product strategy, and 50+ specialized reviewers across UI, industry, platform, and content domains.
npx -y skills add Dragoon0x/everything-design-taste --skill visual-regression-testingAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 6 stars6 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
What its author says it does
Copied from the file, not written here
Visual regression testing approaches, snapshot comparison, and visual QA automation.
SKILL.md
1.1 KB, as published. Nobody here has run it
Visual Regression Testing
Visual Regression Testing
Tools
- Chromatic (Storybook integration).
- Percy (BrowserStack).
- Playwright visual comparisons.
- BackstopJS (open source).
What to Test
- Component states (default, hover, focus, disabled, error, loading).
- Responsive breakpoints (mobile, tablet, desktop).
- Dark mode vs light mode.
- Content edge cases (empty, long text, many items).
Strategy
- Component-level screenshots in Storybook (isolated, deterministic).
- Page-level screenshots for layout validation.
- Threshold: Allow 0.1% pixel difference (anti-aliasing varies).
- CI integration: Block PRs that introduce visual changes without approval.
Anti-Patterns
- Testing pages with dynamic data (timestamps, random content cause false positives).
- Screenshot resolution inconsistency.
- Not testing dark mode.
- Ignoring font rendering differences between CI and local.