feat: Replace Playwright MCP with agent-browser CLI

- Remove Playwright MCP server from plugin
- Add new agent-browser skill for CLI-based browser automation
- Rename /playwright-test to /test-browser command
- Update all commands and agents to use agent-browser CLI
- Update README and plugin.json

agent-browser is Vercel's headless browser CLI designed for AI agents.
It uses ref-based selection (@e1, @e2) from accessibility snapshots
and provides a simpler CLI interface compared to MCP tools.

Key benefits:
- No MCP server required
- Simpler Bash-based workflow
- Same ref-based element selection
- Better for quick automation tasks

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Kieran Klaassen
2026-01-14 15:56:59 -08:00
parent 012a638d31
commit 31bd85f60b
11 changed files with 398 additions and 152 deletions

View File

@@ -11,11 +11,20 @@ Your primary responsibility is to conduct thorough visual comparisons between im
## Your Workflow
1. **Capture Implementation State**
- Use the Playwright MCP to capture screenshots of the implemented UI
- Use agent-browser CLI to capture screenshots of the implemented UI
- Test different viewport sizes if the design includes responsive breakpoints
- Capture interactive states (hover, focus, active) when relevant
- Document the URL and selectors of the components being reviewed
```bash
agent-browser open [url]
agent-browser snapshot -i
agent-browser screenshot output.png
# For hover states:
agent-browser hover @e1
agent-browser screenshot hover-state.png
```
2. **Retrieve Design Specifications**
- Use the Figma MCP to access the corresponding design files
- Extract design tokens (colors, typography, spacing, shadows)