$httpBackend expectGET 未返回预期数据答案

【问题标题】：$httpBackend expectGET not returning expected data$httpBackend expectGET 未返回预期数据
【发布时间】：2016-06-01 18:19:02
【问题描述】：

我刚开始说 $httpBackend 和 spyOn 对我来说很新，我正在努力清楚地了解正在发生的事情。基本上，我正在尝试执行 $httpBackend.expectGET('/myroute/').respond(...) 然后使用 spyOn，但我一直在

Expected [  ] to equal Object({ success: true, message: 'Yeah!' })

这是我要测试的代码：

angular.module('TestModule')
       .service('TestService',TestService);

TestService.$inject = ['$http'];
function TestService($http){
    var service = {};
    service.DoIt = DoIt;
    return service;

    function DoIt() {
        return $http.get('/myroute/')
            .then(handleSuccess,handleError('Error happened!'));
    }

    function handleSuccess(res) {
        return res.data;
    }

    function handleError(error) {
        return function(){
            return {success: false, message: error}
        };
    }
}

这是我的 Karma-Jasmine 测试：

describe('Test Module',function(){
    beforeEach(module('TestModule'));

    describe('TestService Tests',function(){
        var service,$httpBackend;
        beforeEach(inject([
             '$injector',
             function($injector){
                 $httpBackend = $injector.get('$httpBackend');
                 service = $injector.get('TestService');
             }
        ]));

        afterEach(function(){
            $httpBackend.verifyNoOutstandingExpectation();
            $httpBackend.verifyNoOutstandingRequest();
        });

        it('should DoIt',function(){
            var mockResponse = {
                data : {success:true, message:"Yeah!"}
            };

            $httpBackend.expectGET('/myroute')
                        .respond(Promise.resolve(mockResponse));

            spyOn(service,'DoIt').and.callThrough();

            service.DoIt().then(function(data){
                expect(service.DoIt).toHaveBeenCalled();
                expect(data).toEqual(mockResponse.data); <-- ERROR OCCURS HERE -->
            });

            $httpBackend.flush();
        });

    });
});

更多信息：

使用我在这里找到的示例：http://www.bradoncode.com/blog/2015/06/26/unit-testing-http-ngmock-fundamentals/，我在我的测试代码中尝试了这个：

it('should DoIt',inject(function($http){
    var promise = $http.get('/myroute').then(handleSuccess,handleError('bad stuff happened'));
    promise.then(function(data){
        console.log('Data: ' + JSON.stringify(data,null,3));
    });

    $httpBackend.expect('GET','/myroute').respond(200,{data:'Yeah!'});
    $httpBackend.flush();
}));

function handleSuccess(response) {return response.data;}
function handleError(error){
    return function(){
        return {success:false,message:error};
    };
}

这给了我预期的响应：'Data: {"data": "yeah"}'

我更新的问题：我认为 service.DoIt() 正在做与承诺相同的事情。这里发生了什么？我没有注入我的服务吗？我不明白 Karma 期望我如何进行这个测试。任何帮助，请！

【问题讨论】：

@jbrown - 我想这就是语法让我明白的地方。我以为我在传递它。我以为我的 $httpBackend.expectGET('/myroute').respond(...) 正在处理 DoIt() 中的 $http.get('/myroute')。我以为我的 mockResponse 然后会被传递给 handleSuccess() 并且它有一个“数据”属性。但这不是这里发生的事情？
这只是将“数据”设置为未定义。
另外，既然你提出来了，你发现服务代码有什么问题？感谢您的任何意见。

标签： angularjs promise karma-jasmine httpbackend

【解决方案1】：

如果我正确理解您的测试意图，我相信这就是您所需要的：

describe('Test Module', function() {

    var $httpBackend, service;

    beforeEach(module('TestService'));

    beforeEach(inject(function(_$httpBackend_, _TestService_) {
        $httpBackend = _$httpBackend_;
        service = _TestService_;
    }));

    afterEach(function() {
        $httpBackend.verifyNoOutstandingExpectation();
        $httpBackend.verifyNoOutstandingRequest();
    });

    it('should DoIt', function() {
        var mockResponse = {
            data: { success: true, message: "Yeah!" }
        };

        $httpBackend.expectGET('/myroute/')
            .respond(mockResponse);

        service.DoIt().then(function(data) {
            expect(data).toEqual(mockResponse);
        });

        $httpBackend.flush();
    });

});

【讨论】：

这给了我“预期 [] 等于 Object({ data: Object({ success: true, message: 'Yeah!' }) })”，这与我之前遇到的错误相同.基本上，这个“解决方案”改变了注入语法。根据 Angular 的 API，我们的两种注入语法都是合法的。
基本上，这个“解决方案”使用您为服务粘贴的代码在我的机器上传递。
它还修复了 $httpBackend.expectGET 路径中的拼写错误
那么也许我的 karma.conf 设置有误？那可能有什么不同呢？如果您认为可能有帮助，我可以添加它。
好的，废话。我已经将 angular.module('TestModule').service('TestService',...) 包裹在 (function(){'use strict'; angular...})(); 中。当我剥离该函数（）时，使用严格的包装器，它就像你说的那样工作。我不认为这会像那样影响业力茉莉。

【解决方案2】：

在我的例子中，$resource 上的 transformResponse 函数修改了预期的模拟数据：

var resource = $resource('api/data/:id', {}, { get: { method: 'GET', isArray: true, transformResponse: function (data) { var d = angular.fromJson(data); return d.members; } } ...

我的模拟数据不包含成员...

【讨论】：