Cómo agregar pruebas de extremo a extremo a un proyecto
Tags: javascript, spanish
Published: 2022-02-02 05:23:11

Felicidades. La configuración de extremo a extremo (E2E) es un tema bastante avanzado y puede aportar mucho valor a su proyecto. Tiene la posibilidad de detectar posibles problemas antes de fusionar los cambios en la rama principal—mucho antes de acercarse a la implementación en producción. Cuanto antes encuentre el error, más fácil será solucionarlo. E2E le permite realizar pruebas exhaustivas tan pronto como los cambios estén disponibles.

## ¿Qué son las pruebas de extremo a extremo?

Las pruebas E2E son scripts que interactúan con una aplicación de manera similar a como lo haría un usuario. Abren un navegador, cargan una URL, hacen clic en los elementos de la interfaz de usuario (IU), como los botones, y esperan algunos resultados. Las máquinas los ejecutan, y son mucho más rápidos y confiables que los humanos. Nunca se aburren.

El único inconveniente —necesitan instrucciones precisas y, a veces, pueden ser más complicados de programar que la función que intentan probar. Escribir las pruebas es programación, y está acoplado con la aplicación que se prueba, pero es una tarea que a muchos programadores no les entusiasma especialmente. Si te vuelves bueno en eso, podría convertirse en tu habilidad única que te ayude a brillar en el trabajo.

## ¡Elige tu herramienta!

Hay muchas opciones disponibles para construir una suite E2E:
* Cypress
* Playwright
* ~~Protractor~~
* Selenium
* TestCafe

Aquí, es lo mismo que con otras decisiones tecnológicas: es bueno investigar bien tus opciones. Cada prueba que escribe está estrechamente relacionada con la plataforma que elija. Es posible migrar de una herramienta de prueba a otra, pero eso sería un proyecto tan grande como reemplazar el marco frontal.

Mi experiencia es principalmente con Protractor, una solución obsoleta centrada en Angular. Actualmente estoy migrando pruebas a Cypress y estoy impresionado con el progreso en las herramientas de prueba en esos años. ¿Qué herramienta E2E le gustaría utilizar en su próximo proyecto? [Házmelo saber en la encuesta](https://strawpoll.com/zc6v2fkff).

## Pruebas simples en la máquina local
Con sus primeras pruebas, manténgalas triviales. Use cualquier URL de prueba local que tenga y simplemente acceda a ella con sus scripts. Ni siquiera necesita verificar ningún flujo de trabajo de la aplicación. Simplemente escriba algunas pruebas, cada una para diferentes rutas, y verifique que los elementos de la interfaz de usuario aparezcan en la página. Por ejemplo, puedes comprobar:
* en `/login`, si hay campos de entrada para nombre de usuario y contraseña
* en `/product/12`, si se muestra el nombre del producto
* etc

Incluso con pruebas tan fáciles, puedes probar:
1. que la aplicación se está iniciando y todas las rutas se muestran con elementos clave de la interfaz de usuario
2. que puedes desarrollar pruebas E2E

Y con eso, el E2E está despegando —el equipo tiene algunas pruebas y un miembro (usted) está dispuesto y es capaz de escribir más pruebas.



![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2eim5q6xrn3saw9bu5ef.jpg)

## Pon a tu equipo a bordo

Probablemente no necesitará ser insistente al principio. Solo asegúrese de que todos sepan que hay pruebas E2E disponibles y genere la expectativa de que cada desarrollador debe ejecutarlas antes de fusionar cosas con la rama principal. En esta etapa, notará todas las diferencias entre las configuraciones locales de sus colegas—diferentes dominios o puertos que la gente usa localmente. Puede solucionarlo haciendo que todos usen la misma URL o haciendo que la URL de prueba sea fácilmente configurable, no codificada. Ambos enfoques están BIEN. Simplemente hice que todos usaran la misma URL localhost; en mi caso, casi no hubo rechazo por parte del equipo.

El siguiente paso es probar el camino feliz de un flujo de trabajo—lo que debe hacer la aplicación cuando todo funciona como se esperaba. Escribe pruebas que verifican si el botón "agregar al carrito" realmente agrega productos al carrito, y ese "pago" va a la página del proveedor de pago. Esas pruebas son más complicadas de escribir, pero prueban partes críticas de la aplicación. Deberían ayudar a convencer a sus colegas sobre la utilidad de E2E. Y sus pruebas se están volviendo un poco más sofisticadas.

## ¿Qué sigue?
Si tiene alguna pregunta o duda sobre E2E, ¡no dude en publicarla en los comentarios! Lo leeré y haré lo mejor que pueda para responder. Puede continuar leyendo sobre [administrar código heredado frágil](https://conoce.dev/como-administrar-el-codigo-heredado-fragil) en mi blog.