javascript - 如何测试从 Angular 服务获取数据的 Angular Controller ?

标签 javascript angularjs jasmine

很简单,我有一个 Controller ,它在服务的范围上设置了一个属性。

Controller :

dadApp.controller('landingController', function($scope, automationService) {
    $scope.hello = "from controller";
    $scope.foo = automationService.foo;

    // load data from service.
});

服务:

dadApp.factory('automationService', function($http) {
    var _foo = [];

    $http.get('/api/automation')
        .then(function(result) {
                angular.copy(result.data, _foo);
            },
            function() {
                alert('error');
            });

    return {
        foo: _foo
    };
});

在我的规范/测试文件中,由于该 Controller 依赖于服务,因此如何测试该 Controller ? (仅供引用,该服务是 ASP.NET WebAPI 2。

这是我的规范:

/// <reference path="../Scripts/angular.js" />
/// <reference path="../Scripts/angular-mocks.js" />
/// <reference path="../Scripts/angular-resource.js" />
/// <reference path="../Scripts/angular-route.js" />
/// <reference path="../app/app.js" />
/// <reference path="../app/services/automationService.js" />
/// <reference path="../app/controllers/landingController.js" />
'use strict';

var scope, ctrl;

describe('DAD tests', function() {
    beforeEach(module('dadApp'));

    beforeEach(inject(function($controller, $rootScope) {
        scope = $rootScope.$new();
        ctrl = $controller('landingController', { $scope: scope });
    }));

    describe('landing controller tests', function() {
        describe('scope.hello', function() {
            it('should equal "from controller"', function() {
                expect(scope.hello).toEqual("from controller");
            });
        });
    });
});

最佳答案

也许是这样的:

var mockedFoo = {
    bar: true,
    baz: 123,
    other: "string"
};
var automationServiceMock = {
    foo: function() {
        return mockedFoo;
    }
};
describe('DAD tests', function() {
    beforeEach(module('dadApp'));

    beforeEach(inject(function($controller, $rootScope) {
        scope = $rootScope.$new();
        ctrl = $controller('landingController', {
            $scope: scope, 
            automationService: automationServiceMock 
        });
    }));

    describe('landing controller tests', function() {
        describe('scope.hello', function() {
            it('should equal "from controller"', function() {
                expect(scope.hello).toEqual("from controller");
            });
        });
    });
});

关于javascript - 如何测试从 Angular 服务获取数据的 Angular Controller ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23067253/

相关文章:

javascript - Protractor - 如果显示/呈现元素

javascript - JS : How can i convert the string ("Mar 10, 2015") to a Date object?

javascript - angularjs 指定字符url之前的子字符串

angular - Jasmine Angular : How to write unit test for anonymous func given as args

javascript - 如何在用 TypeScript 编写的 Angular Controller 上访问范围值(在测试中)?

javascript - Angular js : Inject ngProgress service in controller file using MEAN Stack

Javascript:将日期时间转换为 DD/MM/YYYY - 时间?

javascript - 为什么我的 Angular $http get 请求返回我的index.html?

javascript - 如何检查用户在浏览器中输入地址URL并点击书签?

javascript - 奇怪的行为 Angular 驱动的选择列表