javascript - 用作通用自定义验证器的测试指令

Question

出于两个原因，我制作了一个自定义验证器指令(不太通用的版本 here ):

1. 我的模板中没有重复规则
2. 我的规则服务中有复杂的规则，而不是分布在多个指令中

html/模板看起来像这样:

<input type='text' 
  name='name' 
  data-validator='name' 
  data-validator-entity='user'>

指令:

angular.module('app').directive('validator'
 , ['appRules', function(appRules) {
  return {
    require: ['^form','ngModel'],
    link: function(scope, elm, attrs, ctrls) {
      // removed checks that can be tested
      var ctrl=ctrls[1],form=ctrls[0]
      //appRules.user.validate('name') returns the function
      //  appRules.user.validateFunctions.name to validate
      //  the name field of the user entity
      ,fn=appRules[attrs.validatorEntity].validate(attrs.validator);
      ctrl.$parsers.unshift(
        function(viewValue){
          fn(viewValue,ctrl,form);
        }
      );
      //appRules.user.validateMessages.name is an array of possible
      //  things that can be wrong with name. Like cannotEmpty and 
      //  minimuThreeChars the validate function will set validity
      //  with ctrl.$setValidity('cannotEmpty',true/false);
      //  this is used to display a message to the user if needed
      //  for example:
      //  appSettings.messages.user.cannotEmpty='Cannot leave this field empty'
      ctrl.$error.messages=appRules[attrs.validatorEntity]
        .validateMessages[attrs.validator];
    }
  };
}]);

我唯一想测试的是 ctrl.$parsers 设置了正确的函数，并且 ctrl.$error.messages 设置正确。但我不确定 ctrl 是什么、它从哪里来以及如何在测试中访问它。

这是迄今为止的测试:

var $compile;
var $rootScope;
var appSettings;
var appRules;
var element;
beforeEach(inject(function(_$compile_, _$rootScope_,appSettings,appRules){
  $compile = _$compile_;
  $rootScope = _$rootScope_;
  $rootScope.data={
    name:'testName'
  };
  appSettings = appSettings;
  appRules = appRules;
  element = $compile("<div><form name='test'>\
    <input type='text' \
      name = 'name' \
      data-ng-model='data.name'\
      data-validator-entity='user'\
      data-validator='name'></form></div>")($rootScope);
  $rootScope.$digest();
}));

//removed working tests that throw on invalid entity and field

it('Check if validator sets correct values in ctrl.', function() {
  //how to get ctrl from here? element.find('input') is not it
  // element.find('input').data is empty 
  // element.find('input').$eror is undefined
}

Answer 1

你可以在测试中得到这样的 ngModel Controller :

var ctrl = element.find('input').controller('ngModel');

对于表单 Controller ，您可以执行相同的操作:

var form = element.find('form').controller('form');

希望这有帮助。