[STG-1745] Add ui-test skill — adversarial UI testing with browse CLI

[shrey150]

Summary

Adds a ui-test skill that uses the browse CLI to run AI-powered adversarial UI tests in a real browser. The agent analyzes git diffs to test only what changed (or explores the full app), checking functional correctness, accessibility, responsive layout, and UX heuristics.

Key features:

• Diff-driven testing — git diff → targeted tests for changed pages/components
• Exploratory testing — agent navigates freely to find bugs without a predefined suite
• Parallel execution — coordinator agent fans out to sub-agents (up to 5), each with a 20-step hard cap
• Structured assertions — STEP_PASS|id|evidence / STEP_FAIL|id|expected → actual with screenshot evidence
• Local + remote — localhost uses local browser, deployed sites use Browserbase
• Deterministic checks — axe-core a11y, console errors, broken images, overflow detection, form labels
• Adversarial patterns — XSS injection, empty submit, rapid click, keyboard-only nav, focus traps

Files

skills/ui-test/
├── SKILL.md                              # Skill definition
├── EXAMPLES.md                           # 9 worked examples with assertions
├── LICENSE.txt                           # MIT
├── README.md                             # Overview
├── rules/
│   └── ux-heuristics.md                 # 6 evaluation frameworks
└── references/
    ├── browser-recipes.md               # Deterministic check recipes
    ├── design-system.example.md         # Example design system template (copy to design-system.md)
    └── exploratory-testing.md           # Agent-driven QA guide

Test plan

• Smoke tested diff-driven testing (component rendering, before/after snapshots)
• Smoke tested adversarial patterns (empty submit, XSS, rapid click, keyboard-only)
• Smoke tested axe-core accessibility audit
• Smoke tested responsive screenshots + overflow/touch-target checks
• Smoke tested console error capture
• Smoke tested parallel execution with named Browserbase sessions
• Found real bugs in test app (Escape not closing modals, undersized touch targets)

🤖 Generated with Claude Code

---

Note

Low Risk
Low risk since this PR primarily adds new markdown/HTML assets for a standalone skill and does not modify existing application/runtime code paths.

Overview
Introduces a new skills/ui-test package defining a ui-test skill for agent-driven UI QA using the browse CLI, including diff-driven, exploratory, and parallel testing workflows with structured STEP_PASS/STEP_FAIL assertions and screenshot evidence.

Adds extensive supporting materials: worked examples (EXAMPLES.md), deterministic check recipes (axe-core, console errors, broken images, responsive/touch targets), adversarial test patterns, UX/design-consistency heuristics, and a reusable references/report-template.html for generating a standalone HTML test report.

^{Written by Cursor Bugbot for commit 9ffe8e4. This will update automatically on new commits. Configure here.}

[cursor]

Report template uses CDN violating offline requirement

Medium Severity

The report template loads Google Fonts from fonts.googleapis.com via two <link> tags, but SKILL.md explicitly states "The report must work offline — no CDN links, no external assets." This directly contradicts the offline requirement. Reports generated from this template will make external network requests and won't render the intended font when opened offline. The CSS fallback stack (Inter, -apple-system, ...) helps, but the external request itself violates the stated contract and may cause slow/blocked rendering in air-gapped environments.

Additional Locations (1)

• skills/ui-test/SKILL.md#L468-L469

 

[cursor]

Focus ring detection produces false positives from decorative shadows

Medium Severity

The hasFocus check uses s.boxShadow !== 'none' as an OR condition to detect visible focus rings. This returns true for any element with a decorative box-shadow (elevation, depth effects), which is extremely common in modern UIs. The agent is then told "hasFocus should be true for every element," so elements with decorative shadows will always pass the focus ring check even when no actual focus indicator exists. This masks real accessibility issues — the core purpose of this deterministic recipe.

Additional Locations (1)

• skills/ui-test/references/browser-recipes.md#L113-L114

 

[cursor]

Cursor Bugbot has reviewed your changes and found 2 potential issues.

There are 4 total unresolved issues (including 2 from previous reviews).

^{Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

[cursor]

Duplicated paragraph in step budget guidance

Low Severity

The "As a rough heuristic: ~25 steps for a few targeted checks…" paragraph is duplicated verbatim on consecutive lines. This appears to be a copy-paste artifact. Since the SKILL.md is read by the agent at runtime to determine behavior, redundant instructions add noise and could confuse the agent's interpretation of the budget guidance.

 

[cursor]

HTML report definition excludes skipped tests from totals

Medium Severity

{{TOTAL_TESTS}} is defined as "Total STEP_PASS + STEP_FAIL count," explicitly excluding STEP_SKIP. But the text report format on line 81 counts total as pass + fail + skipped (20 = 14 + 4 + 2) and computes pass rate accordingly (70%). The HTML template also has no placeholder or stat card for skipped tests. This means the HTML report will show different totals and an inflated pass rate compared to the text report for the same test run.

Additional Locations (2)

• skills/ui-test/SKILL.md#L80-L81
• skills/ui-test/references/report-template.html#L105-L111