Agent skill · software engineering · steipete
control-ui-e2e
Control UI browser tests, visual reviews and recordings, interaction performance audits, and Run Inspector evidence.
Why this skill is useful
Adds specific commands and patterns for end-to-end testing of the Control UI with Playwright and Vitest that the AI wouldn't reliably generate on its own.
What it needs
Requires playwright, pnpm, vitest installed locally. About 2k tokens when loaded. Last updated 2026-08-07. 385,400 stars on the source repository.
What this skill does
Control UI E2E Workflow 1. Select proof. Use the existing browser E2E lane for routing, boot, Gateway handshake, and complete user flows; use browser/unit tests for isolated render logic. Read each branch below that matches the requested outcome. Done: every changed behavior has a named scenario and proof boundary. 2. Prepare fixtures. Reuse ui/src/test-helpers/control-ui-e2e.ts with synthetic Gateway data. Extend its typed scenario options for missing responses. Use the existing dependency installation; preserve installs used by other jobs. Real Gateway/provider credentials require explicit live-proof authorization. Follow testing policy for execution placement. Done: the target flow runs against the intended source or production build and each required fixture response is defined. 3. Exercise behavior. Install the mock before navigation. Act through visible controls and assert both the rendered outcome and relevant Gateway requests. Resolve unexpected behavior at the product or fixture owner before replaying. Done: each scenario reaches its asserted outcome, or has a retained failure identifying the unmet assertion. 4. Deliver evidence. Apply the artifact rules below and the selected branch's checks. Report verified results, failures, and untested states separately. Done: every claimed result has inspectable evidence; remaining gaps are named. UI Stress Test For substantial layout/component changes or multi-state design feedback, read visual proof before building the stress-test gallery. Small copy/icon changes may use focused proof. Visual Proof Default For appearance changes, screenshots, transient-state capture, or video, read visual proof. Appearance changes require inspected before/after evidence; behavior assertions alone can suffice for nonvisual fixes. Interaction Performance Audits For UI slowness, responsiveness audits, or automatic Chrome trace collection, read interaction profiling before choosing the build, fixtures, and measurement boundaries. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills steipete/control-ui-e2e