单元测试角度控制器使用捕获变量来实现这个' with controllerAs语法

时间:2015-07-22 03:42:38

标签: javascript angularjs unit-testing

我一直关注this Angular style guide by John Pappa,而且我在使用controllerAs语法进行测试时遇到了问题。具体来说,指南说使用像var vm = this;这样的捕获变量来避免将内容附加到控制器内的$ scope。

当我开始使用此捕获变量测试控制器时,我的问题出现了。当我在单元测试中创建控制器时,我无法调用附加到捕获变量的方法。

我的代码如下:

控制器:

(function(){
    'use strict';

    /**
     * @ngdoc function
     * @name mytodoApp.controller:MainCtrl
     * @description
     * # MainCtrl
     * Controller of the mytodoApp
     */
    angular.module('mytodoApp')
        .controller('MainCtrl', function ($scope) {
            /* jshint validthis: true */
            var vm = this;

            vm.tasks = [];

            vm.addTask = addTask;
            vm.removeTask = removeTask;

            function addTask() {
                if(!contains(vm.tasks, $scope.task)){
                    vm.tasks.push($scope.task);
                } else {
                    vm.isInvalid = true;
                }

                $scope.task = '';
            };

            function removeTask(index) {
                vm.tasks.splice(index, 1);
            };

            var contains = function(list, item) {
                var res = list.indexOf(item);
                return res === -1 ? false : true;
            };
        });
})();

单元测试:

'use strict';

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

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

  var MainCtrl,
    scope;

  // Initialize the controller and a mock scope
  beforeEach(inject(function ($controller, $rootScope) {
    scope = $rootScope.$new();
    MainCtrl = $controller('MainCtrl', {
      $scope: scope
      // place here mocked dependencies
    });
  }));

  it('should attach a list of tasks to the viewmodel', function () {
    expect(MainCtrl.tasks.length).toBe(0);
  });

  it('should add items to the list', function() {
    scope.task = 'example task';
    MainCtrl.addTodo();
    expect(MainCtrl.tasks.length).toBe(1);
  });
});

我收到此错误:

PhantomJS 1.9.8 (Mac OS X 0.0.0) Controller: MainCtrl should add items to the list FAILED
  TypeError: 'undefined' is not a function (evaluating 'MainCtrl.addTodo()')
      at /Users/kyle/Code/AngularProjects/mytodo/test/spec/controllers/main.js:28

1 个答案:

答案 0 :(得分:0)

addTodo()中没有MainCtrl个功能。您的意思是运行addTask()吗?