Avaをテストランナーとして使用する

概要

Avaは、簡潔なAPIを持ち、新しい言語機能を取り入れ、詳細なエラー出力とプロセス分離を備えたNode.js用のテストランナーです。Avaは主にユニットテストの実行に使用されますが、主要なすべてのブラウザーでWebアプリケーションに対する自動化されたエンドツーエンドテストを実行するための統合テストフレームワークとして機能するように、Nightwatch.jsで構成できます。

設定と例

ステップ0：Nightwatchのインストール

ガイドに従うか、ビデオを見て、Nightwatchを最初からインストールしてください。

ステップ1：Avaのインストール

npm i ava --save-dev

そして、avaテストを実行するために、package.jsonファイルに次のスクリプトが含まれていることを確認してください。

{
 "scripts": {
   "test": "ava"
 }
}

ステップ2：Avaの設定

package.jsonファイルで、またはava.config.jsファイルを作成して、すべてのCLIオプションを構成できます。詳細については、ガイドに従ってください。

{
    "ava": {
        "files": [
            "test/**/*",
            "!test/exclude-files-in-this-directory",
            "!**/exclude-files-with-this-name.*"
        ],
        "match": [
        //	"*oo",
        //	"!foo"
        ],
        "concurrency": 5,
        "failFast": true,
        "failWithoutAssertions": false,
        "environmentVariables": {
            "MY_ENVIRONMENT_VARIABLE": "some value"
        },
        "verbose": true,
        "nodeArguments": [
            "--trace-deprecation",
            "--napi-modules"
        ]
    }
}

ステップ3：AvaのNightwatch環境セットアップ

Avaと互換性を持たせるために、Nightwatchの環境を作成する必要があります。_setup-nightwatch-env.jsファイルを作成し、テストファイルに含まれていることを確認する必要があります。

const Nightwatch = require('nightwatch');

const createNightwatchClient = function({
  headless = true,
  browserName = undefined,
  silent = true,
  verbose = false,
  output = true,
  env = null,
  parallel = false,
  devtools = false,
  debug = false,
  persistGlobals = true,
  configFile = './nightwatch.conf.js',
  globals = {},
  webdriver = {},
  timeout = null,
  enableGlobalApis = false,
  reporter = null,
  alwaysAsync = true,
  desiredCapabilities = {}
} = {}) {

  const client = Nightwatch.createClient({
    headless,
    browserName,
    reporter,
    env,
    timeout,
    parallel,
    output,
    devtools,
    debug,
    enable_global_apis: enableGlobalApis,
    silent: silent && !verbose,
    always_async_commands: alwaysAsync,
    webdriver,
    persist_globals: persistGlobals,
    config: configFile,
    globals,
    desiredCapabilities
  });

  client.updateCapabilities(desiredCapabilities);

  return client.launchBrowser();
};

module.exports = async (t, run) => {
 global.browser = await createNightwatchClient();
 try {
   await run(t);
 } finally {
   await global.browser.end();
 }
};

Nightwatchオプション

Nightwatchのデフォルトの動作は、次の構成オプションのいずれかを指定することで変更できます。以下は、使用可能なオプションとそのデフォルト値のリストです。

名前 タイプ 説明 デフォルト
headless Boolean Nightwatchをヘッドレスモードで実行します（Firefox、Chrome、Edgeで利用可能）。 true
browserName String 使用するブラウザ名。利用可能なオプションは、chrome、firefox、edge、safariです。 なし
baseUrl String .navigateTo()で相対URLを使用する場合に使用するベースURL。コンポーネントテストを実行する場合は、Vite開発サーバーを実行しているURLに設定する必要があります。 http://localhost:3000
verbose Boolean 完全なNightwatch httpログを有効にします。 false
output Boolean Nightwatchの出力を表示します。 true
env String nightwatch.conf.jsから使用するNightwatchテスト環境。Nightwatchドキュメントのテスト環境の詳細をご覧ください。 なし
parallel Boolean テストを並行して実行する場合は、これをtrueに設定します。 false
devtools Boolean Chromeのみ：Chrome DevToolsを自動的に開きます。 false
debug Boolean コンポーネントテストのみ：コンポーネントのレンダリング後にテストの実行を一時停止します。 false
autoStartSession Boolean Nightwatchセッションを自動的に開始します。これが無効になっている場合は、テストでjestNightwatch.launchBrowser()を呼び出す必要があります。 true
persistGlobals Boolean 実行間で同じグローバルオブジェクトを保持するか、各テストごとに（ディープ）コピーを作成します。Nightwatchドキュメントのテストグローバルの詳細をご覧ください。 true
configFile String 使用するNightwatch構成ファイル。構成ファイルはデフォルトで自動生成されますが、これにより変更できます。NightwatchドキュメントのNightwatch構成の詳細をご覧ください。 ./nightwatch.conf.js
globals Object Nightwatchで使用されるグローバルのリスト。グローバルはbrowser.globalsで利用できます。NightwatchドキュメントのNightwatchテストグローバルの詳細をご覧ください。 なし
webdriver Object Nightwatch Webdriverサービスを構成するためのWebdriver関連設定のリスト。NightwatchドキュメントのNightwatch webdriver設定の詳細をご覧ください。 なし
timeout Number アサーションが失敗する前に、アサーション再試行のグローバルタイムアウトを設定します。 5000
enableGlobalApis Boolean NightwatchグローバルAPI（element（）、expect（））はデフォルトで無効になっています。 false
desiredCapabilities Object 現在のセッションのカスタムSelenium機能定義します。Nightwatchドキュメントで使用されている特定のブラウザドライバの詳細をご覧ください。 なし
setup() Function Nightwatchが起動された後に追加のセットアップフックを実行します。 なし
teardown() Function Nightwatch APIオブジェクトで実行される追加のティアダウンフック。 なし

ステップ4：テスト例の実行

以下のテスト例を検討してください。

const test = require('ava');
const await_nightwatch_browser = require('../../../_setup-nightwatch-env.js');

test('duckduckgo example', await_nightwatch_browser, async function(t) {
 browser
   .navigateTo('https://www.ecosia.org/')
   .waitForElementVisible('body')

 const titleContains = await browser.assert.titleContains('Ecosia');
 t.is(titleContains.passed, true);

 const visible =  await browser.assert.visible('input[type=search]')
 t.is(visible.passed, true);

 t.pass();
});

テストを実行するには、次のコマンドを使用できます。

npm test

または

npx ava

注：Avaには異なる命名規則があるため、テストがこのガイドに従っていることを確認する必要があります。

ステップ5：Avaテストランナーの結果を表示する

関連記事