Angular Jamine/Karma测试承诺功能

Question

我正在尝试测试以下函数中的Promse功能

loadDetail(id) {
    this.bookingService.getServices(id).then((ret) => {
        if (ret.result) {
            this.sevices = ret.payload;
        } 
    }).catch((error) => {});       
}

我的测试是：

it('loadDetail successfully return services.', inject(
    [BookingService], (service: BookingService) => {
        service.initBooking();
        let ret = new returnObj();
        ret.result = true;
        ret.payload = new Array<any>();
        ret.payload.push({id: 1, title: "Title 1"});
        ret.payload.push({id: 2, title: "Title 2"});
        ret.payload.push({id: 3, title: "Title 3"});
        const spy = spyOn(service, "getServices").and.returnValue(Promise.resolve(ret));
        component.loadDetail(1);
        expect(component.sevices.length).toEqual(3);
    }
));

当我运行测试时，我会得到错误"预期0等于3."。我在这里做错了什么？我已经遵循了例子，而且我很确定我正在正确使用间谍。

Answer 1

问题是承诺是异步的，结果在完成loadDetail(1)之前被断言。

为了进行有效测试，异步功能应始终返回承诺或可观察的函数：

loadDetail(id) {
  return this.bookingService.getServices(id)....
}

如果不应该返回结果，它将是undefined的承诺。

这样可以链接。这对async..await和async或fakeAsync角辅助器特别有用：

it('loadDetail successfully return services.', fakeAsync(inject(
    [BookingService], async (service: BookingService) => {
        ...
        const spy = spyOn(service, "getServices").and.returnValue(Promise.resolve(ret));
        await component.loadDetail(1);
        expect(component.sevices.length).toEqual(3);
    }
));

这也可以使用fakeAsync和tick帮助者以同步测试异步代码（这将无法与真正的HTTP请求（如Real HTTP请求）一起使用）：

it('loadDetail successfully return services.', fakeAsync(inject(
    [BookingService], (service: BookingService) => {
        ...
        const spy = spyOn(service, "getServices").and.returnValue(Promise.resolve(ret));
        component.loadDetail(1);
        tick(0); // promise chain was executed
        expect(component.sevices.length).toEqual(3);
    }
));