intent-solutions-io/Performing Visual Regression Testing
010-archive/backups-20251108/plugin-enhancements/plugin-backups/visual-regression-tester_20251020_010648/skills/skill-adapter/SKILL.md
This skill enables Claude to execute visual regression tests using tools like Percy, Chromatic, and BackstopJS. It captures screenshots, compares them against baselines, and analyzes visual differences to identify unintended UI changes. Use this skill when the user requests visual testing, UI change verification, or regression testing for a web application or component. Trigger phrases include "visual test," "UI regression," "check visual changes," or "/visual-test".
$ install --global
skillsauthnpx skillsauth add intent-solutions-io/plugins-nixtla Performing Visual Regression TestingInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Apr 5, 2026, 11:46 PM4.3s4 files scanned
SKILL.md
- name:
- Performing Visual Regression Testing
- description:
- |
Overview
This skill empowers Claude to automatically detect unintended UI changes by performing visual regression tests. It integrates with popular visual testing tools to streamline the process of capturing screenshots, comparing them against baselines, and identifying visual differences.
How It Works
- Capture Screenshots: Captures screenshots of specified components or pages using the configured visual testing tool.
- Compare Against Baselines: Compares the captured screenshots against established baseline images.
- Analyze Visual Diffs: Identifies and analyzes visual differences between the current screenshots and the baselines.
When to Use This Skill
This skill activates when you need to:
- Detect unintended UI changes introduced by recent code modifications.
- Verify the visual consistency of a web application across different browsers or environments.
- Automate visual regression testing as part of a CI/CD pipeline.
Examples
Example 1: Verifying UI Changes After a Feature Update
User request: "Run a visual test on the homepage to check for any UI regressions after the latest feature update."
The skill will:
- Capture a screenshot of the homepage.
- Compare the screenshot against the baseline image of the homepage.
- Report any visual differences detected, highlighting potential UI regressions.
Example 2: Checking Visual Consistency Across Browsers
User request: "Perform a visual regression test on the product details page to ensure it renders correctly in Chrome and Firefox."
The skill will:
- Capture screenshots of the product details page in both Chrome and Firefox.
- Compare the screenshots against the respective baseline images for each browser.
- Identify and report any visual inconsistencies detected between the browsers.
Best Practices
- Configuration: Ensure the visual testing tool is properly configured with the correct API keys and project settings.
- Baselines: Maintain accurate and up-to-date baseline images to avoid false positives.
- Viewport Sizes: Define appropriate viewport sizes to cover different screen resolutions and devices.
Integration
This skill can be integrated with other Claude Code plugins to automate end-to-end testing workflows. For example, it can be combined with a testing plugin to run visual tests after functional tests have passed.
Related Skills
intent-solutions-io/managing-test-environments
testing
VerifiedTrustedCommunity
This skill enables Claude to manage isolated test environments using Docker Compose, Testcontainers, and environment variables. It is used to create consistent, reproducible testing environments for software projects. Claude should use this skill when the user needs to set up a test environment with specific configurations, manage Docker Compose files for test infrastructure, set up programmatic container management with Testcontainers, manage environment variables for tests, or ensure cleanup after tests. Trigger terms include "test environment", "docker compose", "testcontainers", "environment variables", "isolated environment", "env-setup", and "test setup".
6SKILL.mdUpdated Jun 5, 2026
intent-solutions-io/generating-test-doubles
tools
VerifiedTrustedCommunity
This skill uses the test-doubles-generator plugin to automatically create mocks, stubs, spies, and fakes for unit testing. It analyzes dependencies in the code and generates appropriate test doubles based on the chosen testing framework, such as Jest, Sinon, or others. Use this skill when you need to generate test doubles, mocks, stubs, spies, or fakes to isolate units of code during testing. Trigger this skill by requesting test double generation or using the `/gen-doubles` or `/gd` command.
6SKILL.mdUpdated Jun 5, 2026
intent-solutions-io/generating-test-data
tools
VerifiedTrustedCommunity
This skill enables Claude to generate realistic test data for software development. It uses the test-data-generator plugin to create users, products, orders, and custom schemas for comprehensive testing. Use this skill when you need to populate databases, simulate user behavior, or create fixtures for automated tests. Trigger phrases include "generate test data", "create fake users", "populate database", "generate product data", "create test orders", or "generate data based on schema". This skill is especially useful for populating testing environments or creating sample data for demonstrations.
6SKILL.mdUpdated Jun 5, 2026
intent-solutions-io/analyzing-test-coverage
development
VerifiedTrustedCommunity
This skill analyzes code coverage metrics to identify untested code and generate comprehensive coverage reports. It is triggered when the user requests analysis of code coverage, identification of coverage gaps, or generation of coverage reports. The skill is best used to improve code quality by ensuring adequate test coverage and identifying areas for improvement. Use trigger terms like "analyze coverage", "code coverage report", "untested code", or the shortcut "cov".
6SKILL.mdUpdated Jun 5, 2026