screenshot-eval

Evaluate browser UI state during Playwright automated tests.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/krazyuniks/guitar-tone-shootout-archive --skill screenshot-eval
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: screenshot-eval
Source: https://github.com/krazyuniks/guitar-tone-shootout-archive/tree/main/.claude/skills/screenshot-eval
Command: npx skills add https://github.com/krazyuniks/guitar-tone-shootout-archive --skill screenshot-eval

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides a structured approach to validating browser UI state during automated tests, ensuring features render correctly and no errors slip through.

Core Features & Use Cases

  • Console validation: detect and fail on JavaScript errors or warnings that indicate broken functionality.
  • Network health checks: verify API calls return expected status codes and payloads without failures.
  • Visual/state verification: capture accessibility snapshots and final screenshots to confirm UI is rendered as intended.
  • Use Case: During regression runs, automatically verify that features render without errors across browsers and environments.

Quick Start

Run the screenshot evaluation workflow on the target page using the Playwright-based commands to generate and attach a final screenshot proving UI correctness.

Frequently Asked Questions about screenshot-eval

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I verify browser UI state during automated Playwright tests?

To verify browser UI state during automated tests, evaluate console errors, network activity, and accessibility snapshots. This Skill captures final screenshots to confirm the UI renders correctly without missing API payloads or JavaScript warnings.

Can I detect JavaScript console errors during Playwright regression testing?

Yes, you can detect JavaScript console errors during regression testing by evaluating browser console output. This Skill automatically identifies warnings and errors to fail tests if broken functionality is indicated.

What is the best way to validate network requests and API calls in browser testing?

Validating network requests in browser testing involves checking API call statuses and payloads. This Skill verifies network health to ensure API calls return expected status codes without failures during automated UI verification.

How do I capture accessibility snapshots for UI verification?

Capturing accessibility snapshots for UI verification requires Playwright-based tooling to run browser checks. This Skill generates accessibility snapshots alongside screenshots to confirm the UI is rendered as intended.

Does this UI verification approach work for feature validation across multiple environments?

Yes, this UI verification approach works for feature validation across multiple environments. It automatically verifies that features render without errors across browsers during regression runs using Playwright checks.

Do I need Playwright to run browser checks and generate UI verification screenshots?

Yes, you need Playwright-based tooling to run browser checks and generate UI verification screenshots. This Skill requires Playwright commands to execute the evaluation workflow and attach evidence proving UI correctness.