难以测试Angularjs控制器以服务作为依赖

时间:2016-09-13 20:23:56

标签: angularjs unit-testing jasmine karma-jasmine

我写了一个角度测试应用程序。想要学习使用它的测试。

控制器看起来像这样

var EmployeeModule = EmployeeModule || {};

(function (currentModule) {
    EmployeeModule.EmployeeController = function ($scope, $routeParams, $location, Employees) {
        this.RegEmployees = Employees.GetEmployees();
        this.currentEmployee = {};
        if ($routeParams.Id != undefined) {

          console.log("to check $route"+$routeParams);
          this.currentEmployee = Employees.GetEmployeeById($routeParams.Id);
        }
        this.Id = "";
        this.firstname = "";
        this.lastname = "";
        this.email = "";
        this.dob = "";
        this.department = "";
        this.RegisterEmployee = function () {
            Employees.RegisterEmployee(this.firstname, this.lastname, this.email, this.dob, this.department);
            if ($scope.employeeForm.$valid)
                $location.path("/Employees");
        }
 EmployeeModule.Employee = function (firstname, lastname, email, dob, department) {
        this.Id = Date.now();
        this.FirstName = firstname;
        this.LastName = lastname;
        this.Email = email;
        this.DOB = dob;
        this.Department = department;
    }

})(EmployeeModule);

我的角度服务看起来像这个

var app = angular.module('angularApp2App');
app.factory('Employees', function () {
    var RegEmployees = {};
    var Employees = [];
    //Service
    RegEmployees.RegisterEmployee = function (firstname, lastname, email, dob, department) {
        var newEmployee = new EmployeeModule.Employee(firstname, lastname, email, dob, department);

        Employees.push(newEmployee);

    }
return RegEmployees;
});
app.controller('EmployeeController', ['$scope', '$routeParams', '$location', 'Employees', EmployeeModule.EmployeeController]);

我正在尝试为控制器编写单元测试,但不确定,如何在单元测试中将服务作为依赖项注入控制器。

请帮忙 我的单元测试代码是

describe('Controller: EmployeeController', function () {

    // load the controller's module
    beforeEach(module('angularApp2App'));

    var empCtrl,
        scope;

    // Initialize the controller and a mock scope
    beforeEach(inject(function ($controller, $rootScope, $injector) {
        scope = $rootScope.$new();
        var employeeService = $injector.get('Employees');
        console.log(employeeService);
        spyOn(employeeService , 'RegisterEmployee');
        empCtrl = $controller('EmployeeController', {
            $scope: scope
                // place here mocked dependencies
        });
    }));


    it('checking default values', function () {
        expect(empCtrl.currentEmployee).toEqual({});
    });

    it('checking RegisterEmployee Method',function () {
      expect(RegisterEmployee).toHaveBeenCalled();
    });
});

由于

1 个答案:

答案 0 :(得分:0)

基本上,当您想要模拟或测试服务上调用的内容时,您只需要注入service。如果不是这种情况,angular会自动为您注入。我将在这里写一个小测试来帮助您获得洞察力:

describe('Controller: EmployeeController', function () {

    // load the controller's module
    beforeEach(module('angularApp2App'));

    it('Check that Employees.GetEmployees was called on startup', inject(function ($controller, $rootScope, Employees) {
        //Here I am spying on Employees.GetEmployees. It means that the call 
        //to this method will be replaced with an empty function(){}
        //(i.e. nothing will happen). And also means that I can check if
        //it was called and with as parameters (and many other things)
        spyOn(Employees, 'GetEmployees');

        //This initializes the controller
        var myController = $controller('EmployeeController', {
            $scope: $rootScope.$new()
            //You don't need to inject Employees here. It will be automatic
            //injected for you.
        });

        expect(Employees.GetEmployees).toHaveBeenCalled();
    }));
});