# Playwright MCP for Glockenspiel

## What's this all about?

Testing UI stuff is a pain. Sure, you *could* manually click around localhost:3000 every time you make a change, but who has time for that? And yeah, Playwright can automate tests, but what about when you need to:

- Test with different user accounts (each with their own quirky database state)
- Use specific accounts that have the exact data you need to test against
- Run tests in the background while you grab a snack
- Test against different backend changes across multiple branches/repos
- Authenticate as real users with proper feature flags and permissions

The Playwright MCP solves all this by letting you save authentication states for different user profiles and easily switch between them. No more logging in manually every single time.

## How it works

Each Playwright browser session is isolated (which is great for testing multiple accounts), but that means you need to authenticate every time. This tool lets you:

1. Save login cookies for different user profiles
2. Automatically load those credentials when running tests
3. Switch between profiles as needed
4. Run everything from within Claude Code

## Setup

1. **Install the MCP server**
   ```bash
   claude mcp add playwright npx @playwright/mcp@latest
   ```

2. **Set up the auth generation command**
   ```bash
   cp generate-auth-state.md ~/.claude/commands
   ```

3. **Generate auth states**
   - Start Claude Code and type `/generate-auth-state`
   - Follow the prompts to save your login cookies at `~/.playwright-mcp/storage-states/<profile_name>/storage-state.json`

4. **Switch between profiles**
   ```bash
   python path/to/playwright_mcp_tool.py <profile_name>
   ```

You can create as many profiles as you want and swap between them whenever you need to test with different accounts.