如何測試不變所需的輸入控制的有效性

我有一個像這樣用模板組件：如何測試不變所需的輸入控制的有效性

<form class="form-horizontal" #privateEmailForm="ngForm" (ngSubmit)="onSubmit()"> 
    <div class="form-group"> 
     <label class="col-md-4 control-label text-left" for="tiNewEmail" >Email</label> 
     <div class="col-md-8"> 
      <input id="tiNewEmail" #tiNewEmail="ngModel" class="form-control input-md" 
        [(ngModel)]="newEmail" type="text" email required> 
      <span [shown]="tiNewEmail.invalid && (tiNewEmail.dirty || privateEmailForm.submitted)"></span> 
     </div> 
    </div> 

    <button type="submit" class="btn btn-red btn-lg" >Save</button> 
</form>

現在我有這個成分，這將檢查電子郵件驗證消息上寫單元測試顯示提交按鈕點擊後即使電子郵件輸入原始。問題是，在單元測試中，所有輸入和表單默認都是有效的。我不想像這裏建議https://stackoverflow.com/a/39918775/360171那樣從輸入發送事件，因爲我需要保持原始輸入控制。我發現，如果我派遣從組件的本地元素任何情況下，空所需的控制和形式變得無效：

debugElement.nativeElement.dispatchEvent(new Event('mouseover')); 
fixture.detectChanges();

至少，它爲我工作，但我不知道，有沒有一個更正確的方式來測試未觸摸的表單控件的有效性？

來源

2017-04-22 Yuriy Rozhovetskiy

您應該首先分配一個空值，然後您應該檢查是否顯示所需的錯誤消息。

debugElement.query(ByCss('#tiNewEmail')).nativeElement.value = ''

，如果錯誤消息作爲

expect(debugElement.query(ByCss('#tiNewEmail > span')).nativeElement.innerHTML).toBe('Required')

應用，你應該檢查

來源

2017-04-22 19:01:14 Aravind

如何測試不變所需的輸入控制的有效性

回答

相關問題