MCP server for msw
About
Cli & MCP server for msw (Mock Service Worker) for AI Agents with dynamic mocking
Details
- License
- MIT
Explore
- 🤖 Generate MSW handlers with AI
- ⚡ Update mocks without reloading the page
- 🌉 WebSocket bridge between Cli/MCP and the browser
- 🛠️ Scaffold MSW setup with msw-cli setup or MCP's /msw-setup prompt
- 💻 Terminal and script control via msw-cli
- ⚙️ Configurable port, persistence, and client targeting
- ✨ Agent skills for AI agents to use
Setting up with Highlight
This MCP is not yet compatible with Highlight’s one-click setup. However, you can still use it with Highlight by following these steps:
- Download and install Highlight from highlightai.com/download
- Navigate to the plugins tab and select "Add Custom Plugin"
-
Configure the plugin with the settings below
Plugin Name
MCP server for mswCommand (node, npx, python, etc.)Please refer to the README for specific instructions on how to obtain API keys or other required environment variables.
- Enable "Start Automatically" if you want the plugin to start when Highlight launches
From the repository
1. Install dependencies:
pnpm install
2. Build the project:
pnpm build
3. Use the CLI:
You can navigate to the CLI directory or use it directly via node after building:
node packages/msw-cli/build/index.js help
1. Install the CLI globally: npm install -g msw-cli (or use your package manager’s equivalent).
2. In a new project, run msw-cli setup and follow the printed steps for MSW + @msw-mcp/client.
3. Start a session, then drive handlers from the shell:
msw-cli open
msw-cli add "http.get('/api/user', () => HttpResponse.json({ id: 1 }))"
msw-cli status
msw-cli close
Full command reference, flags, and workflows: packages/msw-cli/README.md.
1. Register the server in your MCP client (example for JSON config):
{
"mcpServers": {
"msw-mcp": {
"command": "npx",
"args": ["msw-mcp@latest"]
}
}
}
2. In the client, use the /msw-setup prompt (or follow manual steps) so the browser app loads msw, @msw-mcp/client, and the worker bridge.
Installation options (VS Code, Claude Code, Cursor, etc.), architecture, MCP tools, and manual setup: packages/msw-mcp/README.md.
msw_add_handlers
Add MSW request handlers to the browser service worker at runtime. Accepts JavaScript handler code strings that will be executed in the browser.
msw_reset_handlers
Reset MSW request handlers in the browser service worker. If no handlers provided, removes all runtime handlers and keeps only initial ones. If handlers provided, replaces all handlers with the new ones.
msw_remove_handlers
Remove specific MSW request handlers from the browser service worker by URL patterns and optional HTTP methods.
msw_update_handlers
Update existing MSW request handlers by replacing handlers that match specified URL patterns with new handler code. This is an atomic operation that removes old handlers and adds new ones in a single transaction.
msw_get_status
Get the current status of the MSW service worker, including connection state, worker status, and active handlers.
Claude Desktop / Cursor
Paste into your MCP client config file to install this server.
{
"mcpServers": {
"mcp server for msw": {
"msw-mcp": {
"command": "npx",
"args": [
"msw-mcp@latest"
]
}
}
}
}McpServers
{
"msw-mcp": {
"command": "npx",
"args": [
"msw-mcp@latest"
]
}
}Quick setup: msw-mcp (MCP)
1. Register the server in your MCP client (example for JSON config):
{
"mcpServers": {
"msw-mcp": {
"command": "npx",
"args": ["msw-mcp@latest"]
}
}
}
2. In the client, use the /msw-setup prompt (or follow manual steps) so the browser app loads msw, @msw-mcp/client, and the worker bridge.
Installation options (VS Code, Claude Code, Cursor, etc.), architecture, MCP tools, and manual setup: packages/msw-mcp/README.md.
Sign in to leave a review
Use Google, GitHub, or an email account so ratings stay tied to real people.
No reviews posted yet.
