🎭 Un primer vistazo a Playwright
🎭 Un primer vistazo a Playwright
E2E Testing con Playwright y TypeScript
Instalación y configuración de nuestro espacio de trabajo
Instalación y configuración de nuestro espacio de trabajo
Encontrar elementos en una página web: Locators
Encontrar elementos en una página web: Locators
Interactuar con Elementos web.
Interactuar con Elementos web.
Validando el estado de nuestro sistema
Validando el estado de nuestro sistema
Ejecución y su control
Ejecución y su control
Playwright avanzado y mejores prácticas
Playwright avanzado y mejores prácticas
Ya entendemos qué es E2E testing y por qué importa. Ahora toca conocer la herramienta con la que vamos a trabajar en todo el curso. No vamos a instalar nada todavía —eso lo hacemos en el siguiente módulo— pero sí vamos a entender qué es Playwright, de dónde viene y qué lo hace diferente a lo que probablemente ya conocés.
¿Qué es Playwright?
Playwright es una herramienta de automatización de browsers desarrollada y mantenida por Microsoft. Permite controlar navegadores como Chromium, Firefox y WebKit de forma programática, es decir: podés escribir código que abre un browser, navega a una URL, hace clic en botones, completa formularios y valida que el resultado sea el esperado.
Todo eso que haría un usuario real, lo hace tu test. Automáticamente. Cada vez que querés.
Playwright fue lanzado en 2020 y en muy poco tiempo se convirtió en una de las herramientas más populares para E2E testing. No es casualidad: llegó a resolver problemas concretos que otras herramientas arrastraban desde hacía años.
Un poco de contexto: ¿de dónde viene?
Para entender por qué Playwright existe, ayuda saber quiénes lo crearon. El equipo detrás de Playwright es en gran parte el mismo que creó Puppeteer, la herramienta de automatización de Google basada en Chrome.
Cuando ese equipo se mudó a Microsoft, no empezaron desde cero: tomaron lo que habían aprendido con Puppeteer y construyeron algo más ambicioso: una herramienta multi-browser, con una API más expresiva y con soluciones nativas para los problemas más comunes del E2E testing.
El resultado es Playwright: más rápido, más robusto y con soporte para los tres motores de browser principales desde el día uno.
¿Qué lo diferencia de otras herramientas?
Si ya trabajaste con Selenium o Cypress, esta pregunta probablemente ya se te cruzó. La respuesta corta: Playwright no es solo "otro framework de testing". Tiene algunas características que cambian bastante la experiencia de escribir y mantener tests.
Soporte multi-browser real
Playwright corre tests en Chromium (la base de Chrome y Edge), Firefox y WebKit (el motor detrás de Safari). Y no de cualquier manera: los tres están soportados de forma oficial, con el mismo nivel de mantenimiento y con la misma API.
Eso significa que podés escribir un test una sola vez y ejecutarlo en los tres browsers sin cambiar nada. Para equipos que necesitan cobertura cross-browser, esto es enorme.
Auto-waiting incorporado
Este es uno de los grandes dolores del E2E testing tradicional: los elementos no siempre están listos cuando el test los necesita. Con Selenium, la respuesta era agregar esperas explícitas, Thread.sleep() o complejos WebDriverWait. Con Playwright, eso casi nunca hace falta.
Cuando le pedís a Playwright que haga clic en un botón, primero verifica que el botón exista, que esté visible, que esté habilitado y que no haya otra cosa bloqueando la interacción. Todo eso pasa automáticamente, antes de ejecutar la acción. Si el elemento no está listo todavía, Playwright espera. Si nunca llega a estarlo, el test falla con un error claro.
Aislamiento por defecto
Cada test corre en un contexto de browser completamente aislado. Cookies, almacenamiento local, sesiones: todo empieza desde cero en cada test. Esto elimina una de las fuentes más comunes de flakiness: el estado compartido entre pruebas.
Herramientas incluidas
Playwright no es solo el runner de tests. Viene con un conjunto de herramientas integradas que hacen la vida mucho más fácil:
Playwright Inspector: para debuggear tests paso a paso
Codegen: para grabar interacciones y generar código automáticamente
Trace Viewer: para revisar exactamente qué pasó en un test fallido, con capturas de pantalla y logs de red
UI Mode: una interfaz visual para correr y debuggear tests interactivamente
Vamos a usar todas estas herramientas a lo largo del curso.
TypeScript como ciudadano de primera clase
Playwright fue diseñado con TypeScript en mente. No es un agregado tardío ni una integración opcional: los tipos están incorporados, el autocompletado funciona sin configuración extra y los errores de tipo te ayudan a escribir tests más correctos desde el inicio.
Por eso en este curso trabajamos con TypeScript. No porque sea obligatorio —Playwright también soporta JavaScript, Python, Java y C#— sino porque es la combinación que mejor experiencia de desarrollo ofrece.
¿Para qué sirve Playwright además de E2E testing?
Aunque en este curso nos enfocamos en testing, vale la pena saber que Playwright también se usa para:
Web scraping: extraer datos de páginas web de forma automatizada
Generación de PDFs y capturas de pantalla: útil para reportes o previews automáticos
Testing de APIs: Playwright puede hacer requests HTTP directamente, lo que lo convierte en una herramienta válida también para el nivel de integración
Esa versatilidad es parte de por qué creció tan rápido en popularidad.
¿Cómo se compara con Cypress?
Cypress es probablemente la otra herramienta que más escuchás en el mundo del E2E testing moderno. Las dos son buenas opciones, pero tienen filosofías distintas:
Cypress está muy orientado al developer experience dentro del browser: su runner visual es excelente y el feedback inmediato es uno de sus puntos fuertes. Sin embargo, durante mucho tiempo estuvo limitado a Chromium y tiene restricciones en ciertos escenarios como múltiples tabs o iframes complejos.
Playwright es más flexible: multi-browser de verdad, sin restricciones de dominio, con soporte nativo para escenarios complejos y con un modelo de ejecución que escala mejor en CI/CD.
Ninguna es "la ganadora" en todos los contextos. Pero para un curso que busca prepararte para el mundo real del E2E testing moderno, Playwright es hoy la opción que tiene más momentum, mejor soporte y mayor adopción en la industria.
Lo que viene
En el próximo módulo instalamos Node.js, NPM y Playwright, configuramos el entorno de trabajo y escribimos nuestro primer test. A partir de ahí, todo lo que vimos en estas clases de introducción deja de ser teoría y empieza a ser código.