Building with AI agents

The kit ships tested surfaces for coding agents: six prompt recipes, a shared instructions file, machine-readable docs, and an MCP preset for debugging in a live Chrome.

The recipes

Six tested recipes live in .claude/commands/*.md. Each encodes the kit’s invariants: exact file paths, the store-policy guard, the definition of done.

Recipe	What it does
/add-feature	Scaffold a feature off YourFeature.tsx, including gate wiring and the 2-file paywall edit.
/add-surface	Add a WXT entrypoint following the shadow-UI and module conventions.
/change-gate-preset	Switch paywall presets in background/gates.ts with the policy guard restated.
/add-permission	Add a chrome.* permission: manifest + module.json rationale + e2e guard, permission before code.
/prep-store-submission	Pre-flight a store submission: zips, remote-code audit, assets, privacy answers.
/add-migration	Change a chrome.storage shape with a numbered defineMigrations bump and tests.

In Claude Code they are slash commands; open a session at the repo root and type:

/add-feature summarize-page

In Cursor or any other agent, each file is a self-contained prompt: open .claude/commands/<recipe>.md, paste the body, and replace $ARGUMENTS.

What else ships

• AGENTS.md: the single source of agent instructions: architecture map, verified MV3 pitfalls, gate policy guard, security invariants. CLAUDE.md and .cursor/rules/ are symlinks to it.
• llms.txt + markdown mirror: this site publishes /llms.txt and every page as plain markdown, so agents can fetch any guide by URL.
• Docs bundle: one concatenated markdown file (and a zip of the pages) for pasting the whole docs set into a context window.

Debug with Chrome DevTools MCP

The repo ships a project-scope preset in .mcp.json for Google’s chrome-devtools-mcp server, which lets an agent drive and inspect a live Chrome: read service-worker console output, screenshot the popup, watch the background’s network calls, click through a gate wall.

Claude Code detects .mcp.json automatically and asks for approval on first use. To add it explicitly:

claude mcp add chrome-devtools -- npx -y chrome-devtools-mcp@latest

Cursor: add the same server in Cursor Settings → MCP:

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": ["-y", "chrome-devtools-mcp@latest"]
    }
  }
}

Useful variants (append to args): --isolated for a throwaway profile, or --browser-url http://127.0.0.1:9222 to attach to a Chrome you started yourself with your unpacked extension loaded; pair that with pnpm dev for extension debugging.

Agents don’t get a pass

Everything in AGENTS.md binds agent-written code exactly as it binds yours. The failure modes agents hit most are the MV3 service-worker rules and hand-writing paywall UI instead of using the gate engine. Review agent diffs against the pitfalls.

The definition of done is the same for agents as for humans:

pnpm typecheck && pnpm lint && pnpm turbo run test
pnpm --filter @extensionstart/extension e2e

Don’t let an agent declare victory without the e2e run.