分度器を使用して検証エラーメッセージ要素をテストできません

Question

ログイン用にe2eテストを作成しようとしていますが、このエラーメッセージのチェックに問題があります。

スクリーンショット：

エラーメッセージ：失敗

：ロケータを使用して見つかりません要素：により（CSSセレクタ、* [idは= "確認"]）

e2eテストがchromeで実行されているときにエラーメッセージが表示されないようです。

マイコード：

//login.po.ts 
 

 
validationMessage() { 
 
     return element(by.id('validation')); 
 
    } 
 

 
//login.e2e-spec.ts 
 

 
it('should not login with wrong email and password',() => { 
 
     page.navigateTo(); 
 
     page.inputLogin().sendKeys(fakeLogin); 
 
     expect(page.buttonSubmit().isEnabled()).toBe(false); 
 
     page.inputPassword().sendKeys(fakePass); 
 
     expect(page.buttonSubmit().isEnabled()).toBe(true); 
 
     page.buttonSubmit().click().then(() => { 
 
      browser.wait(protractor.ExpectedConditions.visibilityOf(page.validationMessage()), 5000); //If the error span takes time to be visible, use wait() function 
 
      expect(page.validationMessage().getText()).toEqual('User not found'); 
 
     });

私のHTMLコード：

<div *ngIf="!submitted"> 
 
    <h1 class="inner-main-title">Login</h1> 
 
    <form novalidate (ngSubmit)="login()" [formGroup]="signinForm"> 
 
     <md-input-container> 
 
      <input mdInput placeholder="E-Mail" formControlName="email" type="email" required/> 
 
     </md-input-container> 
 
     <app-control-messages [control]="signinForm.controls.email"></app-control-messages> 
 
     <md-input-container> 
 
      <input mdInput placeholder="Password" formControlName="password" type="password"/> 
 
     </md-input-container> 
 
     <div *ngIf="formErrors" class="validation-message"> 
 
      <h3 class="error-message" [innerHTML]="formErrors" id="validation"></h3> 
 
     </div> 
 
     <div class="link"><a routerLink="./account-recovery">Forgot password?</a></div> 
 
     <button id="login-button" class="cta-green" type="submit" md-raised-button [disabled]="!signinForm.valid" 
 
       color="primary">login 
 
     </button> 
 
    </form> 
 
</div> 
 
<div *ngIf="submitted"> 
 
    <h1 class="inner-main-title">Please wait...</h1> 
 
    <md-spinner></md-spinner> 
 
</div>

Answer 1

はすでにそれを解決しました。

問題が発生してページが完全にロードされるのを待っていませんでした。

browser.waitForAngular（）;そのコンテンツを完全にロードしないでリダイレクトするページを待つだけです。 browser.sleep（1000）を追加すると問題が解決しました。状況によっては、待ち時間が非常に長くなります。ここで

は、コードを働いている：

it('should not login with wrong password',() => { 
    page.navigateTo(); 
    page.inputLogin().sendKeys(fakeLogin); 
    expect(page.buttonSubmit().isEnabled()).toBe(false); 
    page.inputPassword().sendKeys(fakePass); 
    expect(page.buttonSubmit().isEnabled()).toBe(true); 
    page.buttonSubmit().click().then(() => { 
     browser.waitForAngular(); 
     browser.sleep(1000); 
     expect(page.validationMessage().isDisplayed()).toBe(true); 
    }); 

は、それが他の誰かに役立ちます願っています。