Why should I use this if my unit tests already pass?

Automated unit tests can miss visual regressions, layout overlaps, or subtle interaction bugs that only surface in a real browser environment or during manual interaction.

What is the purpose of the Visual Verification skill?

It provides a framework for Claude to verify that UI features actually work in a browser, preventing tasks from being marked complete based only on passing unit tests.

Can it capture evidence of testing?

Yes, the skill specifically includes a checklist item for capturing screenshots as evidence that the feature renders and behaves correctly.

Does this skill work with mobile apps?

While currently optimized for web applications via Playwright, the skill framework includes patterns for mobile application verification that are being expanded.

Visual UI Verification

Name: Visual UI Verification
Author: gruckion

bygruckion

•

セキュリティとテスト

Validates frontend implementations through interactive browser testing and structured visual checklists.

概要

The Visual Verification skill enables Claude to move beyond simple code analysis by implementing a rigorous process for testing user interfaces in real browser environments. It provides standardized workflows for checking UI rendering, user interactions, and edge cases using tools like Playwright, ensuring that passing automated tests translates to a truly functional user experience before a task is finalized.

主な機能

Edge case validation for loading, empty, and error states
Comprehensive UI verification checklists
Detection of rendering errors and layout overlaps
1 GitHub stars
Integration with Playwright for automated browser control
Automated screenshot capture for implementation evidence

ユースケース

Verifying web feature implementations in actual browser environments
Confirming UI bug fixes work across different interaction states
Validating complex user flows and interactive elements before deployment

概要

主な機能

Edge case validation for loading, empty, and error states
Comprehensive UI verification checklists
Detection of rendering errors and layout overlaps
1 GitHub stars
Integration with Playwright for automated browser control
Automated screenshot capture for implementation evidence

ユースケース

Verifying web feature implementations in actual browser environments
Confirming UI bug fixes work across different interaction states
Validating complex user flows and interactive elements before deployment