≡En resumen
- Playwright controla navegadores reales desde código para probar y automatizar webs.
- Un mismo test se ejecuta en Chromium, Firefox y WebKit, con espera automática a que los elementos estén listos.
- Su generador de código graba lo que haces en el navegador y lo convierte en un test.
- Playwright MCP permite que Claude navegue usando el árbol de accesibilidad de la página en lugar de capturas.
- Desde la versión 1.56 incluye agentes que planifican, escriben y reparan tests con ayuda de un LLM.
01 ¿Qué es Playwright?
Playwright es una librería y un ejecutor de tests creados por Microsoft para controlar navegadores desde código. Abre una página, hace clic, escribe en formularios, espera a que cargue un elemento y comprueba que lo que ves es lo que debería verse, igual que haría una persona, pero en segundos y sin cansarse.
Se publicó en 2020, es de código abierto con licencia Apache 2.0 y hoy es uno de los frameworks de testing web más usados. Funciona con JavaScript y TypeScript, pero también tiene versiones oficiales para Python, Java y .NET.
02 Para qué sirve Playwright
Tests end-to-end
Prueba flujos completos (registro, compra, login) tal como los vive el usuario, en varios navegadores y tamaños de pantalla.
Regresión visual
Compara capturas de pantalla entre versiones para detectar cambios de diseño no deseados.
Capturas y PDF
Genera imágenes o PDF de cualquier página, útil para informes, facturas o miniaturas.
Automatización de tareas
Rellena formularios repetitivos o descarga informes de paneles que no tienen API.
Extracción de datos
Lee contenido de webs que se generan con JavaScript, donde una petición HTTP simple no basta.
Navegación para agentes de IA
Da a Claude y a otros agentes la capacidad de usar un navegador como herramienta.
03 Cómo empezar con Playwright paso a paso
-
1
Instálalo en tu proyecto
En un proyecto de Node.js ejecuta npm init playwright@latest. El asistente crea la configuración, una carpeta de tests y descarga los navegadores.
-
2
Graba tu primer test
Con npx playwright codegen y la URL de tu web se abre un navegador: lo que hagas se convierte en código de test.
-
3
Añade comprobaciones
Usa aserciones como expect(page).toHaveTitle() o toBeVisible() para indicar qué debe cumplirse.
-
4
Ejecuta la batería
npx playwright test lanza todos los tests en paralelo y en los navegadores configurados.
-
5
Revisa los fallos
El informe HTML y el visor de trazas muestran cada paso, capturas, red y consola del momento en que algo falló.
-
6
Llévalo a la integración continua
Ejecuta los tests en cada pull request, por ejemplo con GitHub Actions, para que nada se rompa sin que lo sepas.
test('el formulario de contacto se envía', async ({ page }) => { await page.goto('https://tu-web.test/contacto/'); await page.getByLabel('Email').fill('[email protected]'); await page.getByRole('button', { name: 'Enviar' }).click(); await expect(page.getByText('Gracias')).toBeVisible();});
Fíjate en que localiza los elementos por su etiqueta y su rol, no por clases CSS: así el test no se rompe cuando cambias el diseño.
04 Playwright MCP: el navegador de Claude
Microsoft publica un servidor MCP oficial de Playwright. Una vez conectado, Claude Code o Claude Desktop pueden abrir páginas, hacer clic, escribir, leer el contenido y tomar capturas usando herramientas del navegador.
Su diferencia clave es que trabaja con el árbol de accesibilidad de la página: el modelo recibe una lista estructurada de botones, enlaces y campos con referencias, en lugar de adivinar dónde hacer clic sobre una imagen. Es más rápido, más barato en tokens y más fiable que navegar por capturas de pantalla.
| Aspecto | Árbol de accesibilidad (Playwright MCP) | Capturas de pantalla |
|---|---|---|
| Qué recibe el modelo | Texto estructurado con roles y referencias | Una imagen que debe interpretar |
| Precisión al hacer clic | Alta: apunta a un elemento concreto | Depende de calcular coordenadas |
| Coste en contexto | Moderado, aunque crece en páginas enormes | Alto por cada imagen |
| Cuándo conviene | Formularios, flujos, pruebas funcionales | Revisar el aspecto visual |
05 Agentes de test de Playwright: planner, generator y healer
La versión 1.56 añadió tres definiciones de agente pensadas para que un LLM construya y mantenga tests. Con npx playwright init-agents --loop=claude se generan como subagentes de Claude Code en tu proyecto, junto con la configuración MCP que necesitan.
-
1
Planner
Explora la aplicación y escribe un plan de pruebas en Markdown con los escenarios que conviene cubrir.
-
2
Generator
Convierte ese plan en archivos de test de Playwright, comprobando los selectores contra la web real.
-
3
Healer
Ejecuta los tests que fallan, inspecciona la interfaz actual, corrige el test y lo vuelve a lanzar; si cree que el fallo es de la aplicación, lo marca para revisión.
06 Playwright frente a Selenium, Cypress y Puppeteer
| Herramienta | Navegadores | Lenguajes | Puntos fuertes |
|---|---|---|---|
| Playwright | Chromium, Firefox, WebKit | JS/TS, Python, Java, .NET | Espera automática, paralelismo, trazas, MCP oficial |
| Selenium | Todos los principales vía WebDriver | Muchos lenguajes | Estándar veterano, enorme ecosistema |
| Cypress | Chromium, Firefox y WebKit (experimental) | JavaScript/TypeScript | Experiencia de depuración muy cómoda en el navegador |
| Puppeteer | Chrome y Firefox | JavaScript/TypeScript | Ligero para automatizar Chrome |
Si empiezas un proyecto nuevo, Playwright suele ser la opción más equilibrada: un único ejecutor para los tres motores de navegador, espera automática que elimina buena parte de los tests inestables y herramientas de depuración incluidas sin coste. Selenium tiene sentido cuando tu empresa ya tiene una infraestructura grande montada sobre WebDriver o necesitas un lenguaje que Playwright no cubre. Cypress gusta mucho a equipos de front-end por su modo interactivo, y Puppeteer sigue siendo práctico para scripts rápidos que solo necesitan Chrome. Para trabajar con agentes de IA, el servidor MCP oficial inclina hoy la balanza hacia Playwright.
07 Buenas prácticas para usar Playwright en proyectos reales
- ✓Localiza elementos por rol, etiqueta o texto visible, no por clases CSS generadas.
- ✓Haz cada test independiente: que cree sus propios datos y no dependa del orden.
- ✓Ejecuta los tests contra un entorno de pruebas, nunca contra producción con datos reales.
- ✓Guarda trazas solo en los reintentos para no llenar el disco.
- ✓Cubre primero los flujos que generan ingresos: registro, compra, contacto.
- ✓Si usas Playwright MCP, limita qué dominios puede visitar el agente y no le des credenciales reales.
Integrar tests automáticos desde el principio es parte de cualquier desarrollo web a medida serio, y combinarlos con agentes es una forma práctica de automatizar procesos con IA sin perder control. Si buscas más servidores MCP y utilidades como esta, consulta el catálogo de herramientas para Claude.
Preguntas frecuentes sobre Playwright
Es un framework de código abierto de Microsoft para automatizar navegadores Chromium, Firefox y WebKit. Se usa sobre todo para tests end-to-end de aplicaciones web, pero también para capturas, PDF y automatización de tareas.
Sí. Es software libre con licencia Apache 2.0 y puedes usarlo en proyectos comerciales sin pagar licencia.
Tiene versiones oficiales para JavaScript y TypeScript, Python, Java y .NET. El ejecutor de tests más completo es el de Node.js.
Es el servidor MCP oficial de Microsoft que expone el navegador como herramienta para agentes de IA. Claude puede usarlo para navegar, hacer clic y leer páginas a partir del árbol de accesibilidad.
Para proyectos nuevos, Playwright suele ser más rápido de configurar y más estable gracias a la espera automática. Selenium sigue siendo útil si necesitas muchos lenguajes o una infraestructura que ya lo usa.
Sí. Se instala con pip install playwright y después playwright install para descargar los navegadores; también existe un plugin para pytest.
Técnicamente sí, porque ejecuta JavaScript y ve la página como un usuario. Pero antes de extraer datos debes revisar las condiciones del sitio, la normativa de protección de datos y limitar la frecuencia de las peticiones.
A través del servidor Playwright MCP, que le da herramientas para abrir páginas, hacer clic, escribir y leer el contenido. Además, Claude Code puede escribir y ejecutar tests de Playwright como cualquier otro código del proyecto.
Fuentes consultadas
Sobre el autor
Germán Gutiérrez
Development Manager en appyweb
Dirige el equipo de desarrollo de appyweb: aplicaciones web y móviles, SaaS, integraciones y arquitectura de software.
Ver perfil en LinkedIn ↗