Loading...
Loading...
Diff-aware AI browser testing — analyzes git changes, generates targeted test plans, and executes them via agent-browser. Reads git diff to determine what changed, maps changes to affected pages via route map, generates a test plan scoped to the diff, and runs it with pass/fail reporting. Use when testing UI changes, verifying PRs before merge, running regression checks on changed components, or validating that recent code changes don't break the user-facing experience.
npx skill4agent add yonatangross/orchestkit expect/ork:expect # Auto-detect changes, test affected pages
/ork:expect -m "test the checkout flow" # Specific instruction
/ork:expect --flow login # Replay a saved test flow
/ork:expect --target branch # Test all changes on current branch vs main
/ork:expect -y # Skip plan review, run immediatelyARGS = "[-m <instruction>] [--target unstaged|branch|commit] [--flow <slug>] [-y]"
# Parse from full argument string
import re
raw = "" # Full argument string from CC
INSTRUCTION = None
TARGET = "unstaged" # Default: test unstaged changes
FLOW = None
SKIP_REVIEW = False
# Extract -m "instruction"
m_match = re.search(r'-m\s+["\']([^"\']+)["\']|-m\s+(\S+)', raw)
if m_match:
INSTRUCTION = m_match.group(1) or m_match.group(2)
# Extract --target
t_match = re.search(r'--target\s+(unstaged|branch|commit)', raw)
if t_match:
TARGET = t_match.group(1)
# Extract --flow
f_match = re.search(r'--flow\s+(\S+)', raw)
if f_match:
FLOW = f_match.group(1)
# Extract -y
if '-y' in raw.split():
SKIP_REVIEW = TrueToolSearch(query="select:mcp__memory__search_nodes")
# Verify agent-browser is available
Bash("command -v agent-browser || npx agent-browser --version")
# If missing: "Install agent-browser: npm i -g @anthropic-ai/agent-browser"TaskCreate(
subject="Expect: test changed code",
description="Diff-aware browser testing pipeline",
activeForm="Running diff-aware browser tests"
)Git Diff → Route Map → Fingerprint Check → Test Plan → Execute → Report| Phase | What | Output | Reference |
|---|---|---|---|
| 1. Fingerprint | SHA-256 hash of changed files | Skip if unchanged since last run | |
| 2. Diff Scan | Parse git diff, classify changes | ChangesFor data (files, components, routes) | |
| 3. Route Map | Map changed files to affected pages/URLs | Scoped page list | |
| 4. Test Plan | Generate AI test plan from diff + route map | Markdown test plan with steps | |
| 5. Execute | Run test plan via agent-browser | Pass/fail per step, screenshots | |
| 6. Report | Aggregate results, artifacts, exit code | Structured report + artifacts | |
Read(".expect/fingerprints.json") # Previous run hashes
# Compare SHA-256 of changed files against stored fingerprints
# If match: "No changes since last test run. Use --force to re-run."
# If no match or --force: continue to Phase 2Read("${CLAUDE_SKILL_DIR}/references/fingerprint.md")--targetif TARGET == "unstaged":
diff = Bash("git diff")
files = Bash("git diff --name-only")
elif TARGET == "branch":
diff = Bash("git diff main...HEAD")
files = Bash("git diff main...HEAD --name-only")
elif TARGET == "commit":
diff = Bash("git diff HEAD~1")
files = Bash("git diff HEAD~1 --name-only")Read("${CLAUDE_SKILL_DIR}/references/diff-scanner.md").expect/config.yaml# .expect/config.yaml
base_url: http://localhost:3000
route_map:
"src/components/Header.tsx": ["/", "/about", "/pricing"]
"src/app/auth/**": ["/login", "/signup", "/forgot-password"]
"src/app/dashboard/**": ["/dashboard"]Read("${CLAUDE_SKILL_DIR}/references/route-map.md")scope_strategy = get_scope_strategy(TARGET) # See references/scope-strategy.md
prompt = f"""
{scope_strategy}
Changes: {diff_summary}
Affected pages: {affected_urls}
Instruction: {INSTRUCTION or "Test that the changes work correctly"}
Generate a test plan with:
1. Page-level checks (loads, no console errors, correct content)
2. Interaction tests (forms, buttons, navigation affected by the diff)
3. Visual regression (compare ARIA snapshots if saved)
4. Accessibility (axe-core scan on affected pages)
"""--flow.expect/flows/{slug}.yaml--yAskUserQuestionRead("${CLAUDE_SKILL_DIR}/references/test-plan.md")agent-browserAgent(
subagent_type="expect-agent",
prompt=f"""Execute this test plan:
{test_plan}
For each step:
1. Navigate to the URL
2. Execute the test action
3. Take a screenshot on failure
4. Report PASS/FAIL with evidence
""",
run_in_background=True,
model="sonnet",
max_turns=50
)Read("${CLAUDE_SKILL_DIR}/references/execution.md")/ork:expect Report
═══════════════════════════════════════
Target: unstaged (3 files changed)
Pages tested: 4
Duration: 45s
Results:
✓ /login — form renders, submit works
✓ /signup — validation triggers on empty fields
✗ /dashboard — chart component crashes (TypeError)
✓ /settings — preferences save correctly
3 passed, 1 failed
Artifacts:
.expect/reports/2026-03-26T16-30-00.json
.expect/screenshots/dashboard-error.pngRead("${CLAUDE_SKILL_DIR}/references/report.md").expect/flows/# .expect/flows/login.yaml
name: Login Flow
steps:
- navigate: /login
- fill: { selector: "#email", value: "test@example.com" }
- fill: { selector: "#password", value: "password123" }
- click: button[type="submit"]
- assert: { url: "/dashboard" }
- assert: { text: "Welcome back" }/ork:expect --flow login/ork:coveragent-browserork:coverork:verifytesting-e2eRead("${CLAUDE_SKILL_DIR}/references/<file>")| File | Content |
|---|---|
| SHA-256 gating logic |
| Git diff parsing + 3-level classification |
| File-to-URL mapping conventions |
| AI test plan generation prompt templates |
| agent-browser orchestration patterns |
| Report format + artifact storage |
| .expect/config.yaml full schema |
| ARIA snapshot comparison for semantic diffing |
| Test depth strategy per target mode |
| Markdown+YAML flow format, adaptive replay |
| rrweb DOM replay integration |
| AskUserQuestion plan review gate |
| GitHub Actions workflow + pre-push hooks |
| millionco/expect architecture analysis |