'Heroku CI: ブラウザおよびユーザー承認テスト (UAT)'

この記事の英語版に更新があります。ご覧の翻訳には含まれていない変更点があるかもしれません。

最終更新日 2019年10月21日(月)

UAT/ブラウザテストは Heroku CI のベータ機能​です。

ブラウザのサポートは (機能を強化するための) 未発表の変更に従うものとし、UAT に対するサポートはベストエフォートの応答に制限されています。

ブラウザテスト/UAT について

Heroku CI は、テスト実行の dyno でブラウザをインストールするオプションを用意することによって、ブラウザテストまたは “ユーザー承認テスト” (UAT) に対するサポートを提供します。ユーザーは、新しい --headless​ フラグまたは Xvfb​ のどちらかでサポートされる Google Chrome の安定、ベータ、および不安定リリースチャネルのいずれかを選択できます。

ブラウザをインストールするためのオプションは用意されていますが、そのブラウザの起動は開発者の責任であることに注意する必要があります。各言語、Web フレームワーク、あるいはテストフレームワークには、ブラウザでテストを起動して実行する方法に関する独自の対処法がある傾向にあります (最も一般的には、これは Selenium で実行される)。これらのソリューションのほとんどは Heroku CI でサポートできます。以下では、すでにテストされ、実証されている UAT の技術スタックと設定を追加します。

使用可能なブラウザ

さまざまなニーズに対応できるブラウザをいくつか提供していますが、まず --headless​ がサポートされている Google Chrome を検討することを強くお勧めします。これは安定しており、かつユーザーのブラウザとの強い同等性があり、この種類のテストを可能にするように設計されています。

Google Chrome (--headless を使用)

Google Chrome では最近、--headless​ コマンドラインオプションのサポートが追加されました。つまり、ブラウザテストを実行するためにウィンドウサーバーは必要なくなりました。この設定は、ユーザーのブラウザを使用するが、内容を画面にレンダリングしてサイクルを浪費することのない UAT に最適です。そのため、これが当社の規定されたブラウザソリューションです。

Heroku CI の実行のためにヘッドレス Google Chrome を使用するには、その buildpack を app.json の environments.test.buildpacks​ セクションに追加します。たとえば、NodeJs のテストに Chrome を使用している場合は、次のようにします。

{
  "environments": {
    "test": {
      "buildpacks": [
        { "url": "https://github.com/heroku/heroku-buildpack-google-chrome" },
        { "url": "heroku/nodejs" }
      ]
    }
  }
}

これで、google-chrome​ (デフォルトでは安定リリースチャネル) がテスト実行で使用可能になり、自動的にヘッドレスモードで実行されます (--headless​ フラグが常に使用される)。詳細は、buildpack のドキュメント​を参照してください。

Google Chrome (Xvfb を使用)

Xvfb は、サポートが終了​している Cedar-14 スタックでのみサポートされます。Cedar-14 で実行されているアプリがある場合は、できるだけ早くサポートされているスタックにアップグレード​し、ヘッドレス Chrome (上記) を使用してください。

Google Chrome で --headless​ のサポートが追加される前、GUI なしで Google Chrome を実行する唯一の方法は Xvfb​ (X 仮想フレームバッファ) の使用でした。Xvfb​ では基本的に、Chrome でレンダリングできる仮想ディスプレイが作成されます。これはパフォーマンスに最適とはいえませんが、いくつかのテストツール (特に Selenium) とのより適切な相互運用性が提供されます。

Heroku CI の実行のために Xvfb を使用した Google Chrome を使用するには、その buildpack を app.json の environments.test.buildpacks​ セクションに追加します。たとえば、Ruby のテストに Chrome を使用している場合は、次のようにします。

{
  "stack": "cedar-14",
  "environments": {
    "test": {
      "buildpacks": [
        { "url": "https://github.com/heroku/heroku-buildpack-xvfb-google-chrome" },
        { "url": "heroku/ruby" }
      ]
    }
  }
}

これで、テスト実行の dyno で Xvfb​ ディスプレイが実行され、google-chrome​ (デフォルトでは安定リリースチャネル) が使用可能になります。google-chrome​ を実行すると、実行中の Xvfb​ ディスプレイが自動的に使用されます。詳細は、buildpack のドキュメント​を参照してください。

PhantomJS

​

PhantomJS は、NodeJS 上に構築されたヘッドレスブラウザです。コンパクトで、かつ Chrome よりインストールが簡単なため、長い間 UAT のための一般的な選択肢になっていました。PhantomJS を使用するように Heroku CI の実行を設定することは可能ですが、1) これがサードパーティの buildpack を使用してインストールされること、2) PhantomJS が保守されなくなったことの 2 つの理由から、現在は直接のサポートを提供していません。

Heroku CI の実行のために PhantomJS を使用するには、その buildpack を app.json の environments.test.buildpacks​ セクションに追加します。たとえば、Ruby のテストに PhantomJS を使用している場合は、次のようにします。

{
  "environments": {
    "test": {
      "buildpacks": [
        { "url": "heroku/ruby" },
        { "url": "https://github.com/stomita/heroku-buildpack-phantomjs" }
      ]
    }
  }
}

NodeJS を使用している場合は、代わりに phantomjs-prebuilt​ の使用を検討することもできます。

Selenium によるテスト

Heroku CI では、上記の Chrome buildpack を使用した Selenium によるテストがサポートされています。さらに、Heroku CI で Selenium を実行するには、次のものが必要になります。

  1. chromedriver - これは、言語またはフレームワークにすでにインストールされている可能性があります。そうでない場合は、chromedriver buildpack​ を参照してください。
  2. Selenium への言語バインディング - 選択されている言語によって異なります。
  3. chromedriver が正しい Chrome バイナリの場所を指すようにする特殊な設定 (詳細を参照)​。