Skill

e2e-review

Validates UI spec implementation via Playwright E2E visual browser reviews, capturing screenshots, videos, and generating markdown summaries with pass/fail evidence for each MLO.

Playwright

testing

frontend

npx claudepluginhub waterplanai/agentic-config --plugin ac-qa

Tool Access

This skill is limited to using the following tools:

ReadBashGlobGrep

Preview

Validate implementation against spec requirements using browser-based visual proof.

SKILL.md

Similar Skills

verify

109

Verifies frontend changes against spec acceptance criteria using Playwright MCP for browser automation. Automates spec intake, dev server/auth checks, and test runs.

opslane-verify

ui-test

586

Executes E2E UI tests from plain English descriptions via browser automation, screenshots steps, generates video walkthroughs, and exports Playwright .spec.ts scripts for CI/CD.

1 file

sundial-org-awesome-openclaw-skills-4

webapp-testing

Tests local web applications using Playwright: verifies frontend functionality, debugs UI behavior, captures screenshots, views logs. Mandatory before declaring implementation complete.

1 file

reviw-plugin

Stats

Parent Repo Stars28

Parent Repo Forks6

Last CommitMar 6, 2026

Actions

View Source View Plugin View on GitHub View README

Help us improve

Share bugs, ideas, or general feedback.

E2E Spec Review Command

Validate implementation against spec requirements using browser-based visual proof.

Spec File: $1 Base URL: $2 (default: http://localhost:${DEFAULT_PORT:-5173}/)

Pre-Flight Checks

Verify Spec File Exists
- Read spec file from $1
- If not found: STOP with "Spec file not found: $1"
Verify playwright-cli Installed
- Run: playwright-cli --help
- If not available: STOP with "playwright-cli not installed. Run: npm install -g @playwright/cli@latest"
Parse Spec Requirements
- Extract MLOs (Mid-Level Objectives) from Human Section
- Extract acceptance criteria from Details section
- Create validation checklist

Execution

Initialize Review Session
- Create output directory: {PROJECT_ROOT}/outputs/review/<spec-id>/
- Record review start timestamp
Open Application
- Navigate to base URL: playwright-cli open <base_url>
- Take initial screenshot: playwright-cli screenshot --output {PROJECT_ROOT}/outputs/review/<spec-id>/01_initial.png
- Verify application loads successfully
Validate Each MLO
- For each Mid-Level Objective: a. Navigate to relevant UI section b. Take screenshot of current state c. Verify visual elements match expected d. Test interactions if applicable e. Document pass/fail with evidence
Capture Visual Proof
- Screenshot key states during validation
- Name format: <NN>_<mlo>_<state>.png
- Example: 02_mlo1_button_visible.png
Generate Review Summary

Output Format

Generate markdown review summary:

# Review: <spec-title>

**Spec:** $1
**Date:** <ISO date>
**Status:** PASSED | FAILED | PARTIAL

## MLO Validation

### MLO-1: <title>
- Status: PASSED/FAILED
- Evidence: ![screenshot]({PROJECT_ROOT}/outputs/review/<spec-id>/02_mlo1.png)
- Notes: <observations>

### MLO-2: <title>
...

## Screenshots

| # | Description | Path |
|---|-------------|------|
| 1 | Initial load | {PROJECT_ROOT}/outputs/review/<spec-id>/01_initial.png |
| 2 | MLO-1 validation | {PROJECT_ROOT}/outputs/review/<spec-id>/02_mlo1.png |

## Video Recording

Full session: {PROJECT_ROOT}/outputs/e2e/<timestamp>-review-<spec-id>.webm

## Summary

<brief summary of findings>

Error Handling

On navigation failure: capture error state, continue with next MLO
On element not found: document as failure with screenshot
On timeout: retry once, then mark as failed
Always generate summary even if partial failure