Does this skill include automation commands?

Yes, it includes specific implementation patterns for Playwright, covering full-page, element-specific, and timestamped screenshot captures.

Is there a strategy for managing failing test evidence?

Yes, it defines a dedicated failure directory structure that links actual states, expected baselines, and visual diffs to the specific test execution date.

How does this skill improve visual regression testing?

It provides a structured baseline management strategy, allowing you to compare current test states against approved reference images systematically.

How does it handle responsive design testing?

It provides guidelines for capturing screenshots at standard breakpoints (mobile, tablet, desktop) using specific width suffixes for easy identification.

What is the recommended file naming convention?

The skill suggests a {sequence}-{state-description} format, such as '01-initial-state.png', to preserve execution order and provide context.

QA Screenshot Management

Name: QA Screenshot Management
Author: jpoutrin

byjpoutrin

•

セキュリティとテスト

Standardizes screenshot capture, naming, and organization to ensure visual traceability and consistency during QA testing.

The QA Screenshot Management skill provides a robust framework for managing visual evidence throughout the testing lifecycle. It establishes a clear directory hierarchy and semantic naming conventions that eliminate ambiguity in test results. By offering specific patterns for Playwright integration, visual regression baselines, and responsive design validation, this skill helps teams maintain a high-quality record of application states. It is particularly useful for developers and QA engineers who need to document complex user flows, manage cross-browser evidence, and quickly diagnose failures with side-by-side visual comparisons.

主な機能

01Ready-to-use Playwright snippets for element and full-page captures

02Responsive testing guidelines for mobile, tablet, and desktop breakpoints

03Standardized hierarchical directory structure for organized test evidence

04Semantic naming conventions for clear execution sequence and state identification

05Visual regression strategy for baseline management and difference tracking

062 GitHub stars

ユースケース

01Setting up a visual regression suite for UI-critical frontend components

02Organizing failure documentation across multiple browsers to accelerate bug fixing

03Generating professional test execution logs with structured visual evidence

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add jpoutrin/product-forge qa-screenshot-management

For use in Claude.ai and ChatGPT

Download Skill