Jasmine：如何測試 Promise.then 塊？

Question

我想測試一個場景，我必須調用 function（從私有只讀服務），其中有一個異步調用，然后一些變量正在更新等。

myFunction(param) {
    this.myService
        .serviceFunction(params)
        .then((resp) => {
          let someData = this.transformData(resp);
          this.anotherFunction(someData);
          if (param) {
            // something
          } else {
            // something else
          }
        })
        .catch((e) => {
          // catching errors
        });
  }

在我的 spec.ts 中，我試圖模擬 serviceFunction 調用，但看起來它甚至根本沒有進入 the.then 塊。

spyOn(myService, 'serviceFunction').and.returnValue(Promise.resolve(RESPONSE_MOCK));
expect(component.transformData).toHaveBeenCalled(); // won't work

你們有任何教程/信息來測試這種情況下的 the.then 塊嗎？ 我沒有足夠的知識來自己解決這個問題。 任何建議，將不勝感激。

謝謝！

Answer 1

Angular 中有許多選項可用於測試異步代碼。一些示例是async/await 、 fakeAsync/tick和waitForAsync 。 我將向您展示async/await/fixture.whenStable()和fakeAsync/tick的示例。

異步/等待

it('does xyz', async () => {
  spyOn(myService, 'serviceFunction').and.returnValue(Promise.resolve(RESPONSE_MOCK));
  // do stuff
  //
  // Wait until all promises have resolved or rejected before continuing.
  await fixture.whenStable();

  expect(component.transformData).toHaveBeenCalled();
});

假異步/打勾

it('does xyz', fakeAsync(() => {
  spyOn(myService, 'serviceFunction').and.returnValue(Promise.resolve(RESPONSE_MOCK));
  // do stuff
  //
  // Wait until all promises have resolved or rejected before continuing.
  tick();

  expect(component.transformData).toHaveBeenCalled();
}));

您可以研究更多關於async/await/fixture.whenStable() 、 waitForAsync和fakeAsync/tick的信息。