visual-testing

Official

Prevent UI regressions with repeatable visuals.

Authorterraphim
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Visual changes in UI can drift between deployments, releases, or design iterations, leading to unnoticed regressions. This Skill provides repeatable baselines and diff-based checks to catch regressions early and maintain UI consistency.

Core Features & Use Cases

  • Deterministic rendering: fix viewport size, disable animations, and seed data to produce stable screenshots across runs.
  • Baseline management & CI integration: store reference images in-repo or a review service and automatically compare new screenshots against baselines in CI pipelines.
  • Use Case: when updating a component library or styling, automatically detect visual drift and surface it for quick review and rollback if needed.

Quick Start

Install and configure a visual testing workflow for your UI project. Set a fixed viewport, enable Playwright-based screenshot tests, capture baseline images for key pages or components, and run the CI job to validate against baselines.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: visual-testing
Download link: https://github.com/terraphim/terraphim-skills/archive/main.zip#visual-testing

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.