qa-screenshot-management

What problem does it solves?

Managing and organizing screenshots captured during QA testing with consistent naming, structured directories, and clear traceability to test cases is essential for effective bug reporting and documentation. Without proper management, visual evidence can be chaotic. This Skill standardizes screenshot capture and organization.

Core Features & Use Cases

• Directory Structure: Standardized organization of screenshots by test ID, including separate directories for baseline references and failures.
• Naming Convention: A clear format ({sequence}-{state-description}.{png|jpeg}) for descriptive and ordered screenshot filenames.
• When to Capture: Guidelines for always capturing initial states, critical actions, error states, success states, and final states.
• Playwright Commands: Specific Playwright commands for basic, full-page, and element-specific screenshot captures.
• Visual Comparison Strategy: Guidance on creating baselines, comparing current states, and handling acceptable differences for visual regression testing.
• Use Case: Capturing screenshots during a test run and organizing them by test ID, creating a baseline for visual regression testing, documenting a failed test with relevant screenshots, or organizing responsive screenshots by breakpoint.

Quick Start

Use the qa-screenshot-management skill to generate a Playwright command to capture a full-page screenshot named 01-initial-state.png.