角度単位テストでng-patternを検証する

Question

私は以下のHTMLを持っており、スイッチケースで動的に読み込まれます。このために個別の指令を作成する必要はなかったため、このようにすることにしました。私がやりたいどのような次のユニットテスト

describe('form', function() { 
    rootScope.selectedCriterion = { regexPattern: '[0-5]+' }; 

    it('allows numbers to be filled in the input field', function() { 
     var compiledElement = $compile(html)(rootScope); 
     rootScope.$apply();  
     var form = rootScope.form; 
     var inputElement = compiledElement.find('input[name="number"]'); 

     inputElement.val(4).triggerHandler('input'); 
     rootScope.$digest(); 

     expect(inputElement.val()).toEqual('4'); 
     expect(form.$valid).toEqual(true); 

     inputElement.val(8).triggerHandler('input'); 
     rootScope.$digest(); 

     expect(inputElement.val()).toEqual('8'); 
     expect(form.$valid).toEqual(false); 
    }); 
}); 

と

<li ng-form="form"> 
    <input name="number" type="number" ng-model="selectedCriterion.valueFrom" ng-pattern="selectedCriterion.regexPattern"> 
</li> 

はE2Eテストレベルでは、ユニットテストでNGパターンをテストしていないです。 テストが最後の期待

expect(form.$valid).toEqual(false); 

で失敗私が私のHTMLをコンパイルし、手動でサイクルを消化$を呼び出すにもかかわらず、フォームがこのレベルに自分自身を検証することができないようです。

私は間違っていますか？このレベルのフォームを検証できますか？

編集：私は集中的にStackOverflowとGoogleを検索して回答を得ました。

Answer 1

問題が見つかりました。 vbuhlevと同じように、私のコードはうまくいきましたが、まずは私のためではなかったのは、入力要素に余分な属性があったからです。 私の実際の入力要素は、デバウンスオプションだった：

<input name="number" type="number" ng-model="selectedCriterion.valueFrom" ng-pattern="selectedCriterion.regexPattern" ng-model-options="{debounce: 200}" > 

カルマは、デフォルトでは、このことを考慮していなかったが、私のフォームが終了するのデバウンスを待たずに「有効」であったことを見て、ちょうどに行ってきました。 私は

$timeout.flush() 

これでまだ保留されたすべてのタスクをフラッシュすることによって、これを解決し、すぐにフォームの妥当性をチェックする前にデバウンスを実行します。

ここでは、ファックとしてスムーズに実行！あなたはより多くの情報を与える必要が

Answer 2

コードは正しいです！

私はあなたのテストを孤立させて試してみました。本質的にそれはあなたと同じです。

'use strict'; 

describe('form', function() { 

    it('allows numbers to be filled in the input field', inject(function($compile, $rootScope) { 
     var html = '<li ng-form="form">' 
      + '<input name="number" type="number" ng-model="selectedCriterion.valueFrom" ng-pattern="selectedCriterion.regexPattern">' 
      + '</li>'; 

     $rootScope.selectedCriterion = { regexPattern: '[0-5]+' }; 
     var rootScope = $rootScope; 

     var compiledElement = $compile(html)(rootScope); 
     rootScope.$apply();  
     var form = rootScope.form; 
     var inputElement = compiledElement.find('input[name="number"]'); 

     inputElement.val(4).triggerHandler('input'); 
     rootScope.$digest(); 

     expect(inputElement.val()).toEqual('4'); 
     expect(form.$valid).toEqual(true); 

     inputElement.val(8).triggerHandler('input'); 
     rootScope.$digest(); 

     expect(inputElement.val()).toEqual('8'); 
     expect(form.$valid).toEqual(false); 
    })); 
}); 

あなたには他のコードがあります。より多くの文脈を与える必要があります。