应该 Angular 服务在单元测试中执行

Question

我正在尝试将 Karma 和 Jasmine 集成到我的项目中。

我从一个非常基本的测试开始，以确保我的控制器已定义并且 $scope 变量等于一个字符串 - 按预期通过。

我的控制器还调用了执行 $http.get 的服务，当运行我的测试时，没有提及任何服务，我得到错误：

Error: Unexpected request: GET /my/endpoint/
No more request expected

控制器：

define(['module'], function (module) {
    'use strict';

    var MyController = function ($scope, MyService) {

        $scope.testScope = 'karma is working!';

        MyService.getData().then(function (data) {
            $scope.result = data.hour
        });
    };    

    module.exports = ['$scope', 'MyService', MyController ];
});

测试：

define(['require', 'angular-mocks'], function (require) {
    'use strict';

    var angular = require('angular');

    describe("<- MyController Spec ->", function () {    

        var controller, scope;

        beforeEach(angular.mock.module('myApp'));

        beforeEach(inject(function (_$controller_, _$rootScope_) {
            scope = _$rootScope_.$new();
            controller = _$controller_('MyController', {$scope: scope});  
            scope.$apply();
        }));

        it('should verify that the controller exists ', function() {
            expect(controller).toBeDefined();
        });    

        it('should have testScope scope equaling *karma is working*', function() {
            expect(scope.testScope ).toEqual('karma is working!');
        });
    });
});

以上错误是预期的吗？

根据以下回复更新：

define(['require', 'angular-mocks'], function (require) {
    'use strict';

    var angular = require('angular');

    describe("<- MyController Spec ->", function () {    

        var controller, scope, $httpBackend, myService;

        beforeEach(angular.mock.module('myApp'));

        beforeEach(inject(function (_$controller_, _$rootScope_, _$httpBackend_, _myService_) {
            scope = _$rootScope_.$new();
            $httpBackend = _$httpBackend_;
            $httpBackend.expectGET("/my/endpoint");
            controller = _$controller_('MyController', {$scope: scope});  
            scope.$apply();
        }));

        it('should verify that the controller exists ', function() {
            expect(controller).toBeDefined();
        });    

        it('should have testScope scope equaling *karma is working*', function() {
            expect(scope.testScope ).toEqual('karma is working!');
        });
    });
});

Answer 1

使用 Angular Mocks 如果尝试了意外或不正确的 http 请求，您将始终收到错误消息——即使是模板也是如此。在您的情况下，有两种方法可以处理此问题以进行测试：

使用`$httpBackend`

$httpBackend 是为测试 http 请求而设计的，而无需实际连接。在您的测试中，只需添加

$httpBackend.expectGET("/my/endpoint");

在初始化控制器之前。

模拟服务

服务本身正在发出 http 请求，因此您可以改为模拟该服务。服务将像往常一样自动注入，但您可以显式注入任何您想要的：

controller = _$controller_('MyController', {$scope: scope,
MyService: {getData: () => ({then: () => {}}) });

这会注入一个具有 getData 函数的对象，而 returns 一个具有 .then 函数的对象。当然，这并没有接近于实现您正在尝试做的事情，但它是执行测试的另一种方式。

以上两种方法都是有效的。这取决于您正在测试什么以及您试图通过测试完成什么。

应该 Angular 服务在单元测试中执行

Should Angular Service Execute In Unit Test

unit-testing

jasmine

angularjs

angularjs-service

karma-jasmine

使用`$httpBackend`

模拟服务

应该 Angular 服务在单元测试中执行

Should Angular Service Execute In Unit Test

unit-testing

jasmine

angularjs

angularjs-service

karma-jasmine

使用$httpBackend

模拟服务

使用`$httpBackend`