Playwright MCP devuelve a tu agente una instantánea de accesibilidad completa después de cada acción, y ahí es donde se van los tokens. Mira los flags que reducen el consumo, una configuración ligera para pegar, la alternativa CLI y un veredicto honesto sobre si es seguro.
Playwright MCP da a un agente de IA unas manos reales en el navegador, y te cobra cada vez que mira la página. Se ha informado de que una tarea típica consume unos 114.000 tokens a través del servidor MCP, antes de que el agente termine de hacer clic. El mismo servidor también puede funcionar dentro de un navegador que tiene tus sesiones iniciadas. Por eso las dos preguntas que buscas son legítimas: ¿cómo mantienes bajo control el uso de tokens de Playwright MCP y es seguro ejecutarlo? A continuación encontrarás los flags exactos, una configuración para pegar, una comparación con la CLI de Playwright y un veredicto claro sobre los riesgos.
💡 Respuesta corta: Desactiva las capturas de pantalla, deja desactivadas las capacidades opcionales, usa un perfil aislado y nunca dirijas al agente hacia cuentas que no puedas permitirte perder. Para sesiones largas de programación, la CLI de Playwright es la opción más barata.
El servidor MCP de Playwright de Microsoft no depende de capturas de pantalla por defecto. Devuelve una instantánea de accesibilidad: un árbol de texto con cada título, enlace, botón y campo de entrada de la página, cada uno con un ID de referencia que el modelo usa para hacer clic o escribir. Es una forma más inteligente de manejar un navegador que adivinar píxeles, porque el modelo sabe que algo es un botón sin necesidad de una pasada de visión. Pero en cualquier página con mucha actividad es un bloque de texto largo, y lo pagas cada vez que llega.
Cada herramienta de acción, como browser_click o browser_type, devuelve el nuevo estado de la página. La instantánea entra de nuevo en tu ventana de contexto una y otra vez. Una tarea de diez pasos en un sitio con mucho contenido apila diez árboles en la ventana, y ninguno sale hasta que limpias la sesión.
La comparativa del propio equipo de Playwright, tal como la recogen varios artículos, situó una tarea típica en unos 114.000 tokens con MCP frente a unos 27.000 tokens con la CLI, una diferencia de aproximadamente 4 veces. Tómalas como cifras orientativas, porque el peso de la página lo cambia todo.
Un informe de error público sobre el MCP relacionado de Chrome DevTools muestra el mismo problema: el contexto pasó de unos 31.000 a 242.000 tokens después de un solo clic en una página pesada. Otro servidor, el mismo culpable. El árbol de la página es lo que encarece la tarea, no el clic.
Cada servidor MCP incluye esquemas de herramientas, y tu host los carga en el contexto al iniciar la sesión. Un usuario midió 28,1 k tokens, el 14,1 por ciento de la ventana, solo en las definiciones de herramientas de varios servidores en Claude Code. Playwright MCP tiene una lista de herramientas larga, y cada capacidad opcional añade más. Los hosts también ponen límites: Cursor te restringe a 40 herramientas entre todos los servidores.
💡 Consejo: Si no vas a navegar en esta sesión, desactiva el servidor de Playwright. Un servidor inactivo sigue consumiendo tokens de esquema.
Este es el bloque estándar para cualquier host que lea una sección mcpServers:
{
"mcpServers": {
"playwright": {
"command": "npx",
"args": ["@playwright/mcp@latest"]
}
}
}
Funciona, pero los valores por defecto priorizan la comodidad: un navegador visible, un perfil persistente, capturas de pantalla permitidas, instantáneas activadas y todos los orígenes accesibles. Casi todo eso se puede ajustar con una línea por cada opción.
claude mcp add playwright -- npx @playwright/mcp@latest --headless --isolated
Todo lo que va después de los dos guiones es el comando del servidor. Ejecuta /mcp dentro de Claude Code para confirmar que se ha conectado. Si no arranca, comprueba que Node.js está instalado y que npx está en tu PATH.
{
"mcpServers": {
"playwright": {
"command": "npx",
"args": [
"@playwright/mcp@latest",
"--headless",
"--isolated",
"--image-responses=omit",
"--allowed-origins=https://example.com;https://staging.example.com"
]
}
}
}
Esto es lo que hace cada flag:
--headless ejecuta el navegador sin ventana. Por defecto es visible.--isolated mantiene el perfil en memoria, de modo que las cookies desaparecen al terminar la sesión.--image-responses=omit elimina las capturas de pantalla de las respuestas de las herramientas.--allowed-origins acepta orígenes separados por punto y coma. Sustitúyelos por tus propios dominios.
No todos los flags ahorran tokens, y algunos cambian tokens por seguridad. Esta tabla muestra ambos efectos juntos.
| Flag | Qué hace | Efecto en tokens | Efecto en seguridad |
|---|---|---|---|
--image-responses omit | Elimina las capturas de pantalla de las respuestas de las herramientas | Quita las cargas de imagen | Sale menos información de la página del navegador |
--snapshot-mode none | Desactiva la instantánea automática de la página (valores del README: full, none) | El mayor recorte, pero el agente trabaja medio a ciegas | Neutro |
--caps | Activa conjuntos de herramientas opcionales: vision, pdf, devtools, config, network, storage, testing | Menos esquemas de herramientas si se dejan desactivados | Superficie de ataque más pequeña |
--storage-state | Carga cookies y localStorage en un contexto aislado | Evita pasos de inicio de sesión, así que hay menos acciones | Transporta datos de sesión reales, así que usa una cuenta de prueba |
--blocked-origins | Bloquea las solicitudes a los orígenes indicados | Páginas más ligeras y árboles más pequeños | Es comodidad, no un muro |
--image-responses acepta allow, omit o only, y el valor por defecto es allow. En tareas con mucho texto, como leer una tabla de precios o rellenar un formulario, omit es un ahorro sin costo. Eso sí, reduce la factura en lugar de solucionarla. La instantánea de accesibilidad sigue siendo el mayor costo.
--snapshot-mode none es el recurso más contundente. Úsalo solo cuando el agente maneje la página mediante scripts, porque un modelo que no puede ver la página adivinará.
El flag --caps activa conjuntos de herramientas opcionales: vision para acciones de ratón basadas en coordenadas, pdf, devtools, config, network, storage y testing. Mantenlos desactivados hasta que una tarea los necesite. El conjunto testing habilita las herramientas de verificación, así que actívalo solo en sesiones en las que estés escribiendo pruebas.
npx playwright test. La ejecución imprime unas pocas líneas en lugar de decenas de árboles.
El README del proyecto es claro sobre la contrapartida: «las invocaciones de la CLI son más eficientes en tokens: evitan cargar esquemas de herramientas grandes y árboles de accesibilidad detallados en el contexto del modelo». Reserva MCP para flujos de trabajo que necesitan «estado persistente, introspección rica y razonamiento iterativo».
| Medida | Playwright MCP | Playwright CLI |
|---|---|---|
| Tarea típica (según informes) | Unos 114.000 tokens | Unos 27.000 tokens |
| Gestión de la instantánea | Se devuelve en línea en cada respuesta | Se guarda en disco como archivo YAML |
| Por interacción (según practicantes) | Cargas de instantánea grandes | Entre 1.000 y 2.000 tokens aproximadamente tras ajustar |
| Esquemas de herramientas | Se cargan en el contexto al iniciar la sesión | Ninguno, se ejecuta como comandos de shell |
| Mejor uso | Estado persistente y razonamiento iterativo | Sesiones largas de programación y alto rendimiento |
Estas cifras proceden de artículos sobre el benchmark del equipo de Playwright y de practicantes, no de una prueba que yo haya hecho, así que mide tu propia tarea antes de rediseñar un flujo de trabajo en torno a ellas.
Una regla sencilla funciona bien: explora con MCP y luego congela el flujo en un script y ejecuta ese script desde la CLI.
La respuesta honesta tiene dos partes. Es lo bastante seguro para desarrollo local en sitios de confianza, con un perfil aislado. No es seguro como agente sin supervisión dentro del navegador en el que haces tus operaciones bancarias. El README lo dice sin rodeos: «Playwright MCP no es un límite de seguridad».
Todo lo que lee el agente se convierte en entrada del modelo. Una página puede ocultar texto en blanco sobre blanco, en un comentario HTML o en un atributo alt de imagen, indicándole al agente que ignore tus instrucciones y abra otra URL. El árbol de accesibilidad aplana todo ese contenido en texto plano, justo al lado de tu propio prompt. Los modelos resisten algunos de estos ataques y fallan con otros.
Lo que ayuda:
Por defecto, el navegador mantiene un perfil persistente en disco, y --user-data-dir indica dónde, para que las cookies sobrevivan entre sesiones. La opción --extension va más allá y se conecta a una instancia de Edge o Chrome que ya tengas abierta. Un agente secuestrado en ese modo actúa como tú, en cada sitio en el que tengas la sesión iniciada. Para cualquier cosa que toque un inicio de sesión, usa --isolated junto con una cuenta desechable.
--allowed-origins y --blocked-origins aceptan listas separadas por punto y coma, y el valor por defecto lo permite todo. Reducen el ruido y las solicitudes no deseadas, pero no son un límite de seguridad. Lo mismo ocurre con --secrets, que apunta a un archivo dotenv para que las cadenas sensibles se oculten en las respuestas: útil, pero no una garantía. Deja --allow-unrestricted-file-access desactivado, porque permite URL file:// y el acceso fuera de tu espacio de trabajo.
| Riesgo | Qué puede pasar | Solución |
|---|---|---|
| Inyección de prompts | El texto de la página dirige al agente | Sitios de confianza y aprobaciones de herramientas |
| Perfil persistente | Las cookies quedan en disco y se reutilizan | --isolated |
| Modo extensión | El agente actúa dentro de tus sesiones reales | Evítalo en cuentas sensibles |
| Acceso a archivos | Los archivos locales quedan al alcance | Mantén desactivado el acceso sin restricciones |
| Puerto abierto | Cualquiera de la red llega al servidor | Vincula a localhost y deja --allowed-hosts en su valor por defecto |
--isolated para que nada persista.--storage-state.--secrets con un archivo dotenv para que los valores aparezcan ocultos.@latest, para que una nueva versión no cambie el comportamiento sin que te des cuenta.
Para un navegador desechable que nunca toque el perfil de tu equipo, el README propone este comando:
docker run -i --rm --init --pull=always mcr.microsoft.com/playwright/mcp
Para un servicio HTTP de larga duración, el ejemplo del README publica el puerto 8931 y vincula --host 0.0.0.0 dentro del contenedor. Publícalo solo en loopback, para que otras máquinas de tu red no puedan acceder a él:
docker run -d -i --rm --init --pull=always \
--entrypoint node --name playwright -p 127.0.0.1:8931:8931 \
mcr.microsoft.com/playwright/mcp \
/app/cli.js --headless --browser chromium --no-sandbox --port 8931 --host 0.0.0.0
El flag --no-sandbox desactiva el sandbox propio de Chromium, así que el contenedor pasa a ser tu límite. No montes carpetas sensibles de tu equipo dentro de él.
💡 Veredicto: Trata a Playwright MCP como a un contratista en tu casa, no como a un miembro de la familia. Dale una sola habitación (un perfil aislado), una tarea corta y alguien que lo vigile.
Un modelo de lenguaje sirve como un segundo par de ojos económico para revisar una configuración de MCP. Claude Sonnet 5 en PicassoIA aparece en la lista para tareas de programación, lo que encaja bien con la revisión de una configuración.
Si la página del modelo ofrece un ajuste de temperatura, mantenlo bajo para revisar configuraciones, ya que quieres respuestas constantes y no creativas.
Otros modelos que vale la pena probar para el mismo trabajo:
💡 Advertencia: Nunca pegues archivos
.env, tokens de API ni cookies en ningún cuadro de chat. Sustitúyelos antes por marcadores de posición.
Además, MCP no es solo para navegadores. PicassoIA ofrece su propio conector para Claude que expone generación de imágenes, edición de imágenes y generación de video mediante un puñado de herramientas, lo que mantiene pequeña la carga de esquemas en comparación con un servidor que expone una lista larga de herramientas de navegador.
Los agentes de navegador leen la web, pero tus artículos, productos y publicaciones siguen necesitando imágenes que frenen el scroll. Picasso IA pone modelos de imagen fotorrealistas a un clic de distancia, para que pases de una idea a un visual terminado en minutos.
Empieza con PicassoIA Image para un primer borrador rápido, y luego usa el mismo prompt en Seedream 5 Pro y compara los resultados lado a lado.
Una fórmula de prompt que funciona: sujeto + escenario + luz + lente. Por ejemplo:
Un desarrollador revisando la pantalla de un equipo portátil en un escritorio junto a una ventana soleada, luz de la mañana desde la izquierda, lente de 85 mm, profundidad de campo poco profunda, grano de película natural.
Cambia un detalle cada vez, como la luz o la lente, y observa cómo cambia el resultado. Diez minutos de pequeños experimentos afinarán tus prompts más que cualquier lista de verificación. Abre Picasso IA, pega el prompt de arriba y crea tu primera imagen hoy mismo.
Elige tu idioma
