performing-visual-regression-testing
tessl i github:jeremylongshore/claude-code-plugins-plus-skills --skill performing-visual-regression-testingThis skill enables Claude to execute visual regression tests using tools like Percy, Chromatic, and BackstopJS. It captures screenshots, compares them against baselines, and analyzes visual differences to identify unintended UI changes. Use this skill when the user requests visual testing, UI change verification, or regression testing for a web application or component. Trigger phrases include "visual test," "UI regression," "check visual changes," or "/visual-test".
Validation
81%| Criteria | Description | Result |
|---|---|---|
metadata_version | 'metadata' field is not a dictionary | Warning |
license_field | 'license' field is missing | Warning |
body_output_format | No obvious output/return/format terms detected; consider specifying expected outputs | Warning |
Total | 13 / 16 Passed | |
Implementation
20%This skill content reads like marketing copy rather than actionable instructions. It explains what visual regression testing is and when to use it (which Claude already knows) but fails to provide any executable commands, configuration examples, or tool-specific guidance for Percy, Chromatic, or BackstopJS. The examples describe outcomes rather than showing concrete implementation steps.
Suggestions
Replace the abstract 'How It Works' section with executable code examples showing actual commands for at least one tool (e.g., `npx percy snapshot ./snapshots` or BackstopJS config)
Add concrete configuration snippets showing API key setup, viewport definitions, and baseline management for the mentioned tools
Include validation steps and error handling guidance (e.g., 'If diff threshold exceeds X%, review changes before approving')
Remove the 'When to Use This Skill' section entirely - this information belongs in the YAML frontmatter description, not the body
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The content is verbose and explains concepts Claude already knows (what visual regression testing is, how screenshots work). The 'How It Works' and 'When to Use' sections describe rather than instruct, wasting tokens on obvious information. | 1 / 3 |
Actionability | No executable code, commands, or concrete configuration examples are provided. The skill describes what it 'will do' abstractly but never shows actual tool commands, API calls, or configuration snippets for Percy, Chromatic, or BackstopJS. | 1 / 3 |
Workflow Clarity | Steps are listed (capture, compare, analyze) but lack concrete validation checkpoints, error handling, or feedback loops. No guidance on what to do when tests fail or how to update baselines. | 2 / 3 |
Progressive Disclosure | Content is reasonably organized with clear sections, but everything is inline with no references to detailed configuration guides or tool-specific documentation. The 'Integration' section hints at more but provides no links. | 2 / 3 |
Total | 6 / 12 Passed |
Activation
100%This is a well-crafted skill description that excels across all dimensions. It provides specific capabilities with named tools, includes comprehensive trigger terms that users would naturally say, explicitly states both what the skill does and when to use it, and occupies a distinct niche that minimizes conflict with other skills.
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | Lists multiple specific concrete actions: 'execute visual regression tests', 'captures screenshots', 'compares them against baselines', 'analyzes visual differences', and names specific tools (Percy, Chromatic, BackstopJS). | 3 / 3 |
Completeness | Clearly answers both what (execute visual regression tests, capture screenshots, compare baselines, analyze differences) AND when (explicit 'Use this skill when...' clause with specific trigger phrases listed). | 3 / 3 |
Trigger Term Quality | Excellent coverage of natural terms users would say: 'visual test', 'UI regression', 'check visual changes', '/visual-test', plus contextual terms like 'web application', 'component', 'UI change verification'. | 3 / 3 |
Distinctiveness Conflict Risk | Clear niche focused specifically on visual regression testing with distinct triggers like 'visual test', 'UI regression', and specific tool names that are unlikely to conflict with general testing or screenshot skills. | 3 / 3 |
Total | 12 / 12 Passed |
Reviewed
Table of Contents
Is this your skill?
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.