visual-regression-upgrade

Capture full-page screenshots with Playwright and compare pixel differences using numpy.

Updated Jun 18, 2026

Search Tags:#web testing #visual regression #screenshot comparison #web application testing #layout testing

Ready to run

npx skills add https://github.com/muskie9/agents --skill visual-regression-upgrade

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: visual-regression-upgrade
Source: https://github.com/muskie9/agents/tree/main/skills/visual-regression-upgrade
Command: npx skills add https://github.com/muskie9/agents --skill visual-regression-upgrade

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires playwright, pillow, numpy, requests, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill automates visual regression testing between two web environments, ensuring that web applications look identical after upgrades or changes.

Core Features & Use Cases

Visual Regression Testing: Capture screenshots of web pages in two environments and generate pixel-diff reports.
Comparative Analysis: Identify visual differences between production and upgraded environments (e.g., production vs UAT, local vs local upgraded).
Use Case: Before deploying a major version upgrade, use this Skill to ensure that the front-end of the application remains consistent and free of layout issues.

Quick Start

Use the visual-regression-upgrade skill to compare the visual appearance of 'https://www.example.com' against 'https://uat.example.com'.

Frequently Asked Questions about visual-regression-upgrade

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I automate visual regression testing between two web environments?▼

Automate visual regression testing between two web environments by capturing full-page screenshots with Playwright and comparing them using Pillow and numpy for pixel-level differences. This generates a diff report to detect visual regressions during development.

How do I compare screenshots of web pages to detect layout issues before deployment?▼

Compare screenshots of web pages to detect layout issues by capturing full-page images from both production and upgraded environments. The process generates a pixel-diff report highlighting visual differences before deployment.

Does this visual regression testing approach work with Playwright for browser automation?▼

Yes, visual regression testing works directly with Playwright for browser automation. It uses Playwright to capture full-page screenshots of the specified web application URLs across different environments.

Can I use screenshot comparison for web application testing across local and UAT environments?▼

Yes, you can use screenshot comparison for web application testing across local and UAT environments. The process captures full-page screenshots from both environments and compares them for visual differences.

What is the best way to check for visual regressions after a version upgrade?▼

The best way to check for visual regressions after a version upgrade is to capture full-page screenshots from both the current and upgraded environments, then use numpy for numerical comparisons to generate a pixel-diff report.

Do I need to install specific dependencies to run visual regression tests?▼

Yes, you need to install Playwright, Pillow, numpy, and requests to run visual regression tests. These dependencies handle browser automation, image processing, numerical comparisons, and HTTP requests respectively.