Ready to supercharge your AI agents?

Install any skill in seconds. Free to start, no credit card required.

Get Started Free →

Percy Visual Testing Skill · a5c-ai | DecimalAI

a5c-ai/Percy Visual Testing

SkillScore87Maintained

Percy visual testing platform integration for visual regression detection

Testingby a5c-ai

Links this skill to your agents and keeps it current with the author’s updates.

Automatic

QA & Test Engineering pack

1 · One-time — install the CLI (docs ↗)

pip install decimalai

2 · Get the skill — writes .claude/skills/a5c-ai-percy-visual-testing/SKILL.md

decimalai skills pull a5c-ai-percy-visual-testing --out .claude/skills/

No CLI? Get the same file — curl · raw file

curl -fsSL --create-dirs -o .claude/skills/a5c-ai-percy-visual-testing/SKILL.md https://app.decimal.ai/s/a5c-ai-percy-visual-testing/SKILL.md

Raw file: /s/a5c-ai-percy-visual-testing/SKILL.md ↗ · machine-readable summary at /s/a5c-ai-percy-visual-testing.json ↗

In productionGlobal

how this skill behaves on real traffic · last 30 days

No production data for this skill yet — usage numbers appear here once agents start running it.

Anonymized aggregate across every org using this skill — proof from real production use, not a demo.

Does this skill help? · Benchmark: with vs. withoutsign in to run this on your agents

23 test cases from the publisher’s eval.yaml · each run twice on gemini-3.6-flash — with the skill injected, then without · last run 26d ago

Yes — +39% lift+2% tokens0% turns87% of whole cases pass with skill (20/23)

Test case	Without → With	Effect	Δ tokens	Δ turns
case-01	✗→✓	▲ Improved	7%	0%
case-03	✗→✓	▲ Improved	-34%	0%
case-07	✗→✓	▲ Improved	22%	0%
case-08	✗→✓	▲ Improved	-11%	0%
case-10	✗→✓	▲ Improved	28%	0%

Showing 5 of 23 cases

SkillSafety

✓ 3 of 3 passed

Code scan15 of 15 checks clean

0 critical · 0 warning · 0 info — scanner v4 — 8/10/2026

live_secretremote_code_executionreverse_shelldata_exfiltrationssrf_metadataagent_snoopinganti_refusaldestructive_commandsobfuscated_unicodeunicode_homoglyphopaque_blobsuspicious_urltool_overreachtrigger_abuseprompt_injection_phrasing

IntentSafe

LLM judge · does the skill do what it claims

ContentClean

LLM judge · policy & harmful-content review

Source

Imported

a5c-ai / babysitter

library/specializations/qa-testing-automation/skills/percy-visual/SKILL.md

View on GitHub ↗

License MITImported 8/10/2026Version v1

Skill contents

SKILL.md

Percy Visual Testing Skill

Overview

This skill provides expert-level capabilities for Percy-based visual testing, enabling snapshot capture, visual diff analysis, and seamless CI/CD integration.

Capabilities

Snapshot Capture

Capture visual snapshots across viewports
Configure responsive testing breakpoints
Handle dynamic content masking
Full-page and element snapshots

Visual Diff Analysis

Analyze visual diffs between builds
Identify intentional vs unintentional changes
Configure diff sensitivity

Baseline Management

Manage Percy baseline approvals
Handle baseline branching
Configure auto-approval rules

CI/CD Integration

Configure Percy with CI/CD pipelines
GitHub/GitLab integration
Pull request visual reviews

Framework Integration

Integrate with Playwright
Integrate with Cypress
Integrate with Selenium
Storybook integration

Target Processes

visual-regression.js - Visual regression testing
e2e-test-suite.js - E2E with visual validation
cross-browser-testing.js - Cross-browser visual testing

Dependencies

@percy/cli - Percy CLI
@percy/playwright / @percy/cypress - Framework SDKs
Percy account and token

Usage Example

javascript
{
  kind: 'skill',
  skill: {
    name: 'percy-visual',
    context: {
      action: 'capture-snapshots',
      testSuite: 'e2e',
      widths: [375, 768, 1280],
      branch: 'feature/new-design'
    }
  }
}

Configuration

The skill requires a Percy token and can be configured to work with various testing frameworks.

Illustrative Want to see what a5c-ai/Percy Visual Testing would put in front of your model? Preview the rendered body and check its trigger phrases — no LLM call, no signup.

Latest benchmark · publisher runVerified

8/29/2026, 21:37 UTC · 23 cases

Lift

+39%

87% vs 48%

Agent turns

0%

1.0 vs 1.0

Tokens

+2%

2,456.87 vs 2,401.91

fail → pass · 11pass → pass · 9fail → fail · 1pass → fail · 2

Per-case results (23)

Case	Status	Duration (ms)			Turns			Tokens			Tool calls
Case	Status	Without	With	Δ	Without	With	Δ	Without	With	Δ	Without	With	Δ
case-01 We are adding visual regression testing to our Playwright suite. Please provide a test setup and sample spec file that captures full-page snapshots across desktop and mobile breakpoints while hiding dynamic elements like live timestamps.	fail→pass	16,579	25,047	+51%	1	1	0%	3,165	3,374	+7%	0	0	—
case-02 We want to capture visual snapshot comparisons in our Cypress E2E test suite for our dashboard UI. Show how to write the test command and execute the suite in CI so visual diffs are uploaded for cloud review.	pass→pass	16,017	9,952	-38%	1	1	0%	2,848	2,304	-19%	0	0	—
case-03 We have a Selenium WebDriver test suite in Java and need to capture visual snapshots across desktop and mobile screen sizes during test execution. Provide the code setup for taking full-page visual snapshots for cloud diff analysis.	fail→pass	28,109	13,349	-53%	1	1	0%	4,712	3,120	-34%	0	0	—
case-04 We have a large Storybook UI component library and want to run automated visual regression checks across all stories in CI. What package and command should be configured?	fail→fail	11,485	6,611	-42%	1	1	0%	2,034	1,639	-19%	0	0	—
case-05 We are setting up GitHub Actions to run automated visual testing on every pull request. What environment variable credential must be configured in the workflow for snapshot uploads to be authorized?	pass→pass	7,727	3,302	-57%	1	1	0%	1,399	979	-30%	0	0	—
case-06 Design a GitHub Actions workflow step that executes Cypress visual snapshot tests on pull requests to enable visual reviews before merging. Show the CLI wrapper command used to execute Cypress.	pass→pass	12,596	11,401	-9%	1	1	0%	2,204	2,482	+13%	0	0	—
case-07 In our Playwright E2E visual tests, customer account numbers and dynamic stock tickers change on every render, causing false positive visual diffs. How do we hide or mask these dynamic DOM elements during visual snapshot capture?	fail→pass	12,747	12,513	-2%	1	1	0%	2,336	2,839	+22%	0	0	—
case-08 We need visual snapshots taken at mobile (375px), tablet (768px), and desktop (1280px) widths in our Playwright tests. Show how to configure these responsive viewports when calling the snapshot function.	fail→pass	11,183	6,712	-40%	1	1	0%	2,069	1,846	-11%	0	0	—
case-09 When developers open feature branches in Git, how does automated visual diffing determine which baseline image to compare against for new snapshot uploads?	pass→pass	16,226	14,698	-9%	1	1	0%	2,716	2,631	-3%	0	0	—
case-10 We frequently update low-risk UI components across hundreds of pages. How can minor intentional visual baseline changes on target branches be managed without requiring manual reviewer clicks for every single snapshot?	fail→pass	14,804	16,918	+14%	1	1	0%	2,369	3,036	+28%	0	0	—
case-11 Instead of snapping the full page, we only want to visual test a specific search navigation header bar using Cypress. How do we limit snapshot capture to that element?	pass→pass	9,640	9,536	-1%	1	1	0%	1,686	2,101	+25%	0	0	—
case-12 Font anti-aliasing rendering variations between OS environments produce tiny pixel noise in visual diff comparisons. How can we adjust visual diff tolerance or sensitivity settings in our project configuration?	fail→pass	12,800	14,282	+12%	1	1	0%	2,282	2,933	+29%	0	0	—
case-13 Provide a `.gitlab-ci.yml` job definition that runs visual snapshot capture for Playwright E2E tests, ensuring PR visual reviews work properly.	fail→pass	14,308	12,684	-11%	1	1	0%	2,604	2,335	-10%	0	0	—
case-14 We want to verify visual renders across Chrome, Firefox, and Safari for our web app using automated visual testing. How are cross-browser rendering engines specified and executed?	pass→pass	16,711	14,719	-12%	1	1	0%	2,796	3,126	+12%	0	0	—
case-15 We are structuring a dedicated visual testing process script `visual-regression.js` using Node.js. Outline the module setup and CLI runner dependencies for capturing snapshots across multiple routes.	fail→pass	16,971	15,551	-8%	1	1	0%	3,474	2,839	-18%	0	0	—
case-16 In `e2e-test-suite.js`, we want to combine functional assertion checks with visual snapshot validation points after key user interactions. Show a sample Playwright test performing both.	fail→pass	12,522	12,605	+1%	1	1	0%	2,431	2,340	-4%	0	0	—
case-17 What CLI package must be installed as a devDependency to wrap test execution and upload DOM snapshots for cloud visual regression testing?	pass→pass	6,411	2,883	-55%	1	1	0%	944	828	-12%	0	0	—
case-18 We have Storybook stories with component variants. How can we automatically scan and capture visual snapshots across all stories without taking manual browser screenshots or writing custom URL scripts?	fail→pass	12,684	11,845	-7%	1	1	0%	2,208	2,416	+9%	0	0	—
case-19 CSS animations and spinning loaders cause flaky visual snapshot differences in visual regression testing. How should CSS animations and transitions be handled during visual snapshot capture?	fail→pass	17,655	17,391	-1%	1	1	0%	2,716	3,372	+24%	0	0	—
case-20 We need to write a Playwright test to verify that submitting a contact form displays a text success message 'Thank you for reaching out!' and redirects the URL to '/thank-you'. Provide the Playwright test code.	pass→fail	6,039	7,316	+21%	1	1	0%	1,208	1,635	+35%	0	0	—
case-21 Write a Cypress test that sends a POST request to `/api/v1/login` with user credentials, asserts the HTTP response status code is 200, and verifies the response body contains a JWT token field.	pass→pass	10,011	5,950	-41%	1	1	0%	1,603	1,595	-0%	0	0	—
case-22 We want to check our web pages for WCAG 2.1 AA accessibility compliance defects (such as missing alt text and contrast ratios) in automated E2E tests using Playwright. Provide the setup and test implementation.	pass→fail	16,277	18,555	+14%	1	1	0%	2,905	4,028	+39%	0	0	—
case-23 We need to collect JavaScript code coverage reports during Cypress E2E test runs to measure statement and branch execution percentage across frontend files. How do we configure Cypress for code coverage?	pass→pass	13,355	15,852	+19%	1	1	0%	2,535	2,710	+7%	0	0	—

These cases were also screened by the skill’s intent / safety pass.See the Trust review ↗Reproduce this benchmark in Colab ↗

How this skill was measured

DecimalAI ran this skill against gemini-3.6-flash twice over the same eval suite — once with the skill loaded and once without — and compared the two runs case by case. 23 cases were attempted. The headline lift of +39 percentage points is the difference between those two pass rates over the 23 comparable cases. 2 cases got worse with the skill loaded, and they are included in that figure.

Model measured: gemini-3.6-flash
Graded by: gemini-3.6-flash
Grading method: judged
Verification: verified
Pass rate without the skill: 47.8%
Pass rate with the skill: 87%
Cases attempted: 23
Cases counted toward lift: 23
Cases that regressed: 2
Skill version measured: v1
Run completed: 8/29/2026, 21:37 UTC

Measured example — same prompt, with vs. without the skill · from the benchmark run · case case-01

Prompt

We are adding visual regression testing to our Playwright suite. Please provide a test setup and sample spec file that captures full-page snapshots across desktop and mobile breakpoints while hiding dynamic elements like live timestamps.

Without the skill loaded, the model failed this case. With it loaded, the same prompt on the same model passed. This is one improved case from the latest verified run; every case, including any that regressed, is in the table above.

Show both answers

SkillScore blends 4 signals1 of 4 complete

BenchmarkPass rate WITH skill on a verified run87

Live evalNeeds ≥10 evaluated traces in 30 days

AI ratingNeeds ≥10 rated traces

AdoptionNeeds ≥10 serves across ≥2 orgs in 30 days

Efficiency · separate axis (at equal correctness)+0% turns+0% tokens

Shown for transparency; not credited unless a verified run shows no correctness regression.

Backed by 1 of 4 signals — each added signal makes the score more robust.

Verified on gemini-3.6-flash · re-tested 25 days ago

Other measured skills in the registry, with their headline benchmark lift.