CtrlK
BlogDocsLog inGet started
Tessl Logo

vitest-visual-testing

Make @uiverify/vitest (Vitest browser-mode) captures deterministic so component visual tests stop coming back "changed" without a real change (flaky diffs). Use when setting up or debugging visual tests over Vitest browser-mode component tests. Focuses only on the run-to-run variation the capturer can't neutralize from outside your app — above all live/dynamic data, the highest-value step (freeze it with static fixtures and the whole content-noise class disappears), plus the clock, infinite JS animations, and non-Math.random randomness, and the one Vitest-specific trap - capturing before the component has settled.

72

Quality

87%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Passed

No findings from the security scan

SKILL.md
Quality
Evals
Security

Quality

Content

82%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.

A well-organized, highly actionable checklist skill with executable examples and a clear sequenced workflow. Slightly verbose in spots and has no explicit validation feedback loop, though the task nature does not strictly demand one.

Suggestions

Collapse the duplicated 'freeze the data' framing between the Mental model section and step 1 to trim repetition.

Add a short validate/retry note (e.g. re-run the single visual test after each fix) to give the checklist an explicit feedback loop.

Tighten the Mental model paragraph, which re-explains component isolation benefits that the target reader already infers.

DimensionReasoningScore

Conciseness

Dense and tool-specific with no basic-concept padding; minor repetition (the 'freeze the data' headline recurs in the mental model and step 1) keeps it just below lean.

4 / 5

Actionability

Copy-paste-ready code throughout — vitest.config plugin setup, fake-timer block, isUIVerify helper, vi.mock and render examples — covering the common cases.

5 / 5

Workflow Clarity

A clear numbered 1–5 checklist with explicit priority ('the one that actually matters'); this is configuration guidance rather than a destructive/batch op, so no validate-retry loop is required, but none is provided either.

4 / 5

Progressive Disclosure

No bundle files exist; the single self-contained SKILL.md is well-sectioned with one clearly-signaled cross-skill pointer (playwright-visual-testing) and one in-repo reference (docs-visual.browser.test.ts), all one level deep.

4 / 5

Total

17

/

20

Passed

Description

92%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, specific description that clearly answers both what and when with concrete trigger phrases and a well-scoped niche. Minor room to broaden trigger-term synonyms.

DimensionReasoningScore

Specificity

Lists multiple concrete actions — 'freeze it with static fixtures', 'the clock', 'infinite JS animations', 'non-Math.random randomness', 'capturing before the component has settled' — covering the determinism surface comprehensively.

5 / 5

Completeness

Explicitly states what ('Make @uiverify/vitest captures deterministic so component visual tests stop coming back changed') and when ('Use when setting up or debugging visual tests over Vitest browser-mode component tests') with concrete trigger phrases.

5 / 5

Trigger Term Quality

Natural phrases like 'visual tests', 'flaky diffs', and 'Vitest browser-mode component tests' are present, but synonym coverage is thin and no file extensions or alternate phrasings appear.

4 / 5

Distinctiveness Conflict Risk

A clear niche (Vitest browser-mode visual determinism) with distinct triggers, explicitly scoped away from the real-page concern, giving minimal conflict risk.

5 / 5

Total

19

/

20

Passed

Validation

100%

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

Validation16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
FranciscoMoretti/chat-js
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.