El manejo de operaciones asíncronas es una parte esencial de muchas aplicaciones web modernas. En este capítulo, exploraremos cómo escribir pruebas asíncronas utilizando DOM Testing Library para asegurarnos de que nuestras aplicaciones manejen correctamente las operaciones que no son instantáneas, como llamadas a API o retrasos intencionales.

Operaciones Asíncronas Comunes

Las operaciones asíncronas que usualmente necesitamos probar incluyen:

• Llamadas a APIs.
• Timers (setTimeout, setInterval).
• Actualizaciones del DOM después de operaciones asíncronas.

Crear un Componente que Realice una Operación Asíncrona

Vamos a crear un componente que simule una llamada a una API y muestre los datos una vez recibidos.

Archivo index.js:

javascript

Prueba de una Operación Asíncrona

Vamos a escribir una prueba para el componente que realiza una operación asíncrona.

Archivo asyncComponent.test.js:

javascript

Manejo de Tiempos de Espera con waitFor

En algunos casos, es posible que necesitemos esperar explícitamente a que ciertos cambios aparezcan en el DOM. Para esto, DOM Testing Library nos provee waitFor.

Ejemplo con waitFor:

javascript

[Placeholder para imagen explicativa: Diagrama que ilustre el flujo de una prueba asíncrona con DOM Testing Library, desde el evento inicial hasta la espera de la actualización del DOM]

Desafíos Comunes en Pruebas Asíncronas

1. Flujos Temporales Incómodos:

   • Solución: Usa waitFor para manejar apropiadamente los temporizadores y la lógica con retrasos.

2. Pruebas Frágiles debido a Tiempos Imprecisos:

   • Solución: Mockea las operaciones de temporización (como setTimeout y setInterval) durante las pruebas para un control preciso.

Mockeo de setTimeout:

javascript

Conclusión

En este capítulo, hemos explorado cómo escribir pruebas asíncronas utilizando DOM Testing Library. Hemos cubierto técnicas y herramientas que permiten manejar de manera efectiva las operaciones asíncronas en nuestras pruebas, asegurando que nuestras aplicaciones respondan correctamente después de estas operaciones.

En los próximos capítulos, exploraremos estrategias de organización y estructura de pruebas, así como la automatización de pruebas con CI/CD.