[SOLVED] Unit test async method with multiple awaits

Unit test async method with multiple awaits

I am trying to test statements after 1st await but it doesn't work. Debugger doesn't hit the next breakpoint

service.ts

async deleteFaq(faq: FaqDetailsApi) {
  await this._http.delete(`${this.ADMIN_FAQ_URL}/${faq.id}`).toPromise();

  debugger // Debugger doesn't hit this, next lines are not executed

  await this._http.get(`${this.ADMIN_FAQ_URL}/${faq.order}/-1/${faq.id}`).toPromise();
  const faqPrev = this._faqs.getValue().find(f => f.id === faq.id);
}

service.spec.ts

it('should create a DELETE request 123', fakeAsync(() => {
  let faq = testFaqs[0];
  service.deleteFaq(faq);
  const req = httpMock.expectOne(`${service.ADMIN_FAQ_URL}/${faq.id}`);
  tick();
  expect(req.request.method).toBe('DELETE'); // pass
  const req2 = httpMock.expectOne(`${service.ADMIN_FAQ_URL}/${faq.order}/-1/${faq.id}`);
  tick();
  expect(req2.request.method).toBe('GET'); // fails
}));

Solution

In order to proceed execution after await your need to fulfill two things:

resolve and complete Observable by simulating http request
simulate the asynchronous passage of Promise

You already use tick() that solves the second case but it does nothing without simulating http request.

Use TestRequest#flush method for that:

const req = httpMock.expectOne(`${service.ADMIN_FAQ_URL}/${faq.id}`);
req.flush({}); // synchrounously simulates http request and complete observable
tick();
...