skills.rest
rjskene
rjskeneCOMMUNITY
Explore all skills by this author →
GitHub

visual-proof-from-plan

Evaluate implementation plan acceptance predicates against a live web app's DOM.

Updated Apr 10, 2026
Search Tags:#acceptance criteria#playwright#visual evidence#CI workflows#browser predicates#DOM evaluation#issue-driven automation
One-click install
npx skills add https://github.com/rjskene/pipeline --skill visual-proof-from-plan
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: visual-proof-from-plan
Source: https://github.com/rjskene/pipeline/tree/main/skills/visual-proof-from-plan
Command: npx skills add https://github.com/rjskene/pipeline --skill visual-proof-from-plan

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill turns a plan’s acceptance predicates into verifiable visual evidence by checking whether a real, reachable app’s UI satisfies each stated claim.

Core Features & Use Cases

  • Predicate extraction from issue plans: Reads the latest Implementation Plan comment and pulls predicate claims under Acceptance criteria or Predicates headings.
  • Live browser evaluation with screenshots: Navigates as needed, evaluates each JavaScript DOM predicate, and records a screenshot for every predicate.
  • Structured evidence output for TDD/PR verdicts: Emits a single JSON object splitting satisfied vs unsatisfied claims with either screenshot paths or error artifacts.

Quick Start

Ask the pipeline to run visual-proof-from-plan for issue N with APP_BASE_URL set to your app’s reachable root, so it returns which acceptance predicates are satisfied and which need attention.

Frequently Asked Questions about visual-proof-from-plan

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

FAQPage Schema
How do I verify acceptance criteria against a live web application's DOM?▼

You can verify acceptance criteria against a live web application by evaluating JavaScript DOM predicates via Playwright browser tools and capturing evidence screenshots for each claim.

How do I extract and test acceptance predicates from a GitHub issue plan?▼

The tool reads the latest Implementation Plan comment on a GitHub issue, extracts predicates under Acceptance criteria headings, and evaluates each JavaScript claim against the reachable app.

Can I generate visual evidence for CI workflows using Playwright?▼

Yes, you can generate visual evidence in CI workflows by using Playwright browser MCP tools to navigate the app, evaluate DOM predicates, and capture screenshots for every claim.

Does this visual proof approach work with GitHub-issue-driven CI workflows?▼

It is designed for GitHub-issue-driven CI workflows, reading acceptance predicates directly from issue plan comments and evaluating them against a reachable app URL.

What format does the structured evidence output use for satisfied and unsatisfied claims?▼

The structured evidence output is a JSON object that separates satisfied claims from unsatisfied claims, attaching corresponding screenshot paths or error artifacts for each.

Do I need browser MCP tools to evaluate DOM predicates and capture screenshots?▼

Yes, browser MCP tools like mcp__playwright_* are required to navigate preconditions, evaluate JavaScript DOM truthiness, and capture evidence screenshots for the verification process.

Related Skills

Explore More Software Engineering Skills→
PaparusiPaparusi

webapp-testing

Automate web application testing with Playwright scripts for verification and screenshots.

Community
Intermediate
enigmaicon-engenigmaicon-eng
1

verification-before-completion

Require fresh command output before asserting tests, builds, or fixes pass.

Community
Basic
joshmandersjoshmanders
29

issue

Generate an actionable implementation plan from a GitHub issue's metadata and linked PRs.

Community
Advanced
ondrej-svecondrej-svec
18

test-writer

Generate end-to-end test suites from user stories and architecture docs.

Community
Advanced