Visual Regression Testing

This skill provides comprehensive visual regression testing capabilities to detect unintended visual changes in UI components and prevent visual bugs from being merged into production.

Overview

Visual regression testing works by:

1. Taking screenshots of components/pages in a known-good state (baselines)
2. Taking new screenshots after code changes
3. Comparing new screenshots with baselines pixel-by-pixel
4. Flagging differences for human review

Framework: Playwright + jest-image-snapshot Approach: Based on Ant Design's visual regression testing methodology

Core Capabilities

1. Screenshot Baseline Management