使用して、要素を見つけることができません分度器/ジャスミン、おそらく私が取得しています

Question

SENDKEYエラー：

が失敗しました：いいえ要素が見つからないに関係なく、私はロケータ（I」のプログラミング方法

ロケータ

を使用していませんveはCSS、xpath、IDで何も試していません）。

私が使用しているWebページ：https://phptravels.org/clientarea.php?incorrect=true

を私は間違ったユーザー名とパスワードを入力した後、エラーメッセージを得ることができる必要があります。エラーメッセージは、CSSセレクタの.alert-danger.text-centerに格納されます。表示されるエラーは、「ログインの詳細が正しくありません。もう一度お試しください。

どのように書式を設定しても、同じ要素が見つかりませんでしたが、sendKeysを呼び出すと動作するように見えます。つまり、エラーメッセージのコード行を取り除くと、残りのプログラムはエラーなしで渡され、sendKeysは動作するはずですが、プログラムを実行するときに実際には何も入力されません（sendKey情報を入力してボタンをすばやくクリックしない限り、私はそれを見ることができませんが、なぜ残りのプログラムは高速ではありませんか？）。実際に要素が見つからないか、sendKeyエラーかどうかは分かりません。また、私はここでいくつかの答えを見てきましたが、いくつかのWait型ライブラリがありますが、私のプログラムでその情報を使用しようとすると、エラーが増えます。あなたはby.idロケータ内のCSSセレクタを使用しようとしている

// newSpec.js 

browser.waitForAngularEnabled(false); 

describe('Protractor Demo App', function() { 
it('should have a title', function() { 
browser.get('http://phptravels.com/demo'); 

expect(browser.getTitle()).toEqual('PHPTRAVELS | Demo'); 
}); 
}); 

describe('Login function', function() { 
it('should be able to login', function() { 
browser.findElement(by.linkText('Login')).click(); 
expect(element(by.xpath('//div[@class="login"]')).isPresent()); 

}); 
}); 



describe('Enter name', function() { 
var inputEmail = element(by.css('#inputEmail')); 
var inputPassword = element(by.css('#inputPassword')); 
var goButton = element(by.css('#login')); 

it('should be able to enter user name', function() { 
browser.get('https://phptravels.org/clientarea.php'); 

    inputEmail.sendKeys('Test Test'); 
    inputPassword.sendKeys('Password123'); 


    browser.sleep(500); 
goButton.click(); 
    browser.sleep(500); 

var errorMessage = element(by.id('#.alert.alert-danger.text-center')); 
expect(errorMessage.getText()).toEqual(' Login Details Incorrect. Please  try again. '); 

}); 
}); 

Answer 1

：

は、ここに私のコードです。

使用by.cssまたは$ショートカット：

var errorMessage = $('.alert.alert-danger'); 

あなたは、その後可能タイミングの問題に対処するためにExplicit Waitでそれを強制することができます

var errorMessage = $('.alert.alert-danger'); 

var EC = protractor.ExpectedConditions; 
browser.wait(EC.visibilityOf(errorMessage), 5000); 

expect(errorMessage.getText()).toEqual('Login Details Incorrect. Please  try again.'); 

私はまた、あなたがテスト内waitForAngularEnabled()を呼ぶべきだと思います自体。これは私のために働いているものです。

describe('Enter name', function() { 
    var inputEmail = element(by.css('#inputEmail')); 
    var inputPassword = element(by.css('#inputPassword')); 
    var goButton = element(by.css('#login')); 

    it('should be able to enter user name', function() { 
     browser.waitForAngularEnabled(false); 
     browser.get('https://phptravels.org/clientarea.php'); 

     inputEmail.sendKeys('Test@test.com'); 
     inputPassword.sendKeys('Password123'); 

     browser.sleep(500); 
     goButton.click(); 
     browser.sleep(500); 

     var errorMessage = $('.alert.alert-danger'); 
     expect(errorMessage.getText()).toEqual('Login Details Incorrect. Please try again.'); 

    }); 
}); 

---

「IDによる」ロケータ問題についての注意：

注意（恥知らずな自己宣伝）することを、あなたはずっとこの問題を捕まえていたかもしれません静的コード解析ツールESLintをeslint-plugin-protractor pluginと一緒に使用した場合は、by.idに渡された有効性がidであることを確認するvalid-by-id ruleがあります。