Agent E2E QA
Use this skill to run the kind of QA a human would do with the product open:
start Clovy, click through the affected workflow, observe the result, and leave
evidence. This is an agent-assisted verification layer, not a substitute for
deterministic unit, Rust, or CI tests.
Decision Tree
Pick the narrowest surface that proves the behavior.
- Web preview: Use
pnpm dev and Browser for React-only flows, standalone
preview pages, onboarding preview, HUD demo pages, and visual smoke tests that
do not require real Tauri commands. The browser-surface technique (faking the
Tauri IPC bridge, Playwright/CDP driving, screenshot suites, PR-embeddable
GIFs) is owned by the browser-test-tauri-fe skill — read it before driving
this surface.
- Background browser video: Use the bundled Playwright helper for
web-reachable agent flows when the user is actively using the desktop or does
not need to watch the run. This avoids foreground macOS screen capture. It may
shim the Tauri shell while routing prompts through the isolated legacy
Hermes QA dashboard.
- Native Tauri app: Use
pnpm tauri:dev and Computer Use for WKWebView,
native windows, tray/menu behavior, macOS permissions, dictation hotkeys,
microphone/system audio, update prompts, and any flow that depends on Rust
commands or sidecars.
- External browser handoff: Use Chrome when the flow intentionally opens the
user's real browser, such as OS Accounts login, checkout, account portal, or a
page that depends on the user's browser session.
- Deterministic promotion: Recommend Playwright or Tauri WebDriver only
after a flow is stable enough to run unattended. Do not add a dependency or
CI job during a QA pass unless the user asked for that implementation.
If the requested flow touches payments, live accounts, OS permission prompts,
microphone/camera/location access, or sends user data externally, get explicit
confirmation at action time before performing that side effect.
Setup
- Read repo instructions first:
AGENTS.md, CLAUDE.md, and relevant specs.
- Inspect
git status -sb. Do not overwrite unrelated user changes.
- Work in the current task worktree. If this is part of
repo-build-pr, use
the worktree that skill created.
- Ensure local development config exists:
.env should usually match .env.example.
clovy-api/.env should usually match clovy-api/.env.example.
- Local mode uses
OS_CLOVY_LOCAL_DEV=1 and local-dev-token so QA does
not require OS Accounts unless the specific flow is account QA.
- Choose a dev command:
- Web only:
pnpm dev
- Native app:
pnpm tauri:dev
- First-run wizard:
pnpm tauri:dev --replay-onboarding
- If
127.0.0.1:1421 or 127.0.0.1:8080 is already in use, verify whether
the existing service belongs to this repo before reusing it. pnpm tauri:dev
intentionally reuses occupied Vite and API ports.
Keep terminal sessions running only while they are needed. Before ending the
turn, stop or clearly identify any dev server or app process left running.
Video Recording
Record live QA walkthroughs by default. Start recording before the first app
interaction and stop it only after the final visible pass/fail state is
captured.
- Save recordings under
.tmp/qa-recordings/ so large .mov files stay out of
git. Use a timestamped, descriptive name such as
.tmp/qa-recordings/20260627-123000-agent-hi.mov.
- On macOS, prefer the built-in recorder:
mkdir -p .tmp/qa-recordings
screencapture -v -C -k .tmp/qa-recordings/<timestamp>-<slug>.mov
Run it as a long-running terminal session and stop it with Ctrl-C when the
walkthrough is complete. Add -V <seconds> only when a hard maximum duration
is useful.
- For background browser agent runs, prefer the bundled helper instead of
screencapture:.agents/skills/agent-e2e-qa/scripts/run_background_agent_prompt.mjs \
--prompt "hi"
The helper starts an isolated tokenized legacy Hermes QA dashboard using its
local config, opens the Vite app in headless Chrome, records Playwright video
under .tmp/qa-recordings/, shims only the Tauri shell calls needed by the web
surface, and waits for a visible assistant completion. Playwright comes
from the repository's pinned playwright dev dependency; if it is
unavailable, restore dependencies with pnpm install --frozen-lockfile.
- Do not record microphone audio unless the user explicitly requests and
approves it;
screencapture -g uses the default input and may capture private
speech or room audio.
- If macOS blocks recording behind Screen Recording permission, ask the user to
grant permission or report video as
BLOCKED. Do not change OS privacy
settings through Computer Use without confirmation.
- After stopping, verify the file exists and is non-empty with
ls -lh. Include
the recording path in Artifacts. If recording is unavailable, keep the run
going with screenshots/logs and list the missing video in Gaps.
- Compress the recording before sharing it. Prefer the bundled helper, which
creates a 720p, 10 fps, no-audio H.264 MP4 under the os-platform file cap:
python3 .agents/skills/agent-e2e-qa/scripts/prepare_qa_video.py \
.tmp/qa-recordings/<timestamp>-<slug>.mov
The helper also accepts Playwright .webm recordings from background browser
runs.
Use --max-bytes, QA_VIDEO_MAX_BYTES, --bitrate-kbps, or
--min-bitrate-kbps only when the default adaptive compression misses the
size target. If ffmpeg is unavailable, report compressed video as
BLOCKED or a Gaps item and keep the QA evidence path moving with raw video
and screenshots.
- Attach a video to a PR only when the user asked for PR sharing or the QA
charter explicitly allows it. Public os-platform uploads are downloadable by
anyone with the URL, so pass
--confirm-public only after that confirmation:python3 .agents/skills/agent-e2e-qa/scripts/prepare_qa_video.py \
.tmp/qa-recordings/<timestamp>-<slug>.mov \
--upload --confirm-public --comment-pr <pr-number>
The helper reads OS_PLATFORM_API_KEY or
CLOVY__ISSUE_REPORTS__OS_PLATFORM_API_KEY (or its June-era alias), falling back to
clovy-api/.env when present, and uploads with is_public=true and
purpose=attachment.
- Do not commit binary recordings unless the user explicitly asks. Prefer
attaching or sharing the artifact path outside git.
Charter
Before clicking, state the QA charter in one or two sentences:
- changed files or feature area under test
- user-visible workflow to prove
- data and environment assumptions
- explicit exclusions, such as live billing or hardware permissions
Use docs/qa/feature-user-stories.tsv to map broad checks to existing story
IDs when possible. For bug fixes, reproduce the original sequence first when it
is feasible, then verify the fixed sequence.
Tool Use
Prefer semantic automation where available, then visual inspection.
- Browser: use Playwright locators, DOM snapshots, console errors, and
screenshots. Keep the browser visible when the user asked to watch or use the
page.
- Chrome: use it for flows that rely on the user's browser cookies or external
login state. Do not enter credentials or complete payment without explicit
authorization.
- Computer Use: use it for the native Tauri window, macOS permission panes,
menu bar, tray, overlays, HUDs, hotkeys, drag/drop, file pickers, audio UI,
and anything Browser cannot see.
- Terminal: use it for starting/stopping dev processes, checking logs, reading
app data only when needed, and running targeted tests that support the live
findings.
When a tool-specific skill is available for Browser, Chrome, or Computer Use,
read that skill before using the tool. For the Browser surface in this repo
that is browser-test-tauri-fe (fake Tauri IPC bridge, Playwright/CDP,
screenshots and GIFs).
Walkthrough Loop
- Start the selected app surface and wait for it to be ready.
- Start the screen recording and note the output path.
- Capture baseline evidence:
- URL or process/app name
- initial screenshot
- console/runtime errors if Browser is used
- relevant terminal log lines
- Drive the app like a user:
- click visible controls by accessible name when possible
- type realistic text
- use keyboard shortcuts when that is the product behavior
- wait for visible state changes, not arbitrary sleeps
- After each meaningful step, verify the expected state using the cheapest
reliable signal:
- DOM role/text/state for Browser
- screenshot plus visible labels for Computer Use
- app logs or local database only when visible UI cannot prove the state
- Check for regressions around the touched surface:
- blank screens
- modal/popover layering
- clipped text or overlapping controls
- stale loading states
- console errors
- unexpected account, billing, or permission prompts
- Stop the screen recording, verify the output file, compress it with
prepare_qa_video.py, and include the raw path, compressed path, and public
URL or PR comment when one was requested.
- If something fails, capture the exact repro sequence, screenshot/log proof,
and likely code owner files. Do not keep clicking until the failure is
obscured.
Evidence Format
Report results with this shape:
Environment:
- Worktree/branch:
- Command:
- Surface: web preview | background browser | native Tauri | Chrome handoff
- Data mode:
Checks:
- PASS/FAIL/BLOCKED - story or flow - evidence
Artifacts:
- raw video path, compressed video path, os-platform URL, screenshot/log paths,
or PR comments
Gaps:
- anything not proven and why
Use PASS only when the live app visibly satisfied the behavior. Use
BLOCKED for missing credentials, unavailable tool surfaces, denied
permissions, absent hardware, or a side effect that needs user confirmation.
If you update docs/qa/feature-user-stories.tsv, only change rows that this
run actually proved. Keep "manual pending" language when the run did not cover
real accounts, real audio devices, OS permissions, or native overlays.
Promotion Guidance
Agent-driven QA is the right default for broad product walkthroughs because it
can combine visual judgment, native app control, external browser handoffs, and
repo-specific context. Promote a flow to deterministic automation only when the
same steps are repeated often and can avoid secrets, production accounts,
hardware variability, and subjective visual calls.
Good promotion candidates:
- web-preview onboarding smoke checks
- settings navigation and saved preferences
- empty-state and dialog layering checks
- stable agent composer flows with mocked backend events
Poor promotion candidates:
- macOS microphone, accessibility, system audio, and global hotkey proof
- OS Accounts or Stripe live flows
- update installation and relaunch
- menu bar, tray, HUD, or native permission prompt placement on macOS
1---2name: agent-e2e-qa3description: Run live, agent-driven end-to-end QA for os-clovy by opening the real app or web preview, clicking through changed flows, inspecting visible state, recording and compressing video, attaching QA videos to PRs through os-platform file uploads, capturing screenshots/logs, and reporting pass/fail evidence. Use when a user asks for full integration testing, live app QA, visual inspection, "open the app and use it", "click through it", "record the QA run", "attach the video to the PR", native Tauri verification, WKWebView inspection, onboarding smoke tests, HUD/tray/hotkey checks, or manual QA replacement by an agent. Compose Browser, Chrome, Computer Use, terminal commands, and repo tests as appropriate.4---56# Agent E2E QA78Use this skill to run the kind of QA a human would do with the product open:9start Clovy, click through the affected workflow, observe the result, and leave10evidence. This is an agent-assisted verification layer, not a substitute for11deterministic unit, Rust, or CI tests.1213## Decision Tree1415Pick the narrowest surface that proves the behavior.1617- **Web preview**: Use `pnpm dev` and Browser for React-only flows, standalone18 preview pages, onboarding preview, HUD demo pages, and visual smoke tests that19 do not require real Tauri commands. The browser-surface technique (faking the20 Tauri IPC bridge, Playwright/CDP driving, screenshot suites, PR-embeddable21 GIFs) is owned by the `browser-test-tauri-fe` skill — read it before driving22 this surface.23- **Background browser video**: Use the bundled Playwright helper for24 web-reachable agent flows when the user is actively using the desktop or does25 not need to watch the run. This avoids foreground macOS screen capture. It may26 shim the Tauri shell while routing prompts through the isolated legacy27 Hermes QA dashboard.28- **Native Tauri app**: Use `pnpm tauri:dev` and Computer Use for WKWebView,29 native windows, tray/menu behavior, macOS permissions, dictation hotkeys,30 microphone/system audio, update prompts, and any flow that depends on Rust31 commands or sidecars.32- **External browser handoff**: Use Chrome when the flow intentionally opens the33 user's real browser, such as OS Accounts login, checkout, account portal, or a34 page that depends on the user's browser session.35- **Deterministic promotion**: Recommend Playwright or Tauri WebDriver only36 after a flow is stable enough to run unattended. Do not add a dependency or37 CI job during a QA pass unless the user asked for that implementation.3839If the requested flow touches payments, live accounts, OS permission prompts,40microphone/camera/location access, or sends user data externally, get explicit41confirmation at action time before performing that side effect.4243## Setup44451. Read repo instructions first: `AGENTS.md`, `CLAUDE.md`, and relevant specs.462. Inspect `git status -sb`. Do not overwrite unrelated user changes.473. Work in the current task worktree. If this is part of `repo-build-pr`, use48 the worktree that skill created.494. Ensure local development config exists:50 - `.env` should usually match `.env.example`.51 - `clovy-api/.env` should usually match `clovy-api/.env.example`.52 - Local mode uses `OS_CLOVY_LOCAL_DEV=1` and `local-dev-token` so QA does53 not require OS Accounts unless the specific flow is account QA.545. Choose a dev command:55 - Web only: `pnpm dev`56 - Native app: `pnpm tauri:dev`57 - First-run wizard: `pnpm tauri:dev --replay-onboarding`586. If `127.0.0.1:1421` or `127.0.0.1:8080` is already in use, verify whether59 the existing service belongs to this repo before reusing it. `pnpm tauri:dev`60 intentionally reuses occupied Vite and API ports.6162Keep terminal sessions running only while they are needed. Before ending the63turn, stop or clearly identify any dev server or app process left running.6465## Video Recording6667Record live QA walkthroughs by default. Start recording before the first app68interaction and stop it only after the final visible pass/fail state is69captured.7071- Save recordings under `.tmp/qa-recordings/` so large `.mov` files stay out of72 git. Use a timestamped, descriptive name such as73 `.tmp/qa-recordings/20260627-123000-agent-hi.mov`.74- On macOS, prefer the built-in recorder:75 ```bash76 mkdir -p .tmp/qa-recordings77 screencapture -v -C -k .tmp/qa-recordings/<timestamp>-<slug>.mov78 ```79 Run it as a long-running terminal session and stop it with Ctrl-C when the80 walkthrough is complete. Add `-V <seconds>` only when a hard maximum duration81 is useful.82- For background browser agent runs, prefer the bundled helper instead of83 `screencapture`:84 ```bash85 .agents/skills/agent-e2e-qa/scripts/run_background_agent_prompt.mjs \86 --prompt "hi"87 ```88 The helper starts an isolated tokenized legacy Hermes QA dashboard using its89 local config, opens the Vite app in headless Chrome, records Playwright video90 under `.tmp/qa-recordings/`, shims only the Tauri shell calls needed by the web91 surface, and waits for a visible assistant completion. Playwright comes92 from the repository's pinned `playwright` dev dependency; if it is93 unavailable, restore dependencies with `pnpm install --frozen-lockfile`.94- Do not record microphone audio unless the user explicitly requests and95 approves it; `screencapture -g` uses the default input and may capture private96 speech or room audio.97- If macOS blocks recording behind Screen Recording permission, ask the user to98 grant permission or report video as `BLOCKED`. Do not change OS privacy99 settings through Computer Use without confirmation.100- After stopping, verify the file exists and is non-empty with `ls -lh`. Include101 the recording path in `Artifacts`. If recording is unavailable, keep the run102 going with screenshots/logs and list the missing video in `Gaps`.103- Compress the recording before sharing it. Prefer the bundled helper, which104 creates a 720p, 10 fps, no-audio H.264 MP4 under the os-platform file cap:105 ```bash106 python3 .agents/skills/agent-e2e-qa/scripts/prepare_qa_video.py \107 .tmp/qa-recordings/<timestamp>-<slug>.mov108 ```109 The helper also accepts Playwright `.webm` recordings from background browser110 runs.111 Use `--max-bytes`, `QA_VIDEO_MAX_BYTES`, `--bitrate-kbps`, or112 `--min-bitrate-kbps` only when the default adaptive compression misses the113 size target. If `ffmpeg` is unavailable, report compressed video as114 `BLOCKED` or a `Gaps` item and keep the QA evidence path moving with raw video115 and screenshots.116- Attach a video to a PR only when the user asked for PR sharing or the QA117 charter explicitly allows it. Public os-platform uploads are downloadable by118 anyone with the URL, so pass `--confirm-public` only after that confirmation:119 ```bash120 python3 .agents/skills/agent-e2e-qa/scripts/prepare_qa_video.py \121 .tmp/qa-recordings/<timestamp>-<slug>.mov \122 --upload --confirm-public --comment-pr <pr-number>123 ```124 The helper reads `OS_PLATFORM_API_KEY` or125 `CLOVY__ISSUE_REPORTS__OS_PLATFORM_API_KEY` (or its June-era alias), falling back to126 `clovy-api/.env` when present, and uploads with `is_public=true` and127 `purpose=attachment`.128- Do not commit binary recordings unless the user explicitly asks. Prefer129 attaching or sharing the artifact path outside git.130131## Charter132133Before clicking, state the QA charter in one or two sentences:134135- changed files or feature area under test136- user-visible workflow to prove137- data and environment assumptions138- explicit exclusions, such as live billing or hardware permissions139140Use `docs/qa/feature-user-stories.tsv` to map broad checks to existing story141IDs when possible. For bug fixes, reproduce the original sequence first when it142is feasible, then verify the fixed sequence.143144## Tool Use145146Prefer semantic automation where available, then visual inspection.147148- Browser: use Playwright locators, DOM snapshots, console errors, and149 screenshots. Keep the browser visible when the user asked to watch or use the150 page.151- Chrome: use it for flows that rely on the user's browser cookies or external152 login state. Do not enter credentials or complete payment without explicit153 authorization.154- Computer Use: use it for the native Tauri window, macOS permission panes,155 menu bar, tray, overlays, HUDs, hotkeys, drag/drop, file pickers, audio UI,156 and anything Browser cannot see.157- Terminal: use it for starting/stopping dev processes, checking logs, reading158 app data only when needed, and running targeted tests that support the live159 findings.160161When a tool-specific skill is available for Browser, Chrome, or Computer Use,162read that skill before using the tool. For the Browser surface in this repo163that is `browser-test-tauri-fe` (fake Tauri IPC bridge, Playwright/CDP,164screenshots and GIFs).165166## Walkthrough Loop1671681. Start the selected app surface and wait for it to be ready.1692. Start the screen recording and note the output path.1703. Capture baseline evidence:171 - URL or process/app name172 - initial screenshot173 - console/runtime errors if Browser is used174 - relevant terminal log lines1754. Drive the app like a user:176 - click visible controls by accessible name when possible177 - type realistic text178 - use keyboard shortcuts when that is the product behavior179 - wait for visible state changes, not arbitrary sleeps1805. After each meaningful step, verify the expected state using the cheapest181 reliable signal:182 - DOM role/text/state for Browser183 - screenshot plus visible labels for Computer Use184 - app logs or local database only when visible UI cannot prove the state1856. Check for regressions around the touched surface:186 - blank screens187 - modal/popover layering188 - clipped text or overlapping controls189 - stale loading states190 - console errors191 - unexpected account, billing, or permission prompts1927. Stop the screen recording, verify the output file, compress it with193 `prepare_qa_video.py`, and include the raw path, compressed path, and public194 URL or PR comment when one was requested.1958. If something fails, capture the exact repro sequence, screenshot/log proof,196 and likely code owner files. Do not keep clicking until the failure is197 obscured.198199## Evidence Format200201Report results with this shape:202203```text204Environment:205- Worktree/branch:206- Command:207- Surface: web preview | background browser | native Tauri | Chrome handoff208- Data mode:209210Checks:211- PASS/FAIL/BLOCKED - story or flow - evidence212213Artifacts:214- raw video path, compressed video path, os-platform URL, screenshot/log paths,215 or PR comments216217Gaps:218- anything not proven and why219```220221Use **PASS** only when the live app visibly satisfied the behavior. Use222**BLOCKED** for missing credentials, unavailable tool surfaces, denied223permissions, absent hardware, or a side effect that needs user confirmation.224225If you update `docs/qa/feature-user-stories.tsv`, only change rows that this226run actually proved. Keep "manual pending" language when the run did not cover227real accounts, real audio devices, OS permissions, or native overlays.228229## Promotion Guidance230231Agent-driven QA is the right default for broad product walkthroughs because it232can combine visual judgment, native app control, external browser handoffs, and233repo-specific context. Promote a flow to deterministic automation only when the234same steps are repeated often and can avoid secrets, production accounts,235hardware variability, and subjective visual calls.236237Good promotion candidates:238239- web-preview onboarding smoke checks240- settings navigation and saved preferences241- empty-state and dialog layering checks242- stable agent composer flows with mocked backend events243244Poor promotion candidates:245246- macOS microphone, accessibility, system audio, and global hotkey proof247- OS Accounts or Stripe live flows248- update installation and relaunch249- menu bar, tray, HUD, or native permission prompt placement on macOS