web-dev-qa-db-ja.com

分度器を使用して、AngularJS以外のページでログインをテストします

GitHubでoAuth SSOを使用して認証するAngularJSアプリがあります。分度器を使用してログインテストを自動化する方法を見つけようとしています。角度のないものを取得する方法がわかりません。フィールドと、ページがロードされるのをbrowser.driverで待機する方法を管理する方法、私の仕様は次のようになります。

// Create a repository                                                                                                                     
describe('login', function() {

  it('should login', function() {
      // this issues a redirect to GitHub
      browser.driver.get( process.env.Host + '/auth/github' ) 
      browser.sleep( 4000 ); // Sleep to make sure page loads fully..                                                                      
      // browser.debugger(); // tried to use debugger...                                                                                   
      var login = element( by.id( "login_field" ) );
      login.sendKeys( process.env.USERNAME );
      var password = element( by.id( "password" ) );
      password.sendKeys( process.env.PASSWORD )
  });                                                                                                                                      
});

次のようなコマンドを実行します。

Host=http://someserver.com.dev USERNAME=foobar PASSWORD=barfoo protractor config/protractor.conf

認証ページを適切にロードし、フィールドに正しい情報を入力してから、Angularizedアプリケーションにリダイレクトされるのを待つにはどうすればよいですか（そこから処理できます）。

デバッガーを使用してこのコードにジャンプしようとしましたが、直感的ではありませんでした。デバッガーがブロックされたとき、私はコード内ではなく、cli.js内にいるように見えました。 'c'を押すと、スクリプトは実行まで続き、それ以上ブロックせずに失敗しました。スクリプト内でデバッガコマンドを使用する場所を誤解していますか？そして、Chromeインスペクターからwindow.clientSideScripts.findInputsを使用したかったのですが、そこでも阻止されました。これらはAngularJS要素用であり、角度付けされていない要素用のようです。

javascriptangularjsprotractor
13
xrd

分度器で角度のないページをテストすることは、物事を待つことに関して難しい場合があります。

分度器を 最新 （現在は1.5.0）にアップグレードし、 カスタム関数waitReady（） を使用して、準備ができている要素にbrowser.waitを使用し、テストを書き直すことをお勧めします。以下のように。

// TODO: use page objects
var loginNameInputElm = $('#login_field'); // or element(by.id('login_field'))
var passwordInputElm = $('#password'); // same as element(by.id('password'))
var loginBtnElm = $('button[type=submit]');

it('non-angular page so ignore sync and active wait to load', function() {
    browser.ignoreSynchronization = true;
    browser.get(process.env.Host + '/auth/github');
    expect(loginNameInputElm.waitReady()).toBeTruthy();
    expect(passwordInputElm.waitReady()).toBeTruthy();
});

it('should fill user and password and logins', function() {
    loginNameInputElm.sendKeys(process.env.USERNAME);
    passwordInputElm.sendKeys(process.env.PASSWORD);
    loginBtnElm.click();
});

it('restores ignore sync when switching back to angular pages', function() {
    browser.ignoreSynchronization = false; // restore
    browser.get('/some-angular-page');
});

waitReadyここ の理由の詳細。

注：過去に、暗黙的に高い設定を提案しました。

browser.manage().timeouts().implicitlyWait(5000);

そのhackにより、waitReadyを回避し、標準を使い続けることができます

expect(loginNameInputElm.isPresent()).toBeTruthy();

ただし、要素[〜＃〜] not [〜＃〜]が存在するかどうかをテストする場合、つまり、その場合、ベーンで5秒（5000ms）待機します。するとき

expect(someNonExistingElm.isPresent()).toBeFalsy();
26
Leo Gallucci