Visual regression setup

Skill a5c-ai/babysitter/library/specializations/desktop-development/skills/visual-regression-setup

Babysitter enforces obedience on agentic workforces and enables them to manage extremely complex tasks and workflows through deterministic, hallucination-free self-orchestration

Install

npx -y skills add a5c-ai/babysitter --skill visual-regression-setup

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

What its author says it does

Copied from the file, not written here

Configure visual regression testing with Percy, Chromatic, or custom screenshot comparison

SKILL.md

2.0 KB, as published. Nobody here has run it

visual-regression-setup

Configure visual regression testing for desktop applications to catch unintended UI changes.

Capabilities

Configure Percy integration
Set up Chromatic for Storybook
Custom screenshot comparison
Configure threshold settings
Handle dynamic content masking
Set up CI/CD integration

Input Schema

{
  "type": "object",
  "properties": {
    "projectPath": { "type": "string" },
    "provider": { "enum": ["percy", "chromatic", "reg-suit", "custom"] },
    "framework": { "enum": ["playwright", "cypress", "puppeteer"] }
  },
  "required": ["projectPath"]
}

Percy Integration

// playwright.config.js
import { defineConfig } from '@playwright/test';

export default defineConfig({
  use: {
    screenshot: 'only-on-failure'
  }
});

// test.spec.js
import { test } from '@playwright/test';
import percySnapshot from '@percy/playwright';

test('visual test', async ({ page }) => {
  await page.goto('/');
  await percySnapshot(page, 'Home page');
});

Custom Comparison

const { toMatchImageSnapshot } = require('jest-image-snapshot');
expect.extend({ toMatchImageSnapshot });

test('matches screenshot', async () => {
  const screenshot = await page.screenshot();
  expect(screenshot).toMatchImageSnapshot({
    failureThreshold: 0.01,
    failureThresholdType: 'percent'
  });
});

Related Skills

playwright-electron-config
desktop-ui-testing process