repro-admin - SKILL.md Agent Skill

name: repro-admin description: Reproduce an EmDash admin UI bug. Boots a demo with bgproc, drives the admin with agent-browser using the dev-bypass session, and prefers a Playwright test as the durable artifact.

Reproduce: Admin UI

The issue is in the React admin under /_emdash/admin/*. You need a running demo, an authenticated session, and a way to drive the UI through the steps the reporter described. The best outcome is a Playwright test under packages/admin/tests/e2e/ (or the root e2e/ suite when the bug crosses package boundaries) that fails today and will guard against regression once a fix lands. The second-best outcome is an agent-browser transcript with screenshots.

Hard prohibitions

No git commit, no git push, no branch creation that survives the workflow.
No GitHub writes (gh issue comment, gh pr ..., gh issue edit). Read-only gh reads only.
No curl to arbitrary external hosts. localhost:4321 only.
Do not touch any issue other than the one being investigated.
Do not modify Lingui catalogs (packages/admin/src/locales/*/messages.po). They are regenerated by a workflow on merge to main; touching them from the bot creates merge churn.

Procedure

Re-read the issue. Note the exact steps the reporter described, the page they were on, the browser they used, and any screenshots or stack traces. If the steps reference a collection or content item, decide whether the default demo seed covers it or whether you need to create content first.
Pick a demo. demos/simple is the default starting point and works for most admin reproductions. Use a more specific demo only when the issue explicitly mentions it.
Start the demo with bgproc. Example: bgproc 'pnpm --filter demos/simple dev' --port 4321 --ready-pattern "watching for file changes". bgproc returns when the ready pattern matches; do not move on before that. If the ready pattern never matches, capture the tail of stdout and treat it as a setup failure -- not a reproduction.
Get a session. Open agent-browser open "http://localhost:4321/_emdash/api/setup/dev-bypass?redirect=/_emdash/admin". This runs migrations, creates a dev admin user, sets a session cookie, and lands you on the admin home. The endpoint is gated to import.meta.env.DEV so it only exists locally -- do not try to use it against any deployed environment.
Drive the UI. Use agent-browser snapshot -i -c to get an accessibility tree with @e<n> refs. Interact with click @e<n>, fill @e<n> "text", select @e<n> "option". Refs are stable only within a snapshot -- re-snapshot after each navigation or DOM change.
Screenshot at meaningful steps. Save to .bot-artifacts/step-<n>.png. Take one when you land on the page, one at the point where the reporter says the bug appears, and one of the broken state. Use --full only when the bug is below the fold. Keep file sizes reasonable.
Watch for JS errors. After each interaction, run agent-browser console and agent-browser errors. Capture anything that looks related to the symptom. Console warnings about React keys or unmounted setState are almost never the bug; runtime exceptions usually are.
Prefer a Playwright test. If the reproduction is deterministic, port it to a Playwright test under packages/admin/tests/e2e/ (or the appropriate suite in the root e2e/). Use the dev-bypass URL in your test.beforeEach to establish the session. Run with pnpm test:e2e (or the project's filter) and confirm the test fails for the reported reason. Name the test for the issue: test("reproduces #<number>: <short description>", ...).
Confirm the failure mode matches. A snapshot that shows a different broken state is not a reproduction. If you can only get the page into an adjacent broken state, say so in notes.

When to skip

Mark skipped: true and explain in notes when:

The bug requires a specific browser engine that Playwright cannot drive faithfully (rare; usually a Safari-specific layout quirk).
The bug requires OS-level interaction beyond what Playwright supports -- native file pickers in non-trivial drag-drop, OS clipboard internals, IME flows, hardware key combinations.
The bug requires real Cloudflare Access in front of the admin. The dev-bypass path skips Access; if the symptom is specifically "Access redirects me incorrectly", you cannot reproduce it locally.
The reporter's repro depends on production data, third-party OAuth, or a hosted environment.
The demo will not boot for an unrelated reason and the failure is in setup, not in the admin code.

Output

Return:

Whether you reproduced the bug.
Whether you skipped (with reason if so).
The approach you used: playwright-test, agent-browser-only, or none.
Notes: a short paragraph naming the demo, the URL path where the symptom appeared, the interaction sequence in plain prose, any console or runtime errors, and the test file path if you wrote one.
A list of screenshots, each with the relative filename under .bot-artifacts/ and a one-line description of what it shows.

Do not stage or commit the test you wrote. The fix stage may pick it up; if no fix runs, the orchestrator decides what to do with the working tree.