Angularjs 具有表单验证的单元测试控制器

我有一张有一些验证的表格我如何对

hasFormError

函数进行单元测试。我使用它作为查看的辅助工具

例如，在我看来

  <div class='form-group' ng-class="{ 'is-invalid': exampleCtrl.hasFormError('card') }">
    <input type='text' ng-model='exampleCtrl.data.name' name='name' />
  </div>

单元测试

  describe('#hasFormError', function() {
    var form = '<form name="exampleCtrl.myForm">' +
      '<input name="exampleField" ng-model="test" /></form>';
    var $scope;

    beforeEach(inject(function($rootScope, $controller, $compile) {
      $scope = $rootScope.$new();

      ctrl = $controller('PlansCheckoutCtrl', {
        $scope: $scope
      });

      $compile(form)(scope);
      $scope.$digest();

    }));

    it('should', function() {
      ctrl.submitted = true;
      ctrl.hasFormError('exampleField');

      // returns TypeError: 'undefined' is not an object (evaluating '$scope.example.myForm')
    });

  });

描述（'hasFormError'，函数（）{
变量形式=“”+
'';
var$范围；
beforeach（注入函数（$rootScope、$controller、$compile）{
$scope=$rootScope.$new（）；
ctrl=$controller（'PlansCheckoutCtrl'{
$scope:$scope
});
$编制（表格）（范围）；
$scope.$digest（）；
}));
它（'should'，function（）{
ctrl.submitted=true；
ctrl.hasFormError（'exampleField'）；
//返回TypeError:“undefined”不是对象（计算“$scope.example.myForm”）
});
});

试试这种方法。您可以用这种方法验证表单。
不需要定义函数来测试表单的有效性

describe('#hasFormError', function() {

    var $scope,form,templateHtml,ctrl;


    beforeEach(module("hereisyourmodulename"));
    beforeEach(module("views/path/yourformhtml.html"), function () { // views/test/test.html

      });


    beforeEach(inject(function($rootScope, $controller, $compile,$templateCache) {
        $scope = $rootScope.$new();

        ctrl = $controller('PlansCheckoutCtrl', {
            $scope: $scope
          });

              templateHtml = $templateCache.get("views/path/yourformhtml.templateHtml"); //// views/test/test.html
            var template = angular.element("<div>" + templateHtml + "</div>")
            $compile(template)($scope);

            form = $scope.newuser;  // newuser is the form name
            $scope.$apply();

    }));

        it("\n\ncase 1  :    controller  defined \n", function () {
            expect(ctrl).toBeTruthy();
        });

       it("\n\ncase 2 :   here is the validation", function () {
            form.first_name.$setViewValue("RIy*");  //first_name is one of form value
            expect(form.first_name.$valid).toBeFalsy();
        });

  });

描述（'hasFormError'，函数（）{
var$scope，form，templateHtml，ctrl；
在每个（模块（“此处为您的模块名称”）之前；
beforeach（模块（“views/path/yourformhtml.html”），函数（）{//views/test/test.html
});
beforeach（注入函数（$rootScope、$controller、$compile、$templateCache）{
$scope=$rootScope.$new（）；
ctrl=$controller（'PlansCheckoutCtrl'{
$scope:$scope
});
templateHtml=$templateCache.get（“views/path/yourformhtml.templateHtml”）；///views/test/test.html
var template=angular.element（“+templateHtml+”）
$compile（模板）（$scope）；
form=$scope.newuser；//newuser是表单名称
$scope.$apply（）；
}));
它（“\n\n情况1:控制器定义的\n”，函数（）{
expect（ctrl.toBeTruthy（）；
});
它（“\n\n情况2：这是验证”，函数（）{
form.first\u name.$setViewValue（“RIy*”）；//first\u name是form value的一个
expect（form.first_name.$valid）.toBeFalsy（）；
});
});

下面的答案对你有用吗？或者你找到了另一种方法吗？@cusejuice，下面的答案对你有用吗

describe('#hasFormError', function() {

    var $scope,form,templateHtml,ctrl;


    beforeEach(module("hereisyourmodulename"));
    beforeEach(module("views/path/yourformhtml.html"), function () { // views/test/test.html

      });


    beforeEach(inject(function($rootScope, $controller, $compile,$templateCache) {
        $scope = $rootScope.$new();

        ctrl = $controller('PlansCheckoutCtrl', {
            $scope: $scope
          });

              templateHtml = $templateCache.get("views/path/yourformhtml.templateHtml"); //// views/test/test.html
            var template = angular.element("<div>" + templateHtml + "</div>")
            $compile(template)($scope);

            form = $scope.newuser;  // newuser is the form name
            $scope.$apply();

    }));

        it("\n\ncase 1  :    controller  defined \n", function () {
            expect(ctrl).toBeTruthy();
        });

       it("\n\ncase 2 :   here is the validation", function () {
            form.first_name.$setViewValue("RIy*");  //first_name is one of form value
            expect(form.first_name.$valid).toBeFalsy();
        });

  });