visual-testing

Visual regression testing with Chromatic, Lost Pixel, and Playwright snapshots. Use when detecting UI changes, maintaining visual consistency, reviewing design changes, or setting up screenshot comparison in CI/CD.

Quality

77%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./skills/visual-testing/SKILL.md

Quality

Content

57%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

The body is highly actionable with executable code for all three tools and useful troubleshooting, but it is overlong with duplicated sections, caps its baseline-update workflows without validation checkpoints, and ships broken reference paths that undermine its progressive-disclosure structure.

Suggestions

Fix the References section paths to match the actual bundle: rename 'references/lost-pixel-self-hosted.md' to 'references/lost-pixel-setup.md' and create 'references/playwright-snapshots.md' (or drop the entry), so navigation to detail files works.

Add a validation checkpoint before baseline updates — e.g., 'review the diffs in the reporter output before running --update-snapshots or --auto-accept-changes' — so batch baseline acceptance can't silently swallow regressions.

Tighten the body: collapse the duplicated Quick Start vs. full Chromatic sections, drop the ASCII PR workflow diagram and the free-tier table (it duplicates the comparison matrix), and move Best Practices detail into the reference files.

Dimension	Reasoning	Score
Conciseness	Mostly code-driven, but the ~420-line body repeats install/run/CI instructions between the 'Quick Start' and later sections, includes an ASCII PR-workflow diagram explaining what CI does, and has a free-tier table that duplicates the later comparison matrix. Per the 3 anchor this is 'mostly efficient but includes some unnecessary explanation or could be tightened'; the 4 anchor would require only minor trimmable spots.	3 / 5
Actionability	Concrete, copy-paste-ready commands and configs throughout (`npm install --save-dev chromatic`, `npx playwright test --update-snapshots`, full test/CI/Docker YAML blocks) covering the common cases. Minor gaps — two config snippets call `defineConfig` without its import and `use: { screenshot: 'on' }` is not a standard Playwright option — keep it below the fully-executable 5 anchor.	4 / 5
Workflow Clarity	The Quick Start and PR workflow give a clear sequence, but baseline management is a batch operation ('npx playwright test --update-snapshots', 'npx chromatic --auto-accept-changes # Accept all changes') with no validate-the-diffs-before-accepting checkpoint. Per the rubric's cap, missing validation in batch workflows holds this at 3 despite otherwise good sequencing.	3 / 5
Progressive Disclosure	Sections are well organized and the References section clearly signals detail files, but 2 of the 3 referenced paths are broken against the actual bundle: 'references/lost-pixel-self-hosted.md' is actually 'lost-pixel-setup.md' and 'references/playwright-snapshots.md' does not exist. Structure matches the 3 anchor ('could be better organized'); broken navigation prevents the 4 anchor's 'references mostly clear'.	3 / 5
	Total	13 / 20 Passed

Description

87%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A strong description: it names the domain and concrete tools, states capabilities specifically, and includes an explicit multi-trigger 'Use when' clause in third person. Only minor synonym coverage ('visual diff', 'snapshot testing') is missing.

Dimension	Reasoning	Score
Specificity	Names the domain ('Visual regression testing') with concrete tools (Chromatic, Lost Pixel, Playwright) and several specific actions ('detecting UI changes', 'maintaining visual consistency', 'reviewing design changes', 'setting up screenshot comparison in CI/CD'). Falls short of the 5 anchor's comprehensive multi-action coverage and clearly exceeds the 1-2 actions of the 3 anchor.	4 / 5
Completeness	Explicitly answers both 'what' ('Visual regression testing with Chromatic, Lost Pixel, and Playwright snapshots') and 'when' with four concrete trigger phrases ('Use when detecting UI changes, maintaining visual consistency, reviewing design changes, or setting up screenshot comparison in CI/CD'). Matches the 5 anchor exactly; the 4 anchor would require a less explicit 'when' clause.	5 / 5
Trigger Term Quality	Includes natural phrases users would say — 'UI changes', 'visual consistency', 'design changes', 'screenshot comparison in CI/CD' — plus well-known tool names. A few common synonyms like 'visual diff' or 'snapshot testing' are missing, keeping it below the 5 anchor's comprehensive synonym coverage.	4 / 5
Distinctiveness Conflict Risk	Clear niche (visual regression testing with named tools) and distinct triggers make wrong-skill invocation unlikely; only negligible overlap with generic testing or design-review skills. Fits the 5 anchor's 'clear niche with distinct triggers; minimal conflict risk'.	5 / 5
	Total	18 / 20 Passed

Validation

93%

Warnings & errors only

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 15 / 16 Passed

Validation for skill structure

Criteria	Description	Result
referenced_paths_exist	Referenced path issues: 2 missing	Warning

	Total	15 / 16 Passed

Repository: fernandezbaptiste/Skrillz
Path: skills/visual-testing/SKILL.md
Commit: 93ed392

Reviewed: 14 hours ago

Table of Contents

Discovery Implementation Validation

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.