playwright-mcp
¿Cómo utilizar playwright-mcp?
Introducción
playwright-mcp (Protocolo de Contexto de Modelo) es una potente herramienta que conecta los asistentes de IA con la automatización de navegadores. Permite que los modelos de IA interactúen con navegadores web, inspeccionen elementos DOM, registren las interacciones del usuario y generen scripts de prueba de Playwright con mayor precisión. Esta guía le guiará en la configuración y el uso eficaz de playwright-mcp.
Related MCP server: browser-devtools-mcp
Herramientas
Herramientas disponibles en la interfaz del navegador:
Caja de herramientas del navegador
Seleccionar DOM (🎯): Haz clic para seleccionar y capturar elementos HTML de la página. Úsalo para registrar selectores para tus casos de prueba.
Seleccionar imagen (📸): Captura capturas de pantalla de elementos específicos. Útil para pruebas visuales o documentación.
Registrar interacciones (📋): Registra las interacciones del navegador, como clics, entradas y navegaciones. Estas interacciones generan selectores automáticamente y pueden pasarse como contexto a clientes MCP como Claude o Cursor para facilitar la creación de casos de prueba.
Comandos MCP
init-browser: Inicializa el navegador del dramaturgo.get-context: obtiene el contexto del sitio web, que se utilizará para escribir el caso de pruebaexecute-code: ejecuta código JS de Playwright personalizado en la página actualget-screenshot: Obtener una captura de pantalla de la página actualget-full-dom: Obtiene el DOM completo de la página actual. (Se recomienda usarget-context)
Más información
¿Quieres profundizar más? Consulta la documentación completa:
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