screenshot-validation

Solid

Validate screenshot and viewer HTML quality for PR evidence. Run this after adding or modifying images under .agents/evidence/pr/ or .agents/recordings/, or after generating a new viewer HTML file. Combines image quality checks (resolution, blankness, file size) with Playwright-based viewer rendering verification.

Code & Development 1,021 stars 109 forks Updated today MIT

Install

View on GitHub

Quality Score: 96/100

Stars 20%
100
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
50
License 10%
100
Description 5%
100

Skill Content

# Screenshot Validation Validate that evidence images and viewer HTML files meet quality standards before committing. This catches issues that would otherwise fail CI or produce misleading PR evidence. ## Image quality check Checks PNG/JPG/GIF/WEBP files for: - **Minimum dimensions**: 400x400 pixels (hard fail) - **Desktop viewport width**: >= 1280px (warning if narrower) - **File size**: <= 5MB (warning if larger) - **Blankness detection** (PNG only): fails if > 90% of pixels are white/transparent ### Run on specific files or directories ```bash uv run python scripts/check_screenshots.py .agents/evidence/pr/ uv run python scripts/check_screenshots.py .agents/recordings/ uv run python scripts/check_screenshots.py path/to/specific-image.png ``` ### Run on git-staged images ```bash scripts/check_screenshots.sh ``` This shell wrapper automatically finds staged PNG/JPG files and runs the quality check on them — useful as a pre-commit sanity check. ## Viewer HTML rendering verification Uses Playwright (headless Chromium) to verify that generated viewer HTML files actually render correctly — not just raw JSON or Python errors. Checks: - No JavaScript errors on page load - Normal traces render a sidebar with entries and a detail panel - Empty embedded traces render the explicit "No API calls captured" state - Body text doesn't contain raw JSON dumps or Python tracebacks ### Run ```bash uv run python scripts/verify_screenshots.py .traces/trace_*.html ``` Requires Playwr...

Details

Author
liaohch3
Repository
liaohch3/claude-tap
Created
3 months ago
Last Updated
today
Language
Python
License
MIT

Integrates with

Similar Skills

Semantically similar based on skill content — not just same category

AI & Automation Listed

verify-visual

Use chrome-devtools MCP to screenshot the local site (or a specific element) and visually verify it matches the design intent. Required after every UI-affecting change before marking work done.

0 Updated 4 days ago
jajupmochi
Testing & QA Listed

visual-qa

Visual quality assurance: analyze game screenshots for defects, compare against reference, check motion in frame sequences. Supports runtime-native inspection plus Gemini or OpenAI API-backed VQA.

2 Updated today
RandallLiuXin
AI & Automation Solid

visual-verdict

Screenshot comparison QA for frontend development. Takes a screenshot of the current implementation, scores it across multiple visual dimensions, and returns a structured PASS/REVISE/FAIL verdict with concrete fixes. Use when implementing UI from a design reference or verifying visual correctness.

495 Updated 1 months ago
vibeeval
AI & Automation Listed

verify

Verifies the running application against PRD screen specs and acceptance criteria in a browser. This skill should be used when the user asks to "run visual verification", "verify the app against the PRD", "run Stage 6V", "check the running app", "verify screens match specs", "run live app verification", "test the running application", or "verify acceptance criteria in the browser", or when the transmute-pipeline agent reaches Stage 6V of the pipeline.

4 Updated today
masterleopold
AI & Automation Listed

browser-validation

Валидация UI и пользовательских сценариев в браузере через Playwright MCP. Используй для: проверь UI, проверь в браузере, валидируй страницу, скриншот, регрессия, адаптив, бизнес-логика, проверь визуально. EN triggers: validate UI, browser check, e2e test, regression test, responsive check, business logic in browser, take screenshot, pixel-perfect validation, visual QA.

0 Updated today
NDDev-it-com