为angular.js指令编写测试

时间:2014-05-29 18:06:20

标签: javascript angularjs jasmine

我在为angular.js指令编写测试时遇到问题,该指令检查输入中的名称是否为全名:

这是指令:

angular.module('app.directives').directive('fullName', [
  function() {
    return {
      require: 'ngModel',
      link: function(scope, elm, attrs, ctrl) {
        ctrl.$parsers.unshift(function(value) {

          if (value.split(' ').length >= 2) {
            ctrl.$setValidity('fullName', true);
            return value;
          } else {
            ctrl.$setValidity('fullName', false);
            return value;
          }

        });
      }
    };
  }
]);

这是一个非工作和未完成的测试:

 describe('example directive test', function() {

  beforeEach(module('app.directives'));


  beforeEach(inject(function($rootScope, $compile) {
     elm = angular.element(
       '<label for="user_name" class="field">' +
         '<input' +
           'required' +
           'ng-class="{error: showErr && signupForm.name.$invalid}"' +
           'full-name' +
           'name="name"' +
           'id="user_name"' +
           'type="text"' +
           'autocomplete="off"' +
           'ng-model="user.name"' +
           'placeholder="Full Name" />' +
         '<span class="error" ng-show="showErr && signupForm.name.$invalid">Please enter your full name.</span>' +
       '</label>');

     scope = $rootScope;
     $compile(elm)(scope);
     scope.$digest();

  }));


  it('should have a working full-name directive', function() {
    var input = elm.find('input');
    scope.$apply(function() {
      scope.name = "Johnsmith"
    });
    expect(input.eq(0)).hasClass("showErr").toBeTruthy();
  });


});

现在我的代码抛出错误&#34; TypeError:undefined不是函数&#34;最后一行是&#34; hasClass(&#34; ShowError&#34;)。我怎样才能让它发挥作用?

1 个答案:

答案 0 :(得分:0)

hasClass不是expect()返回值的属性。因此undefined is not a function。你的代码应该是:

expect(input.eq(0).hasClass("showErr")).toBeTruthy();