使用Controller As语法测试变量绑定

时间:2015-05-31 10:24:12

标签: angularjs jasmine angularjs-controller

我尝试使用控制器作为语法来测试一个简单的表单控制器。我想要的是能够将不同的字段值传递给每个单元测试并查看控制器如何反应。以我用的代码为例:

控制器:

angular.module('auth').controller('LoginFormCtrl',['AuthService',function(AuthService) {
  var self = this;

  self.non_field_errors = {};

  self.login = function(){
    AuthService.login(self.login_details.username,self.login_details.password)
        .then(function(){
            //do routing stuff here
        },function(response){
            if('non_field_errors' in response){
                self.non_field_errors = response.non_field_errors;
            }
        });
    };
}]);

测试:

describe('LoginFormCtrl', function() {

var scope; //scope to bind controller to
var ctrl; //Controller to be tested

beforeEach(module('auth'));

//Mock out AuthService
beforeEach(module(function($provide){

    authService = {
        login: function(username,password){
            var deferred = $q.defer();
            if(username == 'test1' && password == 'password1'){
                deferred.resolve();
            }else{
                deferred.reject({non_field_errors:['non_field_error_1']});
            }
            return deferred;
        }
    };
    $provide.value('AuthService',authService);

}));

//Set up scope
beforeEach(inject(function($rootScope){
    scope = $rootScope.$new();
}));

//Set up spies
beforeEach(inject(function(AuthService){
    spyOn(AuthService,'login').andCallThrough();
}));

//Clean Up
afterEach(function(){
    ctrl = null;
});

it('should log the user in if they provide the correct details', inject(function($controller){

    ctrl = $controller('LoginFormCtrl',scope,{
        login_details:{
            username:'test1',
            password:'password1',
        }
    });

    ctrl.login();
    expect(AuthService.login).toHaveBeenCalledWith('test1','password1');
})); 

});

我尝试过几种不同的方法,比如创建一个范围并直接操作ctrl变量。做这种测试的最佳方法是什么?

1 个答案:

答案 0 :(得分:1)

首先实例化控制器:

ctrl = $controller('LoginFormCtrl');

Angular将注入AuthService。在控制器中没有其他依赖注入,因此传递范围或login_details不会起作用。

然后设置其login_details:

ctrl.login_details = {
    username: 'test1',
    password: 'password1'
};

然后调用该函数进行测试:

ctrl.login();