Build Playwright tests from a live app with Claude Code
Claude Code inspected a working app, generated a Playwright test, and fixed a locator conflict before a person checked the result.
- What they did
- A developer hooked Playwright MCP into Claude Code and opened the app with an existing authenticated session loaded from storage state. They gave the agent three parts to follow: background on the setup, a plain description of the scenario, and the rules it had to obey. Claude Code navigated the interface through the accessibility tree, wrote the test, executed it, and repaired the code after a failure.
- How it went
- The agent returned a test that ran successfully and used selectors gathered from the live page itself. It also handled a strict-mode locator problem on its own. It does not cope well with lengthy user paths, changing records, nested branching, or OAuth, and no runtime figures were provided.
- Tips
- Add .auth/ to .gitignore so the stored session does not get committed, since this arrangement keeps it outside Playwright’s default ignored paths. Use --repeat-each 5 when you run the test to spot flaky behavior early.
Try it yourself with Claude Code
Connect Playwright MCP to this project, then open [app URL] with the available authenticated session and study the flow for [user journey]. Create Playwright tests with locators you derive from the live interface, run them, and keep fixing issues that are safe to resolve. Stop and ask before any step that would send, submit, delete, or pay. When you finish, show the generated test code and the successful test run.
Fill in the [brackets]. Agents can make mistakes, so review anything before it is sent, paid or deleted.
Get 3 agent uses like this every morning
With the day's top AI news. Free, and one click to unsubscribe.
Related agent uses
Use a browser agent for setup tasks that come up while coding
A developer keeps coding in Claude Code while Claude in Chrome handles related web settings changes in the browser.
Review a pull request with staged sub-agents
Use parallel checks and a validation pass to review a branch or PR before you decide what to fix.
Use Claude Code from a phone with a remote VM
They accessed Claude Code on an iPhone by pairing a Tailscale-only Vultr VM with Termius, mosh, and tmux.
Build a five-step feature pipeline with approval gates
A solo SaaS founder used chained Claude Code commands to turn ideas into shipped features with less token use and faster turnaround.
Use Claude Code to hunt flaky CI tests overnight
Claude Code tracked CI flakiness, isolated the worst tests, and suggested fixes while a human reviewed the changes each day.
Investigate why a service is getting killed
Run a read-only SSH check to find the cause of a process death and rank fixes by risk.