Protractorの小ネタ

AngularJSリファレンスの落ち穂拾いその3ということで、今回はProtractorの小ネタを紹介したいと思います。

手前味噌ですが、Protractorの説明についてはこちらをごらんください。

• Protractor: AngularJSの次世代E2Eテストフレームワーク

AngularJSの処理の完了を待たない

Protractorには、browser.waitForAngularというAPIが用意されています。
このAPIを呼び出すと、AngularJSの描画処理や、$httpによる通信処理、$timeoutによるタイムアウト待ち処理などが完了するまで待つことができます。

Protractorは、要所要所で内部的にこのbrowser.waitForAngularを呼び出しています。
これによりテストを書く人は、AngularJSの処理が完了するまで待つという処理を書く必要がなくなるのでとても便利です。

一方、処理が完了するまで待たれると困る場合もあります。
例えば、一定時間が経過すると表示が消えるトーストUI($timeoutを利用)をテストしたいときに、ProtractorのAPIを呼び出すと、トーストの表示が消えるまで処理が返ってきません。そのためトーストが表示されているかどうかをテストできなくなってしまいます。

そのような場合は、browser.ignoreSynchronizationをtrueに設定することで処理の完了を待たないようにすることができます。

browser.ignoreSynchronization = true;

ブラウザのコンソールログを取得する

Protractorネタというよりも、WebDriverネタかもしれません。

次のようにafterEachでログの長さが0であることを確認すれば、テストを実行したときに変なログが出力されていないかチェックすることができます。

afterEach(function () {
  browser.manage().logs().get('browser').then(function (browserLog) {
    expect(browserLog.length).toEqual(0);
  });
});

なお、IEではこの処理が動かないようなのでご注意を。

IEでProtractorのテストを実行する

これもProtractorネタというよりもWebDriverネタですが、Windows + IE11でProtractorを動かすのに苦労したので、紹介しておこうと思います。

まずは、下記のサイトからIEDriverServerをダウンロードします。

• http://selenium-release.storage.googleapis.com/index.html

そして、解凍したファイルのパスを環境変数PATHに追加します。
なお、64bit OSを利用している場合に、64bit版のIEDriverServerを利用すると、element.sendKeysがとても遅くなる問題があるようです。その場合は、32bit版のIEDriverServerを利用するといいみたいです。

つづいて、下記のWikiの内容に従ってIEの設定をおこないます。

• Internet Explorer Driver

1. レジストリの追加をおこないます(IE11の場合のみ必要)。
2. IEの「インターネットオプション」→「セキュリティ」→「保護モードを有効にする」のチェックをすべてのセキュリティゾーンの設定で無効にします。
3. 拡張保護モードを無効にします。
4. IEを再起動します。
5. IEの「インターネットオプション」→「セキュリティ」の「信頼済みサイト」にテスト対象のホスト名を追加します。(localhostの場合は不要)

そして、設定ファイルのbrowserNameをieに設定します。

protractor.conf.js

exports.config = {
  seleniumAddress: "http://localhost:4444/wd/hub",
  capabilities: {
    browserName: "ie"
  },
  specs: ["*_spec.js"],
  baseUrl: 'http://localhost:9000/',
  framework: "jasmine",
  jasmineNodeOpts: {
    showColors: true
  }
};

あとは、いつもどおりProtractorを実行するだけ。