# Verify

> Verify apps/desktop frontend changes visually without launching the Tauri app or a live model

- Skill: `ai4s-research/verify` (Agent Skill)
- Install (CLI): `npx skillmds@latest add ai4s-research/verify`
- Raw SKILL.md: https://api.skillmd.com/api/skills/ai4s-research/verify/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: ai4s-research (https://skillmd.com/u/ai4s-research)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/ai4s-research/verify

---


# Verifying desktop frontend changes

Full-app runs need an OpenCode session + live model turn. For pure frontend
component changes, mount the component in a throwaway vite page instead:

1. Create `apps/desktop/verify-<x>.html` (plain html, `<div id="root">`,
   `<script type="module" src="/src/verify-<x>.tsx">`) and
   `apps/desktop/src/verify-<x>.tsx` (ReactDOM.createRoot, import
   `./index.css` for Tailwind, import the component via `@/`). Vite serves
   any .html under `apps/desktop/` automatically.
2. `cd apps/desktop && npx vite --port 5199 --strictPort` (background).
   The npx wrapper may double-spawn and report "port in use" failure while
   the first instance is fine — check `lsof -iTCP:5199` before retrying.
3. Drive with the browser-control skill (Chrome HTTP API, port 9528):
   `createWindow` → `waitForSelector` → `readDom` → `screenshotTab`
   (screenshots land in `~/Downloads/`).
   Gotchas: `evalScript` is blocked by CSP on the extension — use
   `readDom`/`scrollTab` instead; `readDom` requires an explicit
   `"attributes": []` or it errors with "Value is unserializable".
4. Clean up: `closeTab`, kill the vite pid, delete both harness files,
   confirm `git status` is clean.