bee:dev-frontend-visual
CommunityEnsure visual consistency in frontend.
Software Engineering#frontend#regression testing#visual testing#component testing#snapshot testing#gate 4
Authorluanrodrigues
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill prevents visual regressions and ensures all frontend components maintain their intended appearance across different states and viewports, catching errors before they reach users.
Core Features & Use Cases
- Snapshot Testing: Automatically generates and verifies visual snapshots for all component states.
- Regression Detection: Identifies unintended visual changes introduced during development.
- Component Duplication Check: Ensures adherence to design system standards by preventing the duplication of UI components.
- Use Case: After implementing a new button component, this Skill will generate snapshots for its default, hover, and disabled states, and across different screen sizes, ensuring it looks correct and hasn't inadvertently replaced an existing component.
Quick Start
Use the bee:dev-frontend-visual skill to run visual regression tests on the provided implementation files.
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: bee:dev-frontend-visual Download link: https://github.com/luanrodrigues/ia-frmwrk/archive/main.zip#bee-dev-frontend-visual 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.