使用Jasmin使用$ httpBackend与async/await一起测试角度服务 [英] Testing angular service with $httpBackend with async/await using jasmin

问题描述

我以前已经成功测试了将ES7异步/等待语法与茉莉花搭配使用的角度控制器-

I have previously successfully tested an angular controller that uses ES7 async/await syntax with jasmine -

async updateGridAsync() {
        const paging = angular.copy(this.gridData.getServerCallObj());            
        }
        try {
            const model = await this.service.getAsync(paging);
            this._$rootScope.$apply();
        } catch (e){this._notification.error(this._$rootScope.lang.notifications.unexpectedError);
        }
    }

it('updateGridAsync() should update the gridData when succeed', async (done) => {
    expect(ctrl.gridData.totalItems).toEqual(2);
    expect(ctrl.gridData.items.length).toEqual(2);
    spyOn(service, 'getAsync').and.callFake(() => {
        return Promise.resolve(responseStub);
    });
    await ctrl.updateGridAsync();
    expect(service.getAsync).toHaveBeenCalled();
    expect(ctrl.gridData.totalItems).toEqual(1);
    expect(ctrl.gridData.items.length).toEqual(1);
    done();
});

上面的代码运行完美.但是，一旦尝试测试模拟的服务代码(称为$ http.post)，就会遇到问题.这是我在服务中运行的代码:

The above code works perfectly. However, I encountered a problem once trying to test the mocked service code, that calls $http.post. This is the code I run in the service:

async getAsync(pagingData, spinner, gridId, payeeId){            
        const response = await $http.post(url, params);
        const model = this.modelFactory(response.data);
        return model ;
    }

以及在updateGridService中等待之后无法执行的测试方法:

and the test method that isn't able to go a step after the await in updateGridService:

it('getAsync should return correct model', async (done) => {                
    $httpBackend.whenPOST(theUrl).respond(200, responseStub);

    const model = await service.getAsync();

    expect(model.list.length).toEqual(2);        
    $httpBackend.flush();
    done();
});

需要指出的几件事-

• 在使用异步等待之前，此测试已通过.现在，我无法在服务中得到等待.
• 该功能不在测试环境中有效.
• 我正在使用茉莉2.4.1和angularJS 1.6

推荐答案

我不认为您可以将它们一起使用-等待实际上是在等待后端承诺解析并且由f​​lush触发后，还要在任何时候触发它提出要求是不好的.

I don't think you can use those together - await is actually waiting till the backend promise resolves and that is triggered by flush, but also triggering it before any request has been made does no good.

我的意思是，如果您想直接使用它，我个人将其与帮助程序一起使用，该帮助程序会为刷新操作创建超时，然后等待请求.

I mean if you wanna use it in a straightforward way, I personally use it with a helper that creates timeout for the flush action and then awaits for the request.

export async function withHttp(
    callbackHttp: (http: HttpTestingController) => void,
    callbackTest: () => Promise<void>
): Promise<void> {
    const http = TestBed.get(HttpTestingController);
    setTimeout(() => callbackHttp(http));
    await callbackTest();
}

也不要将异步测试方法与完成一起使用(并且在测试的最后一行刚刚调用完它也不要使用完成).

Also don't use async test methods together with done (and don't use done when it's just called on the last line of test, it's not needed then).

这篇关于使用Jasmin使用$ httpBackend与async/await一起测试角度服务的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！