Le pedís a Claude que revise tu web y te tira el código pero no toca nada: no abre la página, no hace clic, no prueba si el botón de comprar anda. Es como un mecánico que te describe el motor por teléfono sin meter la mano. Playwright MCP le da esas manos.
01 Qué resuelve
Por defecto, Claude escribe código pero no "ve" tu navegador. No puede abrir una página, llenar un formulario ni confirmar que tu web funciona de verdad. Lo conectás a un navegador real y Claude lo maneja por vos, paso a paso, contándote qué encontró.
- GratisMicrosoft
- Open-sourceCódigo abierto
- 1 comandoPara instalar
🧪 La analogía
Hasta ahora Claude era un copiloto sin manos: te dictaba la ruta pero manejabas vos. Playwright MCP le pone ojos y manos: ahora agarra el volante, abre el navegador, hace clic, completa formularios y prueba tu web él mismo mientras vos mirás.
02 Las siglas, sin vueltas
📟 En criollo
MCP = el "enchufe estándar" con el que Claude se conecta a herramientas externas. Pensalo como un puerto USB: una vez que existe el enchufe, le podés conectar cosas nuevas (en este caso, un navegador) sin reinventar nada.
📟 En criollo
Node.js = el motor que hace andar muchas herramientas modernas en tu compu. Es como tener instalado el "Java" o el "reproductor" que un programa necesita para arrancar. Acá hace falta la versión 18 o más nueva.
📟 En criollo
Playwright = la tecnología (también de Microsoft) que maneja navegadores de forma automática. Es la misma que usan los equipos de testing serios para probar webs. No saca fotos de la pantalla: lee la estructura de la página, así que es rápido y preciso.
03 Lo que necesitás antes
- Tener Claude Code instalado.
- Tener Node.js 18 o más nuevo (el motor que hace andar la herramienta).
04 Cómo se hace
✅ Cómo se hace
- Abrí tu terminal con Claude Code ya instalado.
- Pegá y corré este comando.
- Esperá: la primera vez tarda un toque mientras descarga lo que necesita.
claude mcp add playwright npx @playwright/mcp@latestEse comando le suma una capacidad nueva a Claude. Desarmado: claude mcp add agrega una herramienta; playwright es el nombre con el que la vas a llamar; el resto le dice de dónde bajarla.
05 Cómo lo usás
Listo. Ahora le hablás en castellano y él maneja el navegador:
"abrí mi web y revisá que el botón de comprar funcione"
O también "entrá a esta página y traeme los precios". Claude abre el navegador, hace lo que le pediste y te cuenta qué encontró.
06 Las dudas de siempre
- ¿Cuesta algo? No, es gratis.
- ¿Sirve fuera de Claude Code? Sí, también anda con Cursor, Claude Desktop y otros. Acá lo explicamos para Claude Code.
⚠️ Ojo con esto
Es open-source y de Microsoft, así que el código está a la vista. Pero le estás dando manos para tocar un navegador real: como con cualquier automatización, mirá lo que hace antes de darle tareas sensibles (logins, pagos, datos de clientes). No lo dejes solo en la caja fuerte el primer día.
⚡ Tip del Tincho
Antes de pedirle algo complejo, arrancá con una tarea boba tipo "abrí google.com y decime el título de la página". Si eso anda, el enchufe quedó bien puesto y podés escalar tranquilo.
07 Para qué te va a servir
Dejás de ser el intermediario que copia, pega y prueba a mano. Claude verifica que tu web funcione, revisa formularios, te trae datos de páginas y te avisa si algo se rompió, todo sin que muevas un dedo. Menos clics tuyos, más cosas hechas.