Home

Pruebas automatizadas con Cypress y Kraken

¡Bienvenidos a la Wiki de pruebas automatizadas E2E para la aplicación Ghost! En esta wiki encontrarás información detallada sobre las pruebas automatizadas realizadas en la aplicación Ghost, utilizando dos herramientas populares de pruebas E2E: Cypress y Kraken. En total, se llevaron a cabo 50 escenarios de prueba, 30 utilizando Cypress y 20 utilizando Kraken, para asegurar que la aplicación Ghost funcione de manera óptima y libre de errores. De los 20 escenarios realizados con Cypress inicialmente, 10 fueron modificados para la versión de Ghost 4.44.0 y posteriormente para realizar Visual Regression Testing entre versiones.

Pros y contras de cada herramienta E2E

Cypress

Pros

• No hay necesidad de instalar dependencias adicionales, las pruebas se pueden hacer directamente en un navegador web.
• Tracking de cada paso de las pruebas por medio de pantallazos
• Grande cantidad de métodos para buscar y seleccionar elementos HTML
• Fácil de usar e implementar
• Buena visibilidad de las pruebas, sus pasos y sus estados

Contras

• Difícil trabajar con herramientas que utilicen frecuentemente funciones asíncronas que necesiten de awaits
• Curva de aprendizaje mediana
• No hay soporte para Given, When, Then sin herramientas externas. (Solo se pueden realizar comentarios)

Kraken

Pros

• Fácil de trabajar usando el patrón Given, When, Then
• Facilidad de ejecución de pruebas en paralelo
• Tracking detallado de la ejecución de escenarios mediante reportes

Contras

• Documentación limitada
• Tiene problemas para correr más de un escenario secuencialmente
• Demasiadas dependencias necesitadas, incluso varias que no se utilizan si solo haces testing de aplicaciones web
• Curva de aprendizaje lenta
• Menos opciones para operar sobre HTML que cypress. No reconoce ciertos elementos que cypress sí.

Pros y contras de las herramientas de regresión visual

ResembleJS

Pros

• Identifica de manera rápida y precisa si ha habido cambios en la apariencia visual de la aplicación.
• Puede comparar imágenes de diferentes tamaños y formatos, lo que permite trabajar con diversas capturas de pantalla.
• Ofrece la posibilidad de establecer umbrales de diferencia, lo que ayuda a reducir los falsos positivos.
• Permite generar imágenes de diferencias para comprender visualmente los cambios en la aplicación.
• Es compatible con varias herramientas de automatización de pruebas, como Cypress y Puppeteer.

Contras

• Sensibilidad a cambios menores.
• Solo puede comparar dos imágenes a la vez, lo que puede ser una limitación si se desea comparar varias imágenes con un patrón común.
• La calidad de la imagen puede afectar la precisión de la comparación.
• Requiere ser integrada en el código de prueba automatizado.
• Falta de documentación.

BackstopJS

Pros

• Fácil de usar y configurar, lo que hace que la automatización de pruebas de regresión visual.
• Generación de informes de las pruebas realizadas.
• Compatibilidad con múltiples navegadores y dispositivos.
• Integración con herramientas de automatización como Cucumber.
• Enmascaramiento que permite a los usuarios excluir elementos específicos de la comparación de imágenes.
• Es escalable y puede utilizarse para pruebas de regresión visual en proyectos pequeños y grandes.

Contras

• Requiere cierta curva de aprendizaje al utilizarla por primera vez.
• Configuración inicial puede ser un poco complicada, especialmente si se tienen proyectos grandes o complejos.
• Crea una gran cantidad de archivos de imagen, lo que puede ocupar mucho espacio en el disco duro y aumentar el tiempo de ejecución de las pruebas.
• Posible necesidad de herramientas adicionales para poder ver las diferencias entre las imágenes.
• El proceso de comparación de imágenes puede ser lento en proyectos grandes con muchas páginas y/o elementos visuales complejos.