Playwright VS Code Loop for Codex
Orchestrate Playwright planner, generator, and healer workflows from Codex with VS Code loop execution for reusable web UX QA.
DocumentationRequirements & limits
Use when Codex is orchestrating a VS Code-compatible Playwright planner, generator, and healer loop.
Inputs
- app_dir (for monorepos, explicit app subdirectory)
- playwright_config_path
- base_url and/or local web command
- smoke routes and high-risk interactions
- sample detail page route
Outputs
- Test plan
- Generated spec
- Healing notes
Before you begin
- Reading and copying the procedure require no terminal setup. Check requirements for any packaged programs separately.
Try this first
Read the procedure and supply its documented inputs. Use the full text in an agent app or chat that supports pasted instructions, following that host's guidance.
Limits for this step
- Instruction package only; it does not provide or authorize an executable runtime capability.
- May run local QA workflows and propose test updates; require human approval before accepting broad healing changes.
- Packaged programs have independent setup and verification requirements. Reading or copying this procedure does not verify their execution.
Read full instructionsHide full instructions
Playwright VS Code Loop for Codex
When to use
Use when you want Codex to run repeatable UX smoke/regression loops while delegating Playwright agent execution to a VS Code-compatible loop.
Inputs required
- app_dir (for monorepos, explicit app subdirectory)
- playwright_config_path
- base_url and/or local web command
- smoke routes and high-risk interactions
- sample detail page route
Workflow
- Planner phase
- Confirm target routes and pass criteria.
- Keep first scope to smoke tests only.
- Generator phase
- Generate or update Playwright specs with stable locators (role/text/test-id).
- Ensure config has explicit
testDir,outputDir, andwebServer.cwd.
- Runner phase
- Run Playwright tests and collect traces/report artifacts.
- Healer phase
- Apply the smallest safe selector/flow patch for failures.
- Re-run and summarize behavioral changes.
- Promote phase
- Keep a reusable baseline suite for all future web feature PRs.
VS Code loop execution notes
- Codex remains the orchestrator and decision-maker.
- Use VS Code loop tooling for the Playwright agent cycle where supported.
- If loop tooling is unavailable, run equivalent planner/generator/healer steps manually with Playwright tests.
Global Codex usage
- Keep this skill in your global Codex skills directory for cross-project reuse.
- Suggested install target:
$CODEX_HOME/skills/playwright-vscode-loop-codex. - In each project, pass explicit monorepo paths before generation.
Output format
- Test Plan
- Generated/Updated Files
- Run Summary
- Healing Notes
- Residual Risk
Guardrails
- Never claim passing coverage for untested flows.
- Do not widen scope automatically from smoke to full regression.
- Do not auto-delete failing tests; heal with minimal changes.
- Prefer robust user-facing locators over brittle CSS selectors.
View file metadata
---
name: playwright-vscode-loop-codex
description: Use Codex as orchestrator for Playwright planner, generator, and healer loops executed through VS Code-compatible Playwright agent flow.
---Install instruction files
These commands copy guidance into the selected runtime directories. Confirm that your agent app discovers it. Any packaged programs need separate setup and verification.
Install (Codex)
./bin/skills-hub install adtech/[email protected] --runtime codex
Install (Claude)
./bin/skills-hub install adtech/[email protected] --runtime claude
Install (Generic)
./bin/skills-hub install adtech/[email protected] --runtime generic --target ./my-agent/skills