web-dev-qa-db-ja.com

Protractorを使用してclassNameでボタンを見つける

これが初心者の質問である場合は、Webオートメーションテストから始めて申し訳ありません。

ログイン画面のページをテストしたい。名前とパスワードのテキストフィールドを見つけるのは簡単でした（by.modelを使用しただけです）、スクリプトでログインボタンを見つけるのに問題があります。

私はググって、element（by.css（.className））を使用してclassNameで要素を見つけることができるはずですが、これは機能せず、常にNoSuchElementError: No element found using locator: By.cssSelector(".btn btn-lg btn-primary btn-block")を取得しています。

私が間違っていることは何か考えていますか？

よろしくお願いいたします。

LoginBtn HTML：

<button class="btn btn-lg btn-primary btn-block" type="submit" ng-disabled="loading">login</button>

マイコード：

describe('Test login', function() {
  var username = element(by.model('formData.email'));
  var password = element(by.model('formData.password'));
  var loginBtn = element(by.css('.btn btn-lg btn-primary btn-block'));


  beforeEach(function() {
    browser.get('some site'); //hidden on purpose
  });

  it('should have a title', function() {
        username.sendKeys(1);
        password.sendKeys(2);
        loginBtn.click();


  });


});
javascriptangularjsjasmineprotractor
12
r3x

複数のクラスをチェックする場合は、クラスをドットで区切ります。

by.css('.btn.btn-lg.btn-primary.btn-block')

しかし、テキストでボタンを見つけます-より信頼性が高く、読みやすく見えます：

by.xpath('//button[. = "login"]')

また、テストプロセスを容易にするために、ボタンにid（これが管理下にある場合）属性を割り当てることを検討してください。

<button id="submitButton" class="btn btn-lg btn-primary btn-block" type="submit" ng-disabled="loading">login</button>

その後、次のように簡単になります。

by.id('submitButton')
20
alecxe

ロケータを見つけるために1つのクラスのみを使用することもできます

by.css('.btn-primary')

クラス名で

by.className('btn-primary')

4
Adnan Ghaffar