Browsing with playwright
Skill sheikh-mohammad/agent-factory-claude-skills/.claude/skills/browsing-with-playwright
Browser automation using Playwright MCP. Navigate websites, fill forms, click elements, take screenshots, and extract data. Use for web browsing, form submission, web scraping, or UI testing. NOT for static content (use curl/wget).From its SKILL.md
npx -y skills add sheikh-mohammad/agent-factory-claude-skills --skill browsing-with-playwrightAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
2 things to look at
- no licenseNo license file was found in the repository. Code published without one is not open source by default, so using it at work is a question for whoever answers licensing questions where you are.
- 6 stars6 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
SKILL.md
4.6 KB, ~1.1k tokens by cl100k_base, as published. Nobody here has run it
Browser Automation
Automate browser interactions via Playwright MCP server.
Server Lifecycle
Start Server
# Using helper script (recommended)
bash scripts/start-server.sh
# Or manually
npx @playwright/mcp@latest --port 8808 --shared-browser-context &
Stop Server
# Using helper script (closes browser first)
bash scripts/stop-server.sh
# Or manually
python3 scripts/mcp-client.py call -u http://localhost:8808 -t browser_close -p '{}'
pkill -f "@playwright/mcp"
When to Stop
- End of task: Stop when browser work is complete
- Long sessions: Keep running if doing multiple browser tasks
- Errors: Stop and restart if browser becomes unresponsive
Important: The --shared-browser-context flag is required to maintain browser state across multiple mcp-client.py calls. Without it, each call gets a fresh browser context.
Quick Reference
Navigation
# Go to URL
python3 scripts/mcp-client.py call -u http://localhost:8808 -t browser_navigate \
-p '{"url": "https://example.com"}'
# Go back
python3 scripts/mcp-client.py call -u http://localhost:8808 -t browser_navigate_back -p '{}'
Get Page State
# Accessibility snapshot (returns element refs for clicking/typing)
python3 scripts/mcp-client.py call -u http://localhost:8808 -t browser_snapshot -p '{}'
# Screenshot
python3 scripts/mcp-client.py call -u http://localhost:8808 -t browser_take_screenshot \
-p '{"type": "png", "fullPage": true}'
Interact with Elements
Use ref from snapshot output to target elements:
# Click element
python3 scripts/mcp-client.py call -u http://localhost:8808 -t browser_click \
-p '{"element": "Submit button", "ref": "e42"}'
# Type text
python3 scripts/mcp-client.py call -u http://localhost:8808 -t browser_type \
-p '{"element": "Search input", "ref": "e15", "text": "hello world", "submit": true}'
# Fill form (multiple fields)
python3 scripts/mcp-client.py call -u http://localhost:8808 -t browser_fill_form \
-p '{"fields": [{"ref": "e10", "value": "[email protected]"}, {"ref": "e12", "value": "password123"}]}'
# Select dropdown
python3 scripts/mcp-client.py call -u http://localhost:8808 -t browser_select_option \
-p '{"element": "Country dropdown", "ref": "e20", "values": ["US"]}'
Wait for Conditions
# Wait for text to appear
python3 scripts/mcp-client.py call -u http://localhost:8808 -t browser_wait_for \
-p '{"text": "Success"}'
# Wait for time (ms)
python3 scripts/mcp-client.py call -u http://localhost:8808 -t browser_wait_for \
-p '{"time": 2000}'
Execute JavaScript
python3 scripts/mcp-client.py call -u http://localhost:8808 -t browser_evaluate \
-p '{"function": "return document.title"}'
Multi-Step Playwright Code
For complex workflows, use browser_run_code to run multiple actions in one call:
python3 scripts/mcp-client.py call -u http://localhost:8808 -t browser_run_code \
-p '{"code": "async (page) => { await page.goto(\"https://example.com\"); await page.click(\"text=Learn more\"); return await page.title(); }"}'
Tip: Use browser_run_code for complex multi-step operations that should be atomic (all-or-nothing).
Workflow: Form Submission
- Navigate to page
- Get snapshot to find element refs
- Fill form fields using refs
- Click submit
- Wait for confirmation
- Screenshot result
Workflow: Data Extraction
- Navigate to page
- Get snapshot (contains text content)
- Use browser_evaluate for complex extraction
- Process results
Verification
Run: python3 scripts/verify.py
Expected: ✓ Playwright MCP server running
If Verification Fails
- Run diagnostic:
pgrep -f "@playwright/mcp" - Check: Server process running on port 8808
- Try:
bash scripts/start-server.sh - Stop and report if still failing - do not proceed with downstream steps
Tool Reference
See references/playwright-tools.md for complete tool documentation.
Troubleshooting
| Issue | Solution |
|---|---|
| Element not found | Run browser_snapshot first to get current refs |
| Click fails | Try browser_hover first, then click |
| Form not submitting | Use "submit": true with browser_type |
| Page not loading | Increase wait time or use browser_wait_for |
| Server not responding | Stop and restart: bash scripts/stop-server.sh && bash scripts/start-server.sh |
What ships with it: 5 files
38.3 KB alongside SKILL.md, 4 of them executable
references/
- playwright-tools.md19.8 KB
scripts/
- mcp-client.pyruns16.4 KB
- start-server.shruns683 B
- stop-server.shruns898 B
- verify.pyruns533 B
Gives 1 of the 12 instructions most e2e browser skills give in ~1.1k tokens
Counted across 499 of the 513 authors here whose files we hold, read 2026-09-06
- Capture screenshots, videos, and traces on failurein 32 of 499, across 23 files
- Close the browser when donein 22 of 499
- Interact with elements using snapshot refshere, and in 21 of 499, across 20 files
- Wait for specific network responses instead of fixed timeoutsin 20 of 499, across 10 files
- Keep tests independent with no shared statein 19 of 499, across 17 files
- Use Page Object Model classes to encapsulate page interactionsin 19 of 499, across 9 files
- Locate elements with data-testid attributesin 19 of 499, across 10 files
- Quarantine flaky tests with fixme or skipin 17 of 499, across 7 files
- Upload test artifacts after every CI runin 17 of 499, across 8 files
- Wait on conditions instead of using fixed sleepsin 17 of 499, across 13 files
- Clean up test data after each testin 17 of 499, across 16 files
- Test user-visible behavior, not implementation detailsin 16 of 499, across 10 files
Said here and by no other author read
- Include the shared browser context flag
- Keep the server running during long sessions
- Stop the server when browser work completes
- Restart the server if the browser is unresponsive
- Use browser_run_code for complex multi-step operations
- Wait for confirmation after submitting forms
Grouped from the skills themselves: near-identical wordings counted once, and counted by distinct author, so one author publishing three of these counts once. Length counted with cl100k_base; the agent that loads this file may tokenize it differently.