Sponsor Suno AI Music arrow_forward
Plugin

Visual Regression Tester

Visual diff testing with Percy, Chromatic, BackstopJS - catch unintended UI changes

Type
Plugin
GitHub stars
2.8k
License
MIT
Repo last updated
Sep 27, 2026
Version
1.25.0
Author
Claude Code Plugin Hub

What Visual Regression Tester is

Visual Regression Tester is a plugin published in the jeremylongshore/tons-of-skills-marketplace repository on GitHub, which has about 2.8k stars. The repository describes itself as: “Model-agnostic agent-skills platform with a harness-free canonical layer, verified adapters, and the ccpi package manager. Explore at tonsofskills.com.”

A plugin is a package that bundles skills, slash commands, subagents, hooks, and MCP connectors so they install together. Plugins are plain files with a manifest at .claude-plugin/plugin.json, and they work in both Claude Code and Claude Cowork.

Installing Visual Regression Tester adds everything it ships in one step. Connectors inside a plugin still need to be connected separately, and hooks and subagents only run in Cowork and Claude Code, not in regular chat.

How to install Visual Regression Tester

Claude Code

  1. Add the repository as a plugin marketplace: claude plugin marketplace add jeremylongshore/tons-of-skills-marketplace
  2. Install the plugin: claude plugin install visual-regression-tester@<marketplace-name>, using the marketplace name from the repository's .claude-plugin/marketplace.json.
  3. Restart the session if the new skills or commands don't appear straight away.

Claude Cowork

  1. Open Customize → Plugins and choose Add marketplace.
  2. Enter jeremylongshore/tons-of-skills-marketplace (the owner/repo shorthand works for GitHub).
  3. Find Visual Regression Tester in the list, click Install, then connect any connectors it needs from its Connectors tab.

New to extending Cowork? Our plugins guide and Customize guide explain how skills, plugins, and connectors fit together.

Inside the source file

An excerpt from plugins/testing/visual-regression-tester/.claude-plugin/plugin.json, shared under the repository's MIT license. Read the full file on GitHub.

Visual diff testing with Percy, Chromatic, BackstopJS - catch unintended UI changes.

Installation

/plugin install visual-regression-tester@claude-code-plugins-plus

Usage

/visual-test
# or shortcut
/vt

Features

  • Screenshot Comparison: Pixel-perfect visual diffs
  • Multi-Tool Support: Percy, Chromatic, BackstopJS, Playwright
  • Responsive Testing: Multiple viewport sizes
  • Smart Analysis: Classify intentional vs unintended changes
  • CI/CD Integration: Automated visual testing in pipelines
  • Baseline Management: Selective baseline updates

Example Workflow

# Run visual regression tests
/visual-test

# Claude performs:
#  Screenshot capture
#  Baseline comparison
#  Visual diff analysis
#  Change classification

Supported Tools

  • Percy
  • Chromatic
  • BackstopJS
  • Playwright
  • Puppeteer
  • Cypress

Files

  • commands/visual-test.md - Main visual testing command

License

MIT

Before you install

  • Read the whole file first. Skills, commands, and subagents are instructions Claude will follow, so make sure they match what you want.
  • Check which tools, scripts, or MCP servers it uses. Local servers and scripts run with your permissions.
  • Try it in a test project or a copy of your files before pointing it at real work.
  • Pin the version you tested, and review changes before updating.
  • Watch for instructions that fetch web content or run shell commands; those are where prompt injection risks start. See our prompt injection guide.

FAQ

What is Visual Regression Tester?

Visual Regression Tester is a plugin for Claude Code and Claude Cowork from the jeremylongshore/tons-of-skills-marketplace repository on GitHub. Visual diff testing with Percy, Chromatic, BackstopJS - catch unintended UI changes

How do I install Visual Regression Tester in Claude Code?

Add the repository as a plugin marketplace: claude plugin marketplace add jeremylongshore/tons-of-skills-marketplace Install the plugin: claude plugin install visual-regression-tester@<marketplace-name>, using the marketplace name from the repository's .claude-plugin/marketplace.json. Restart the session if the new skills or commands don't appear straight away.

Can I use Visual Regression Tester in Claude Cowork?

Open Customize → Plugins and choose Add marketplace. Enter jeremylongshore/tons-of-skills-marketplace (the owner/repo shorthand works for GitHub). Find Visual Regression Tester in the list, click Install, then connect any connectors it needs from its Connectors tab.

Is Visual Regression Tester safe to install?

It is a third-party community resource, not reviewed by Anthropic or this site. Read the source file first, check which tools and connectors it uses, and install only from sources you trust.

Similar resources

Browse all skills, subagents, and plugins →

Listing data comes from the public GitHub repository and was last checked in September 2026. Excerpts are © their authors and shared under MIT. This directory is independent and not affiliated with Anthropic or the resource's authors.