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

Question

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

控制器:

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变量。做这种测试的最好方法是什么?

Answer 1

首先实例化控制器:

ctrl = $controller('LoginFormCtrl');

Angular会注入AuthService。没有其他依赖项要注入到控制器中，因此传递scope或login_details将不起作用。

然后设置其login_details:

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

然后调用函数进行测试:

ctrl.login();