playwright-mcp
如何使用 playwright-mcp?
介绍
playwright-mcp(模型上下文协议)是一款强大的工具,它弥合了 AI 助手和浏览器自动化之间的差距。它使 AI 模型能够与 Web 浏览器交互、检查 DOM 元素、记录用户交互,并生成更高精度的 Playwright 测试脚本。本指南将指导您如何有效地设置和使用 playwright-mcp。
Related MCP server: browser-devtools-mcp
工具
浏览器界面中可用的工具:
浏览器工具箱
选择 DOM (🎯):点击即可从页面中选择并捕获 HTML 元素。使用它来记录测试用例的选择器。
选择图像 (📸):截取特定元素的屏幕截图。适用于视觉测试或文档撰写。
记录交互 (📋):记录浏览器交互,例如点击、输入和导航。这些交互会自动生成选择器,并可以作为上下文传递给 Claude 或 Cursor 等 MCP 客户端,以帮助编写测试用例。
MCP 命令
init-browser:初始化剧作家浏览器。get-context:获取网站上下文,用于编写测试用例execute-code:针对当前页面执行自定义 Playwright JS 代码get-screenshot:获取当前页面的屏幕截图get-full-dom:获取当前页面的完整 DOM。(建议使用get-context代替)
了解更多
想深入了解?查看完整文档:
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.
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
Scored across 5 tools
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
Related MCP Connectors
Run, debug, and triage tests from your IDE using natural language, no dashboard switching, no manual data transfers. The TestMu AI (formerly LambdaTest) MCP Server is a single remote server exposing four tool suites: HyperExecute — analyze your project, generate YAML configs and test runner commands, then monitor jobs and sessions. Automation — pull a TestID's details plus command, network, and console logs into one chat for instant root-cause analysis. Includes mobile app upload. SmartUI — explain pixel, layout, DOM, and perceptual changes in a visual regression run, with context-aware React/HTML/CSS fixes. Accessibility — audit any public URL or a local React app against WCAG and get ready-to-apply remediation steps. Connects over https://mcp.lambdatest.com/mcp using OAuth 2.1 — no API keys in your config. One-click install in Cursor; works with Claude, GitHub Copilot, Cline, and any MCP client. Tests execute on the TestMu AI cloud: 3,000+ browsers and 10,000+ real devices.
Approved test intent, reviewed Playwright automation and run evidence, inside your editor.
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.
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.11 npmMIT
- 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,334 npmMIT
- AlicenseNot gradedqualityDmaintenancePlaywright-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.3042 npm83ISC