Una de los desafíos al desarrollar aplicaciones web es la calidad de lo desarrollado y que no tenga bugs. Para tener mayor calidad en nuestras aplicaciones recurrimos a los test y en este artículo vamos a ver como realizar test E2E automatizados con Cypress.
Además de testear la aplicación de forma manual es conveniente automatizarlo. Esto no significa dejar de lado los test manuales, sino que estos nos brindan mayor seguridad a la hora de hacer un cambio en el código y verificar que este no cambie comportamiento de otra parte de la aplicación.
La automatización de test comienza siempre con una primera fase manual para después ser automatizada. De esta manera encontraremos errores en las primeras fases de desarrollo y se necesitarían menos recursos humanos para las pruebas, reduciendo así los costes y las horas de trabajo.
En este caso nos centraremos en la automatización de test E2E con CYPRESS.
Pero...qué son los test E2E?
Los test E2E simulan el comportamiento de un usuario real. Prueban toda la aplicación de principio a fin, cubriendo así secciones que las pruebas unitarias y las pruebas de integración no cubren.
Y...cómo uso CYPRESS para eso?
Es una herramienta open source para testear el frontend. Este framework “todo en uno” incluye librerías de aserciones, mocks y pruebas end-to-end automáticas sin utilizar Selenium.
Al contrario de Selenium, Cypress cuenta con una arquitectura construida desde cero, que ejecuta los comandos en el mismo ciclo de ejecución.
No necesitamos instalar varias herramientas ni librerías separadas para poder ejecutar tests, ya que ejecutando
únicamente una línea de comando tendríamos Cypress instalado. Al instalar Cypress ya se empieza a usar!
Entre las funcionalidades destacadas se encuentran las siguientes:
- Debug: Permite seguir paso a paso los test para ver dónde están fallando.
- Espera automática: No es necesario indicar que espere para verificar o proseguir, este lo hace automáticamente. Es indiferente si es asícrónico o no.
- Screenshots y videos: Permite sacar fotos ante fallos o grabar videos durante las pruebas.
Es muy sencillo de instalar:
Cypress se puede instalar de dos maneras, usando npm o descargándolo de la web.
Navega al path de tu proyecto e instala Cypress usando npm:
npm install cypress --save-dev Una vez instalado, se corre con el comando “cypress run” desde línea de comando dentro del proyecto.
Dejo el link al sitio oficial para más información.
Conclusion
Usar Selenium implica una gran cantidad de trabajo preparatorio, lo cual consume bastante tiempo. Cypress es una única estructura que instalas y empiezas a trabajar.
Se puede decir que Selenium es una herramienta más flexible a la hora de trabajar, pero requiere mucha preparación y tiempo, al contrario que Cypress, que está listo para ser utilizado inmediatamente después de su instalación, dándole cierta ventaja en algunas situaciones.