AngularJS单元测试. HttpBackend

2023年11月7日 187次阅读

我有AngularJS应用程序,包含它的单元测试.我在应用程序的.run部分添加了一个http请求,用于检查用户身份验证.现在大约60％的测试失败了,因为他们发现了’意外的http请求’.甚至指令测试都失败了.如何避免在测试中运行此请求？如何在所有测试中轻松模拟此请求？我试图不将httpBackend.expect(‘GET’,’URL’)放到每个测试中 – 这太过分了.

使用Jasmine Karma进行测试

谢谢.如果需要,我可以提供更多细节.

最佳答案 有几种方法可以做到这一点：

1.)包括Tim Castelijns为每个spec文件建议的beforeEach
2.)将beforeEach包含在名为app-mocks.js&的单独文件中.包含在你的karma.conf.js中(我猜你有一个).

karma.conf.js

files: [
    'location/of/app-mocks.js',
    'src/app/**/*.js'
],

APP-mocks.js

(function () {
    'use strict';

    beforeEach(inject(function ($httpBackend) {
        $httpBackend.whenGET('blahblahblah.com/cat/:id/food').respond('');
    }));
})();

3.)从核心应用程序中分离出用户身份验证逻辑,并创建$http包装器服务(建议).因此,您可以(简化示例)：

app.js

angular.module('myApp', ['myApp.services']);

用户service.js

angular.module('myApp.services', [])
    .factory('User', function ($http) {
        function authenticate() {
            // authenticate user
        }

        return {
            authenticate: authenticate
        };
    });

对于您的指令,控制器等也是如此.这样,您可以单独测试所有组件,而不必担心实际上特定于某种功能的交织逻辑.此外,当您测试核心应用程序功能时,您可以模拟或监视您的用户服务.在您的spec文件中,您只会注入模块&您正在测试的功能.因此,您不会注入整个核心应用模块,而是：

测试服务

beforeEach(module('myApp.services'));

测试指令

beforeEach(module('myApp.directives'));

等等

注意：当您的应用程序开始变大时,我会考虑根据功能而不是类型来组织您的应用程序组件,如上面的示例所示.

点赞