Angular 2 Testing - Chiamata di funzione asincrona - quando usare

Quando usi la funzione asincrona nel TestBed durante i test in Angular 2?

Quando lo usi?

 beforeEach(() => {
        TestBed.configureTestingModule({
            declarations: [MyModule],
            schemas: [NO_ERRORS_SCHEMA],
        });
    });

E quando lo usi?

beforeEach(async(() => {
    TestBed.configureTestingModule({
        declarations: [MyModule],
        schemas: [NO_ERRORS_SCHEMA],
    });
}));

Qualcuno può illuminarmi su questo?

asyncnon consentirà l'avvio del test successivo fino al asynctermine di tutte le sue attività. Quello che asyncfa è avvolgere il callback in una zona, dove setTimeoutvengono tracciate tutte le attività asincrone (ad esempio ). Una volta completate tutte le attività asincrone, il file viene asynccompletato.

Se hai mai lavorato con Jasmine al di fuori di Angular, potresti aver visto doneessere passato al callback

it('..', function(done) {
  someAsyncAction().then(() => {
    expect(something).toBe(something);
    done();
  });
});

Qui, questo è il nativo Jasmine, dove diciamo a Jasmine che questo test dovrebbe ritardare il completamento fino a quando non chiameremo done(). Se non abbiamo chiamato done()e invece abbiamo fatto questo:

it('..', function() {
  someAsyncAction().then(() => {
    expect(something).toBe(something);
  });
});

Il test verrebbe completato anche prima dell'aspettativa, perché la promessa si risolve dopo che il test è terminato eseguendo le attività sincrone.

Con Angular (in un ambiente Jasmine), Angular chiamerà effettivamente donedietro le quinte quando usiamo async. Manterrà traccia di tutte le attività asincrone nella zona e, quando saranno terminate, doneverrà richiamato dietro le quinte.

Nel tuo caso particolare con la TestBedconfigurazione, lo useresti generalmente quando vuoi compileComponents. Raramente mi imbatto in una situazione in cui dovrei chiamarla altrimenti

beforeEach(async(() => {
   TestBed.configureTestingModule({
     declarations: [MyModule],
     schemas: [NO_ERRORS_SCHEMA],
   })
   .compileComponent().then(() => {
      fixture = TestBed.createComponent(TestComponent);
   });
}));

Quando si prova un componente che utilizza templateUrl(se non si utilizza webpack), Angular deve effettuare una richiesta XHR per ottenere il modello, quindi la compilazione del componente sarebbe asincrona. Quindi dovremmo aspettare fino a quando non si risolve prima di continuare i test.

Quando si effettua una chiamata asincrona nel test, la funzione di test effettiva viene completata prima del completamento della chiamata asincrona. Quando è necessario verificare uno stato quando la chiamata è stata completata (che di solito è il caso), il framework di test riporta il test come completato mentre è ancora in corso un lavoro asincrono.

Con l'utilizzo async(...)si dice al framework di test di attendere fino al completamento della promessa di ritorno o dell'osservabile prima di considerare il test completato.

it('should show quote after getQuote promise (async)', async(() => {
  fixture.detectChanges();

  fixture.whenStable().then(() => { // wait for async getQuote
    fixture.detectChanges();        // update view with quote
    expect(el.textContent).toBe(testQuote);
  });
}));

Il codice passato a then(...)verrà eseguito dopo il completamento della funzione di test. Con async()si rende consapevole il framework di test che deve attendere il completamento di promesse e osservabili prima di considerare il test completato.

Guarda anche

• https://angular.io/guide/testing#async