Playwright MCP server in Cursor.
Give Cursor's agent a browser it can actually drive. One mcp.json entry, one toggle, and it can open your dev server and click through what it just built.
The tightest loop in agentic frontend work is edit, open, verify — and Cursor only ships the first step. playwright-mcp, Microsoft's 33.7k-star MCP server, supplies the other two: it gives Cursor's agent tools to navigate, click, fill forms, and snapshot pages, reading them through the accessibility tree so element targeting is deterministic rather than vision-based.
Cursor supports MCP at two levels — global for every project, or per-repo via a checked-in file — and both take the same five-line JSON.
Pick global or project scope
Global config lives at ~/.cursor/mcp.json and applies everywhere. Project config lives at .cursor/mcp.json in the repo root and can be committed, which is the right call when browser-verification is part of the team's workflow rather than your personal habit.
You can also go through the UI: Cursor Settings > MCP > Add new MCP server writes the same file for you. Node 18+ must be installed either way, since the server launches via npx.
The config entry
Add this to whichever mcp.json you chose:
{
"mcpServers": {
"playwright": {
"command": "npx",
"args": ["@playwright/mcp@latest"]
}
}
}Enable it and watch for the green dot
Open Cursor Settings > MCP. The playwright server appears in the list with a toggle — flip it on if it isn't already. A green indicator means Cursor spawned the process and completed the MCP handshake; the tool count next to it should show the browser_* tools.
Test from the agent: "open http://localhost:3000, click the pricing link, and tell me what loads." Cursor will ask for approval on each tool call by default; you can enable auto-run for tools you trust once you've watched a few cycles. For an agent loop that doesn't pop windows over your editor, add "--headless" to the args.
Troubleshooting in Cursor
Red dot or no tools listed: hover the server row for the error. The classic is npx resolving badly because Cursor inherited a minimal PATH — launch Cursor from a terminal, or set command to the absolute path of npx (which npx tells you where).
Server on, but the agent never uses it: check how many tools you have enabled across all MCP servers. Cursor caps the tools sent to the model (around forty), and playwright-mcp brings twenty-plus by itself — disable servers you're not using so its tools make the cut.
Config edits ignored: Cursor re-reads mcp.json on settings interaction, but a stale server process can linger; toggle the server off and on from Settings > MCP to force a clean respawn.
First call hangs: npx is downloading the package or a Chromium build. Run npx playwright install chromium once in a terminal to pre-fetch.
Where it lives on Loomal
playwright-mcp's listing on the Loomal marketplace — https://loomal.ai/marketplace/playwright-mcp — shows its package, category, and live-probed tool list alongside other Browser Automation servers. The index is queryable by agents too, which matters once your Cursor workflows start discovering tools instead of you hand-configuring each one.
FAQ
How do I install Playwright MCP in Cursor?
Create or edit ~/.cursor/mcp.json (global) or .cursor/mcp.json (project) and add a playwright entry with command npx and args ["@playwright/mcp@latest"]. Then open Cursor Settings > MCP and make sure the server's toggle is on — a green dot confirms it connected.
Global or project mcp.json — which should I use?
Project (.cursor/mcp.json) if browser checks are part of how the team works on that repo, since it ships with the code. Global (~/.cursor/mcp.json) if it's your personal default everywhere. Cursor merges both, so you can keep playwright global and add project-specific servers on top.
Why does Cursor's agent ignore the browser tools?
Most often the tool budget: Cursor limits how many MCP tools it forwards to the model, roughly forty across all enabled servers. playwright-mcp alone contributes over twenty. Disable unused servers in Settings > MCP so the browser tools are actually in the set the agent sees.
Can I make the browser invisible?
Yes — append "--headless" to the args array. Headed mode is worth keeping while you're learning what the agent does with the browser; headless is better once it's a routine verification step you don't need to watch.
Browse more MCP servers for Cursor.
Every Loomal listing shows package, tool list, and pricing.