Estoy tratando de probar un componente Angular 2 que se basa en una llamada de servicio para completar los datos. Pero, esta promesa de llamadas de servicio se maneja dentro de otra función.
this.data = null; //empty data is defined here. public getDataMethod(){ // controller related logic privateService.privateMethod( (data) => {this.data = data} //the data is populated here ) }¿Cómo puedo esperar a que se resuelva la función interna?
Leí que podemos esperar a que las promesas se resuelvan con 'hecho', pero los únicos ejemplos que encontré fueron llamar directamente a la promesa. (No es una promesa anidada dentro de una función)
Intenté pasar el método done a la función y funciona bien.
public getDataMethod(done){ // controller related logic privateService.privateMethod( (data) => {this.data = data} //the data is populated here done(); //Calling done when the promise is resolved. ) } Pero eso enturbia el código que se prueba. ¿Hay una mejor manera de esperar a que se complete el valor de los data antes de ejecutar las pruebas?
Todo esto se explica en la sección Prueba de documentos de Angular Probar un componente con un servicio asíncrono . Básicamente tienes un par de opciones.
Use async para envolver las pruebas. Angular sabe cuándo están ocurriendo tareas asíncronas, porque usa zonas para parchear todas las funciones asíncronas como setTimeout . Cuando usamos async , Angular evitará que la prueba se complete hasta que todas las tareas asíncronas estén fuera de la cola.
import { async } from '@angular/core/testing'; it('..', async(() => { // any async calls that happen between here // will be completed before the test completes })) la otra parte de esto es esperar a que se completen las tareas asincrónicas antes de hacer cualquier afirmación. Para eso, podemos usar fixture.whenStable() que esperará antes de que se completen las tareas asíncronas, luego nos notificará con una promesa
it('..', async(() => { service.someAsyncTask(); fixture.whenStable().then(() => { expect(...) }) })) La otra opción es usar el combo fakeAsync/tick . Angular nos permite esperar a que se completen las tareas asíncronas llamando a tick . Esto nos permite hacer que la prueba parezca sincrónica.
import { fakeAsync, tick } from '@angular/core/testing'; it('..', fakeAsync(() => { service.someAsyncTask(); tick(); expect(...) }))