playwright-visual-testing
CommunityAutomate visual regression testing
Authorbradtaylorsf
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill addresses the challenge of ensuring visual consistency across different browsers, devices, and application states by automating visual regression testing with Playwright.
Core Features & Use Cases
- Screenshot Assertions: Capture full-page or element-specific screenshots and compare them against baseline images.
- Dynamic Content Handling: Mask dynamic elements, wait for animations, or replace content to ensure stable and reliable visual tests.
- Responsive Testing: Test UIs across multiple viewports and device emulations.
- Theming & States: Verify visual appearance in different themes (e.g., dark mode) and component states (e.g., hover, focus, disabled).
- Use Case: Automatically catch unintended UI changes in your web application after a code deployment by comparing new screenshots against a golden set.
Quick Start
Use the playwright-visual-testing skill to capture a screenshot of the current page and save it as 'homepage.png'.
Dependency Matrix
Required Modules
None requiredComponents
references
💻 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: playwright-visual-testing Download link: https://github.com/bradtaylorsf/alphaagent-team/archive/main.zip#playwright-visual-testing Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.