本文へスキップ

WebdriverIO V5がCucumberJSをサポート

·読了時間8分

WebdriverIO V5でCucumberJSのサポートを開始したことを嬉しくお知らせします!!!! これはプロジェクトコミッターにとって大きな課題でしたが、彼らが費やした時間と努力に感謝しています。

通常であれば

npm install @wdio/cucumber-framework --save-dev

と流れに沿って進めますが、今回は違います。Cucumberフレームワークの最新バージョンにアップグレードする際には、**WebdriverIOの最新バージョンにもアップグレードする**必要があります。このブログ投稿では、その方法に関するガイドラインを紹介します。

始め方

前述のように、WebdriverIOのバージョン5への移行も必要となるため、Cucumberフレームワークの最新バージョンへのアップグレードはそれほど単純ではありません。必要な作業を理解するために、移行を大幅に容易にする手順を作成しました。ただし、手順を説明する前に、WebdriverIO V4とWebdriverIO V5の違いを理解する必要があります。

NodeJSのサポート

WebdriverIOは現在、NodeJS 8以降が必要です。NodeJS 8は2019年末にLTSサポートを終了するため、10へのアップグレードをお勧めします。NodeJS LTSサポートの詳細については、こちらを参照してください。これは、同僚/DevOpsエンジニアを説得してNodeJSインスタンスをアップグレードするのに役立つ可能性があります。

補足として、NodeJSでデフォルトでサポートされている内容については、node.greenを確認し、今後の変更をすべて確認してください。

W3Cサポート

WebdriverIOは現在、W3Cプロトコルを完全にサポートしており、多くの利点がありますが、既存のスクリプトにはいくつかのマイナスの側面があります。マイナスの側面の1つは、ChromeDriver 74+などの最新のドライバではサポートされていないJSONWireプロトコルに基づくメソッドを使用している可能性があることです。これにより、browser.positionClick() is not a functionなどのエラーが発生する可能性があります。このエラーが表示された場合は、W3C対応ドライバでサポートされていないメソッドを使用しています。どのコマンドがWebDriverプロトコル(W3C)コマンドまたはJSONWireプロトコルコマンドであるかを確認するには、APIドキュメントのこちらを参照してください。

小さな補足ですが、すべてのbrowserコマンドとelementコマンドは、上記のリンクを参照して、プロトコルに依存しないように努めました。ここでの変更はありません。これがどのように機能するかについての洞察を提供するために、たとえばkeysコマンドを確認してください。両方のプロトコルのサポートがここにあります。

Sauce LabsやBrowserstackなどのクラウドベンダーでW3Cを使用する場合は、機能にベンダー固有のプレフィックスを使用する必要があります。必要な操作については、ベンダーのWebサイトを確認してください。

しかし、常に利点で終わる必要があります。したがって、W3Cを使用すると、ブラウザがWeb自動化の共通Web標準に従うことがわかります。これにより、WebdriverIOは信頼性の高いフレームワークを構築できます。そして最後に、すべてのブラウザベンダーからのW3Cサポートにより、Appiumのサポートも向上しました。Appleの最新の投稿はこちら。したがって、W3Cは私たち全員にとって大きな一歩です!!

コマンドの変更

長年にわたり、WebdriverIOはさまざまな自動化プロトコルについて、パターンを適用せずにコマンドを追加し続け、重複と名前の一貫性のなさが発生しました。リストは膨大に見えますが、変更されたコマンドのほとんどは内部で使用されていました。すべての変更を確認するには、V5の変更ログを確認してください。

破壊的変更

より良い製品を作成し、メジャーバージョンをリリースする場合、常に破壊的変更が発生します。繰り返しになりますが、V5の変更ログを確認して、すべての破壊的変更を確認してください。

V5.0.0リリースの変更だけでなく、それ以降の変更も読んでください!

進化したのはWebdriverIOだけではありません!

@wdio/cucumber-frameworkの最新バージョンを使用する場合は、Cucumberの最新バージョンも取得します。**つまり、CucumberJS 2とCucumberJS 5の間の破壊的変更も確認する必要があります。**CucumberJSで何が変更されたかを確認するには、バージョン3から5までのCucumberJSの変更ログを確認してください。

移行手順

V4とV5の違いについてはこれくらいにして、以下の手順に従って移行をスムーズに進めてください。これらの手順の背後にある考え方は、小さなステップで移行することです。小さなステップで実行する利点は、コードをもう一度確認して、リファクタリングしたり、不要な重複コードや見にくいコードを削除したりする時間があることです。

1. クリーンなプロジェクトから始める

新しいプロジェクトを作成し、古いプロジェクトに簡単にコピーして、機能ファイル1つとそのステップをシナリオごとに移行することをお勧めします。これを行うと、古いプロジェクトでシナリオを簡単に無効にし、新しいプロジェクトで移行された新しいテストを実行し、パイプラインに組み込むことさえできます。

依存関係をインストールする前に、空のNPMプロジェクトを初期化する必要があります(これにより、CLIを使用して必要な依存関係をローカルプロジェクトにインストールできます)。これを行うには、次を実行します。

mkdir webdriverio-test && cd webdriverio-test
npm init -y

-yはすべてのプロンプトに「はい」と答えるため、標準のNPMプロジェクトが作成されます。独自のプロジェクトの詳細を指定する場合は、-yを省略しても構いません。

2. WebdriverIO CLIのインストール

多くの便利な機能が付属しており、作業を容易にするため、テストランナーを使用することをお勧めします。WebdriverIO v5以降、テストランナーは@wdio/cli NPMパッケージに移動しました。

次に、CLIをインストールする必要があります。次を実行してインストールします。

npm i --save-dev @wdio/cli

3. 設定ファイルの生成

次に、すべてのWebdriverIO設定を保存する設定ファイルを作成します。これを行うには、設定ユーティリティを実行するだけです。

npx wdio config

質問インターフェースが表示されます。これにより、設定を簡単かつ迅速に作成し、必要な依存関係をすべてインストールできます。ファイルを確認し、コメントを読んでください。いくつかの点が変更されているため、それらを読むと、設定ファイルで何が変更されたかを理解するのに役立ちます。

注記: cucumberOptsでコンパイラを使用していた場合、CucumberJSがcompilerを削除したことに注意が必要です。これは、WebdriverIOがこのオプションを提供できないことを意味しますが、勤勉な貢献者から期待されるように、別の解決策があります。コンパイラを使用する新しい方法については、BabelまたはTypeScriptをご確認ください。

4. 同じフォルダ構造を作成する

すべてが設定されたので、プロジェクト内にあるものと同じフォルダ構造を作成することをお勧めします。

ファイルをコピーしないでください。フォルダ構造のみコピーしてください。

5. feature ファイルを1つずつ移行する

フォルダ構造ができたら、**1つのfeatureファイル**を新しいプロジェクトにコピーします。最も簡単なファイルから始め、複数のシナリオが含まれている場合は、すべてのシナリオをコメントアウトして1つだけ有効にしてください。次に、その特定のシナリオに属するステップ(実装に属するすべてのpageobjectを含む)を新しいプロジェクトに移行します。要素の選択など、WebdriverIOには破壊的変更があることに注意してください(上記を参照)。CucumberJSのdefineSupportCodeを使用していた場合は、CucumberJSのV4の変更ログを確認してください。これは現在非推奨です。

各シナリオについて、ステップごとに移行します。問題が発生した場合は、それらを修正して続行してください。そして、過去に自分または同僚が作成したかもしれないコーディングの混乱を整理することを忘れないでください。

6. 完了したら

クリーンなプロジェクトを作成したので、次のことができます。

  1. 古いプロジェクトからすべてのWebdriverIO V4依存関係を削除します。
  2. 新しいプロジェクトからすべての依存関係を古いプロジェクトにコピーします。
  3. テスト関連のすべてのファイルを削除します。
  4. すべての新しいテスト関連ファイルをプロジェクトにコピーします。

これで完了です。祝勝会を開きましょう。

サポート

サポートが必要な場合は、コミュニティのDiscordサーバーでヘルプを見つけることができます。サポートを依頼する際には、問題の詳細な説明、既に実行した手順などを提供していただくようお願いいたします。そうでなければ、干し草の山から針を見つけるように頼むことになり、それは非常に困難な作業になります。

楽しいテストを!

敬具、

ブルーガイ

ようこそ!お手伝いできますか?

WebdriverIO AI Copilot