playwright-mcp
Provides keyboard shortcuts support for macOS users to access the Cursor AI window with Cmd + I.
Utilized as a runtime for running the playwright-mcp server, which enables browser automation and DOM interaction.
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@playwright-mcptake a screenshot of the login form on the current page"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
How to Use playwright-mcp?
Introduction
Ever tried using Cursor or Claude to write Playwright tests? Yeah, it's kind of a mess.
Why? Because your AI assistant has no clue what's on your web page. It's like trying to describe a painting to someone who's blindfolded. The result?
Flaky tests → The AI is guessing selectors, and it gets them wrong.
Broken scripts → You spend more time fixing tests than writing them.
Debugging nightmares → The AI can't "see" what's happening, so you end up doing all the heavy lifting.
Wouldn't it be nice if your AI could actually understand your web page instead of just making educated guesses?
Enter playwright-mcp !
playwright-mcp gives your AI assistant superpowers by making the browser fully visible to it. Instead of working in the dark, your AI assistant now has real-time access to the page DOM, elements, and interactions.
How playwright-mcp Works (AKA How We Fix This Mess)
Once installed, playwright-mcp spins up a Playwright-controlled browser and gives your AI assistant full access to it. This unlocks:
Recording interactions → Click, type, scroll—let playwright-mcp turn your actions into fully functional Playwright test cases.
Taking screenshots → Capture elements or full pages so your AI gets actual visual context (no more guessing).
Extracting the DOM → Grab the entire HTML structure so the AI can generate rock-solid selectors.
Executing JavaScript → Run custom JS inside the browser for debugging, automation, or just for fun.
Why You'll Love playwright-mcp
🚀 AI-generated tests that actually work → No more flaky selectors, broken tests, or guesswork.
⏳ Massive time savings → Write and debug Playwright tests 5x faster.
🛠️ Fewer headaches → Your AI assistant gets live page context, so it can generate real test cases.
🔌 Works out of the box → Plug it into Cursor, Claude, WindSurf, or whatever you use—it just works.
Give Your AI the Context It Deserves
Tired of fixing AI-generated tests? Stop debugging AI's bad guesses—start writing flawless Playwright tests. Use the guide below to install playwright-mcp and let your AI assistant actually help you for once.
Installation: Get Up and Running in No Time
Prerequisites (a.k.a. What You Need Before You Start)
Before you install playwright-mcp, make sure you have:
✅ Node.js installed on your system (because, well… it's an npm package)
✅ Playwright and its Chromium browser installed
✅ An IDE that supports MCP, like Cursor
✅ A brain that's ready to automate Playwright tests like a pro
Setting Up playwright-mcp (It's Easy, I Promise)
Connect It to Your IDE (Cursor Setup)
If you're using Cursor, follow these steps to connect playwright-mcp like a boss:
Open Cursor IDE
Navigate to Settings (⚙️)
Select Cursor Settings → Go to the MCP tab
Click "Add new MCP server"
Fill in the following details:

Name →
playwright-mcpCommand →
npx -y playwright-mcp
Click "Add", and boom—you're connected! 🚀
Note: If clicking on "Add new MCP server", opens a file(.cursor/mcp.json), Paste the following code and save:
{
"mcpServers": {
"playwright-mcp": {
"command": "npx",
"args": [
"-y",
"playwright-mcp"
]
}
}
}Now Cursor actually understands your web pages. No more random test suggestions based on zero context! Head to the Claude tutorial or Cursor tutorial to understand it in details.
Connect It to Claude desktop
Wait… Does It Work with Other AI Assistants? Yes! While playwright-mcp is a match made in heaven for IDEs, you can use it with Claude desktop to write tests as well.
Install
playwright-mcp(The Easy Part)First things first, fire up your terminal and run:
npm install -g playwright-mcp
Hook It Up to Claude Desktop
Find the Configuration File
On windows
%APPDATA%\Claude\claude_desktop_config.json
On macOS:
~/Library/Application Support/Claude/claude_desktop_config.json
Update the config file
{ "mcpServers": { "playwright": { "command": "npx", "args": ["-y", "playwright-mcp"] } } }Restart Claude Desktop (Because It's a New Day)
Close and reopen Claude Desktop to apply the changes.
Verify That It's Working
Once everything is set up, let's test if Claude can actually talk to Playwright now.
Open Claude and ask: "List all available MCP tools."
If
playwright-mcpis installed correctly, it should list tools like:get-contextget-full-domget-screenshotexecute-codeinit-browservalidate-selectors
Ask Claude to init browser and a browser should open up after your approval!
Now that the Calude has access to the web pages. You can ask it write highly contextual tests! Head to the Claude tutorial or Cursor tutorial to understand it in details.
Available Tools
5 toolsexecute-codeA
Execute custom Playwright JS code against the current page
| Name | Required | Description | Default |
|---|---|---|---|
| code | Yes | The Playwright code to execute. Must be an async function declaration that takes a page parameter. Example: async function run(page) { console.log(await page.title()); return await page.title(); } Returns an object with: - result: The return value from your function - logs: Array of console logs from execution - errors: Array of any errors encountered Example response: {"result": "Google", "logs": ["[log] Google"], "errors": []} |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries full burden and does well by disclosing key behavioral traits: it executes code asynchronously, requires a specific function structure (async with page parameter), and details the return format (result, logs, errors). It doesn't mention rate limits, auth needs, or destructive effects, but covers execution mechanics adequately for a tool with no annotations.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, front-loaded sentence that directly states the tool's purpose with zero waste. Every word earns its place by specifying the action, code type, and target, making it highly efficient and easy to parse.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given one parameter with full schema coverage and no output schema, the description is reasonably complete. It explains the execution process and return format, compensating for the lack of output schema. However, it doesn't address potential errors or side effects beyond the listed response fields, leaving minor gaps for a code execution tool.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema description coverage is 100%, so the baseline is 3. The description adds value by emphasizing the code must be 'Playwright JS' and executed 'against the current page', providing context beyond the schema's technical details. It doesn't elaborate on parameter syntax beyond the example, but enhances understanding of the tool's scope.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the verb ('execute') and resource ('custom Playwright JS code') with the target ('against the current page'). It distinguishes from siblings like get-context or get-screenshot by focusing on code execution rather than retrieval or capture. However, it doesn't explicitly differentiate from init-browser in terms of browser lifecycle management.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description implies usage for executing custom code on a page, suggesting it's for dynamic interactions beyond simple data fetching. No explicit guidance on when to use vs. alternatives like get-full-dom for static content or prerequisites (e.g., requires an initialized browser). The context is clear but lacks specific exclusions or named alternatives.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
get-contextB
Get the website context which would be used to write the testcase
| Name | Required | Description | Default |
|---|---|---|---|
No parameters | |||
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full burden. It states the tool retrieves website context for testcase writing, but doesn't disclose behavioral traits like whether it's read-only, requires browser initialization, has side effects, or what format the context is returned in. This leaves significant gaps for an agent to understand how to use it effectively.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, clear sentence that efficiently conveys the core purpose without any wasted words. It's front-loaded with the main action and context, making it easy for an agent to parse quickly.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the lack of annotations and output schema, the description is incomplete. It doesn't explain what 'website context' entails (e.g., metadata, state, or specific data), how it relates to sibling tools, or what the return value looks like. For a tool in a browser automation context with siblings like get-full-dom, more detail is needed to guide proper usage.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The input schema has 0 parameters with 100% coverage, so no parameter documentation is needed. The description appropriately doesn't discuss parameters, focusing instead on the tool's purpose. This meets the baseline for tools with no parameters, as it doesn't add unnecessary details.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the tool's purpose: 'Get the website context which would be used to write the testcase.' It specifies the verb ('Get') and resource ('website context'), and indicates its use for testcase writing. However, it doesn't explicitly differentiate from sibling tools like get-full-dom or get-screenshot, which might provide related but different website information.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides minimal guidance by implying usage in testcase writing contexts, but it lacks explicit when-to-use instructions, alternatives, or exclusions compared to sibling tools. There's no mention of prerequisites, such as whether init-browser must be called first, or how this differs from get-full-dom for DOM retrieval.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
get-full-domA
Get the full DOM of the current page. (Deprecated, use get-context instead)
| Name | Required | Description | Default |
|---|---|---|---|
No parameters | |||
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries the full burden of behavioral disclosure. It states the tool's purpose and deprecation status but lacks details about what 'full DOM' includes (e.g., structure, limitations), performance implications, or error handling. The description adds some context (deprecation) but doesn't fully compensate for the missing annotation coverage.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is extremely concise with just two sentences that each serve a distinct purpose: the first states the tool's function, and the second provides critical usage guidance. There is zero wasted text, and the information is front-loaded with the core purpose immediately clear.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the tool has 0 parameters, no annotations, and no output schema, the description provides adequate context for a simple, deprecated tool. It clearly explains what the tool does and why it shouldn't be used, which is sufficient for its complexity level. However, it could be more complete by explaining what 'full DOM' entails or linking to documentation for the replacement tool.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The input schema has 0 parameters with 100% coverage, so no parameter documentation is needed. The description appropriately doesn't discuss parameters, focusing instead on the tool's purpose and usage guidance. This meets the baseline expectation for tools without parameters.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the specific action ('Get the full DOM') and the target resource ('of the current page'), providing a complete verb+resource combination. It also explicitly distinguishes from its sibling 'get-context' by marking itself as deprecated and recommending the alternative, which enhances clarity about its role relative to other tools.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides explicit guidance on when not to use this tool ('Deprecated, use get-context instead'), directly naming the alternative sibling tool. This gives clear, actionable advice for tool selection, helping the agent avoid deprecated functionality in favor of the recommended option.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
get-screenshotB
Get a screenshot of the current page
| Name | Required | Description | Default |
|---|---|---|---|
No parameters | |||
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries the full burden of behavioral disclosure. It states what the tool does but lacks details on traits like whether it requires a browser session to be active, if it captures the entire viewport or a specific area, potential delays or failures, or the format of the output (e.g., image data, file path). This is a significant gap for a tool with no annotation coverage.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, clear sentence with zero waste—it directly states the tool's function without unnecessary words. It is appropriately sized and front-loaded, making it easy for an agent to parse quickly.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the tool's complexity (capturing a screenshot likely involves browser state and output handling), lack of annotations, and no output schema, the description is incomplete. It doesn't address behavioral aspects like dependencies on an active page or what the output contains, leaving the agent with insufficient context for reliable use.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The input schema has 0 parameters with 100% coverage, so no parameter documentation is needed. The description doesn't add param info, which is appropriate here. Baseline is 4 for 0 params, as the description doesn't need to compensate for any schema gaps.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the action ('Get') and resource ('screenshot of the current page'), making the tool's purpose immediately understandable. It doesn't explicitly differentiate from siblings like 'get-full-dom' or 'get-context', but the specificity of 'screenshot' provides inherent distinction. This is not a tautology of the name and is appropriately specific.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides no guidance on when to use this tool versus alternatives like 'get-full-dom' (which might provide DOM structure) or 'get-context' (which might provide textual context). It implies usage when a visual capture is needed, but lacks explicit context, prerequisites, or exclusions, leaving the agent to infer based on tool names alone.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
init-browserC
Initialize a browser with a URL
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | The URL to navigate to |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries the full burden of behavioral disclosure. It states the action ('Initialize a browser') but doesn't explain what this entails—whether it launches a new browser instance, reuses an existing one, requires specific permissions, has side effects like opening windows, or what happens on failure. This leaves significant gaps in understanding the tool's behavior.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence with zero wasted words. It's front-loaded with the core action and resource, making it easy to parse quickly. Every word earns its place by conveying essential information without redundancy.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the complexity of initializing a browser (which could involve launching processes, handling errors, or managing sessions) and the lack of annotations and output schema, the description is incomplete. It doesn't address what the tool returns, potential errors, or behavioral nuances, leaving the agent with insufficient context for reliable use.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The schema description coverage is 100%, with the 'url' parameter fully documented in the schema as 'The URL to navigate to'. The description adds no additional meaning beyond this, such as URL format examples or constraints. Since the schema does the heavy lifting, the baseline score of 3 is appropriate.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the action ('Initialize a browser') and the target resource ('with a URL'), making the purpose immediately understandable. However, it doesn't differentiate from sibling tools like 'get-screenshot' or 'get-full-dom' which might also involve browser operations, so it doesn't fully distinguish itself from alternatives.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides no guidance on when to use this tool versus alternatives like 'get-screenshot' or 'get-full-dom'. It doesn't mention prerequisites (e.g., needing a browser session first) or exclusions, leaving the agent to infer usage context from the tool name alone.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
Tool Schema Changelog
Recent tool additions, removals, and schema changes observed during successful MCP inspections. Dates show when Glama detected each change.
3 tool updates
v1.0.0- Changed
get-context1 field changed- removed
Input schema / additionalPropertiesRemoved value: -false
- Changed
get-full-dom1 field changed- removed
Input schema / additionalPropertiesRemoved value: -false
- Changed
get-screenshot1 field changed- removed
Input schema / additionalPropertiesRemoved value: -false
5 tool updates
- First observed
execute-code - First observed
get-context - First observed
get-full-dom - First observed
get-screenshot - First observed
init-browser
TDQS
Most tools have distinct purposes, but get-context and get-full-dom overlap significantly, with the latter deprecated in favor of the former. This creates ambiguity about which to use for DOM-related tasks, though the deprecation note helps clarify.
The tools follow a consistent verb_noun pattern with hyphens, such as execute-code and get-screenshot. The only minor deviation is init-browser, which uses 'init' instead of a more standard verb like 'initialize', but overall the naming is predictable and readable.
With 5 tools, the count is reasonable for a Playwright automation server, covering core operations like initialization, execution, and inspection. It might benefit from additional tools for actions like navigation or element interaction, but it's well-scoped for basic functionality.
The tools cover initialization, code execution, and page inspection, but there are notable gaps for common Playwright workflows, such as navigation (e.g., go-to-url), element interaction (e.g., click, fill), or test assertion. This limits the server's ability to handle full automation tasks without workarounds.
Maintenance
Resources
Unclaimed servers have limited discoverability.
Looking for Admin?
If you are the server author, to access and configure the admin panel.
Related MCP Connectors
Live browser debugging for AI assistants — DOM, console, network via MCP.
MCP server for Mint — AI-powered QA that runs your app in a real browser on every PR.
Browser-based QA for AI-built software. Test pages with real browsers via agents.
MCP server for building and testing AI agents with multi-model experimentation and insights.
Related MCP Servers
- AlicenseNot gradedqualityDmaintenanceAn MCP server that enables AI-powered browser automation, web scraping, and testing using Playwright across Chromium, Firefox, and WebKit. It allows users to perform actions like navigation, clicking, typing, and taking screenshots through natural language interfaces.15MIT
- AlicenseNot gradedqualityDmaintenanceAn MCP server that provides AI coding assistants with comprehensive browser automation and debugging capabilities using Playwright, including visual inspection, DOM debugging, and execution monitoring.5,218MIT
- AlicenseNot gradedqualityAmaintenancePlaywright-powered browser automation and debugging for VS Code and Cursor via the Model Context Protocol (MCP).52MIT
- AlicenseCqualityAmaintenanceAn MCP server that enables AI agents to autonomously test, debug, and analyze web interfaces visually using Playwright, with 30 tools for screenshots, workflows, performance, and visual comparison.304081ISC
Latest Blog Posts
- Who's Calling? MCP Hosts Are an Identity Blind Spot (And the Spec Knows It)By Om-Shree-0709 on .mcpAgent IdentityOAuth 2.1
- Your AI Chatbot Just Exposed Your CEO's Salary to an InternBy Om-Shree-0709 on .Agent IdentityMCP SecurityOAuth Delegation
- Why MCP Servers Need Execution Sandboxing (And Why Your Current Stack Isn't Enough)By Om-Shree-0709 on .Agentic AiPrompt InjectionWebAssembly
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/qabyai/playwright-mcp'
If you have feedback or need assistance with the MCP directory API, please join our Discord server