Testowanie Angular 2 - wywołanie funkcji asynchronicznej - kiedy używać

Kiedy używasz funkcji asynchronicznej w TestBed podczas testowania w Angular 2?

Kiedy tego używasz?

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

A kiedy tego używasz?

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

Czy ktoś może mnie w tym oświecić?

asyncnie pozwoli na rozpoczęcie następnego testu, dopóki nie asynczakończy wszystkich jego zadań. To, co asyncrobi, to zawijanie wywołania zwrotnego w strefie, w której setTimeoutśledzone są wszystkie zadania asynchroniczne (np. ). Po ukończeniu wszystkich zadań asynchronicznych następuje asynczakończenie.

Jeśli kiedykolwiek pracowałeś z Jasmine poza Angularem, być może widziałeś done, jak przechodzisz do oddzwaniania

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

Tutaj jest to rodzima Jasmine, gdzie mówimy Jasmine, że ten test powinien opóźnić zakończenie do czasu, gdy zadzwonimy done(). Jeśli nie zadzwoniliśmy, done()a zamiast tego zrobiliśmy to:

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

Test zakończyłby się jeszcze przed oczekiwaniem, ponieważ obietnica rozwiązuje się po zakończeniu testu podczas wykonywania zadań synchronicznych.

Z Angular (w środowisku Jasmine), Angular będzie w rzeczywistości wywoływał doneza kulisami, gdy używamy async. Będzie śledził wszystkie asynchroniczne zadania w Strefie, a gdy wszystkie zostaną zakończone, donezostaną wywołane za kulisami.

W twoim konkretnym przypadku z TestBedkonfiguracją, użyjesz tego ogólnie, kiedy chcesz compileComponents. Rzadko spotykam się z sytuacją, w której musiałbym inaczej to nazwać

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

Podczas testowania komponentu, który używa templateUrl(jeśli nie używasz webpacka), Angular musi wysłać żądanie XHR, aby pobrać szablon, więc kompilacja komponentu byłaby asynchroniczna. Dlatego przed kontynuowaniem testów powinniśmy poczekać, aż problem zniknie.

Gdy wykonujesz wywołanie asynchroniczne w teście, rzeczywista funkcja testowa zostanie zakończona przed zakończeniem wywołania asynchronicznego. Gdy trzeba zweryfikować stan zakończenia wywołania (co zwykle ma miejsce), platforma testowa zgłosi test jako zakończony, podczas gdy nadal trwają prace asynchroniczne.

Używając, async(...)możesz powiedzieć platformie testowej, aby poczekała, aż obietnica zwrotu lub obserwowalna zostanie zakończona, zanim potraktujesz test jako zakończony.

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);
  });
}));

Kod przekazany do then(...)zostanie wykonany po zakończeniu samej funkcji testowej. Dzięki temu async()środowisko testowe będzie świadome, że musi czekać na wypełnienie obietnic i obserwacji, zanim potraktuje test jako zakończony.

Zobacz też

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