// Browser-first QA skill for local web apps. Use when exploring an application, smoke-testing routes, checking whether a page loads, validating a user flow, reproducing a UI bug, or confirming a fix. Prefer the local `agent-browser` CLI for screenshots, snapshots, console checks, navigation, and basic interactions.
| name | qa-browser-verify |
| description | Browser-first QA skill for local web apps. Use when exploring an application, smoke-testing routes, checking whether a page loads, validating a user flow, reproducing a UI bug, or confirming a fix. Prefer the local `agent-browser` CLI for screenshots, snapshots, console checks, navigation, and basic interactions. |
Use this skill for manual QA passes against a running local application.
agent-browser over curl for UI verification.agent-browser commands sequentially for a single session. Do not fire multiple commands at the same session in parallel.agent-browser is missing, stop and report that blocker.agent-browser install
npx playwright install chromium chromium-headless-shell
AGENT_BROWSER_SESSION=qa agent-browser open http://localhost:3000
Run this loop for the home route and any important feature routes:
AGENT_BROWSER_SESSION=qa agent-browser open http://localhost:3000
AGENT_BROWSER_SESSION=qa agent-browser screenshot /tmp/qa-home.png
AGENT_BROWSER_SESSION=qa agent-browser snapshot -i
AGENT_BROWSER_SESSION=qa agent-browser eval 'document.querySelector("[data-nextjs-dialog], .vite-error-overlay, #webpack-dev-server-client-overlay") ? "ERROR_OVERLAY" : "OK"'
AGENT_BROWSER_SESSION=qa agent-browser eval 'document.body.innerText.trim().length > 0 ? "HAS_CONTENT" : "BLANK"'
AGENT_BROWSER_SESSION=qa agent-browser console
AGENT_BROWSER_SESSION=qa agent-browser errors
fill, type, click, press, and get url to validate a real user path.get text, eval, or another snapshot -i.Example:
AGENT_BROWSER_SESSION=qa agent-browser fill 'input[name="prompt"]' 'Hello'
AGENT_BROWSER_SESSION=qa agent-browser click 'button[type="submit"]'
AGENT_BROWSER_SESSION=qa agent-browser wait 3000
AGENT_BROWSER_SESSION=qa agent-browser screenshot /tmp/qa-after-submit.png
When a check fails:
console and errors.network requests.Finish by closing the browser session:
AGENT_BROWSER_SESSION=qa agent-browser close
Return a concise QA summary:
Create new persistent Codex agents for this repo when asked to add a specialist agent, define a reusable subagent role, scaffold `.codex/agents/*.toml`, or wire the agent to local skills and MCP servers.
Repo-local bridge skill for Next.js frontend work. Use when a dedicated agent is handling App Router UI changes, layouts, metadata, route-aware rendering, or Server/Client Component boundaries.
Repo-local bridge skill for React TSX reviews. Use when a dedicated agent is checking component quality, hooks usage, accessibility, and performance risks after frontend changes.
Repo-local bridge skill for shadcn/ui work. Use when a dedicated agent is composing UI, extending the design system, or adding shadcn components in a Next.js frontend.
Research the current best implementation pattern before making code changes. Use when Codex needs up-to-date guidance for a feature, integration, bugfix, or upgrade, especially around Next.js, AI SDK, Gemini, Drizzle, Bun, Docker, or other stack pieces that may have changed recently.
Turn plain-language requests into transient query or mutation scripts for the local seeded Postgres database in this repo. Use when Codex needs to inspect, clean up, backfill, bulk update, or analyze demo_orders or other local seed data, preferably through DOCKER MCP code-mode and otherwise through js_repl without requiring a checked-in script.