Playwright Test Agents – Local Setup

The repository now ships with the Playwright Test Agents configuration generated via npx playwright init-agents --loop=opencode. The agent bundle lives under .opencode/ plus opencode.json, so Cursor/VS Code subagents can use the planner, generator, and healer loops.

Environment assumptions

• playwright.config.ts runs both legacy specs in e2e/ and the new agent-authored specs that live in tests/**/*.pw.spec.ts.
• The config exports a webServer command that sets TEST_MODE=1 and E2E_FAKE_DB=1, so you do not need a Postgres server when generating or running tests.
• The new seed test is tests/seed.pw.spec.ts. Agents (and humans) can run this seed to ensure /app/bulk/new is ready before building further plans.

Day-to-day workflow

1. Planner: ask for a plan while referencing tests/seed.pw.spec.ts plus any Markdown spec in specs/.
2. Generator: once the plan exists, run the generator agent to emit .pw.spec.ts files under tests/.
3. Healer: when a .pw.spec.ts test fails, invoke the healer agent to suggest locator/wait fixes. Review the patch before committing.

All generated tests should stick to the .pw.spec.ts suffix so they remain scoped to Playwright and avoid clashing with Vitest unit tests under tests/.

Using agents locally

1. Start the Remix dev server with npm run dev (or rely on the Playwright web server) so /app/bulk/new is reachable.
2. When prompting the planner, mention the seed (tests/seed.pw.spec.ts) and the spec file you want to target (e.g., specs/bulk-variants.md).
3. Use the generator to translate that spec into .pw.spec.ts files. Generated files live under tests/ – keep their suffix as .pw.spec.ts.
4. Use the healer on a failing spec (tests/bulk-tasks/basic-actions.pw.spec.ts, etc.). Re-run npm run test:e2e -- <spec> locally before accepting the fix.

Manual commands

# Install browsers after upgrading Playwright
npx playwright install

# Run the full suite (legacy + agent tests)
npm run test:e2e

# Run only the new agent tests
npx playwright test tests/**/*.pw.spec.ts

Tip: when recording or debugging, add --headed --ui to the commands above to watch the flows in Chromium.

CI integration

• .github/workflows/ci.yml runs npm run test:e2e on every push/PR so the agent-authored suites (in tests/**/*.pw.spec.ts) stay green alongside the legacy specs.
• .github/workflows/playwright-healer.yml can be triggered manually (Run workflow) to re-run the last failing specs or a specific file. It uploads playwright-report/ and test-results/ artifacts for offline debugging.