频道导航

单元测试 – AngularJS – 使用$http服务的测试服务方法

2020-05-11 Angularjs 前端之家

前端之家收集整理的这篇文章主要介绍了单元测试 – AngularJS – 使用$http服务的测试服务方法，前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。

我有一个我的服务的功能，看起来像这样：

addStatement: function(user,action,object) {
            var statement = {
                    user: user,action: action,object: object
            };
            $http({
                method: 'POST',url: '/foo/bar',data: statement,headers: {Authorization: 'Basic YWxhZGRpbjpvcGVuIHNlc2FtZQ=='}
            }).success(function(data) {
                alert("success: " + data);
            });
        }

我想为此方法编写单元测试，但我不知道如何使其工作。基本上，我想测试发送的数据是从功能参数中正确构建的，并且发送了正确的授权头文件。

我一直在阅读如何使用$httpBackend，但是示例是测试一个控制器，只是在请求被发出和返回时，在$范围内进行更改。有没有办法实现我想要的测试？还是我去搞错了？

@H_404_8@

测试服务与测试控制器没有太大差异，原则是一样的。基本上你需要：

>注入被测对象
>设置mocks(如果有的话) – 这里你使用$ httpBackend mock在正确的轨道上
>对待测对象运行方法并验证结果

如果在测试后，一种服务方法会导致$ http POST调用，那么可以这样写出你的测试(省略非重要的部分)：

beforeEach(module('MyApp'));
beforeEach(inject(function(MyService,_$httpBackend_) {
    service = MyService;
    $httpBackend = _$httpBackend_; // angular strips the underscores so
                                   // we don't need to use unique names
    // https://docs.angularjs.org/api/ngMock/function/angular.mock.inject
}));

it('should invoke service with right paramaeters',function() {
    $httpBackend.expectPOST('/foo/bar',{
        "user": "testUser","action": "testAction","object": {}
    },function(headers){
        return headers.Authorization === 'Basic YWxhZGRpbjpvcGVuIHNlc2FtZQ==';
    }).respond({});
    service.addStatement('testUser','testAction',{});
    $httpBackend.flush();
});

这是工作的jsFiddle说明了这个测试在行动：http://jsfiddle.net/pkozlowski_opensource/MkrjZ/2/

最后一句话：在单元测试中最好不要使用.alert()，因为这些警报将暂停执行测试。

原文链接：https://www.f2er.com/angularjs/144450.html