カスタムマッチャー

WebdriverIOは、Jestスタイルのexpectアサーションライブラリを使用しており、Webおよびモバイルテストの実行に特化した特殊機能とカスタムマッチャーが付属しています。マッチャーのライブラリは大きいですが、すべての状況に対応できるわけではありません。そのため、既存のマッチャーを独自に定義したカスタムマッチャーで拡張することができます。

警告

browserオブジェクトまたはelementインスタンスに固有のマッチャーの定義方法に現在違いはありませんが、将来変更される可能性があります。この開発に関する詳細については、webdriverio/expect-webdriverio#1408にご注意ください。

カスタムブラウザマッチャー

カスタムブラウザマッチャーを登録するには、スペックファイルで直接、またはwdio.conf.jsのbeforeフックの一部として、expectオブジェクトでextendを呼び出します。

customMatchers/example.ts

loading...

GitHubで表示

例に示すように、マッチャー関数は、期待されるオブジェクト（例えば、ブラウザまたは要素オブジェクト）を最初のパラメータとして、期待される値を2番目のパラメータとして受け取ります。その後、マッチャーを次のように使用できます。

customMatchers/example.ts

loading...

GitHubで表示

カスタム要素マッチャー

カスタムブラウザマッチャーと同様に、要素マッチャーも違いはありません。要素のaria-labelをアサートするためのカスタムマッチャーを作成する方法の例を次に示します。

customMatchers/example.ts

loading...

GitHubで表示

これにより、アサーションを次のように呼び出すことができます。

customMatchers/example.ts

loading...

GitHubで表示

TypeScriptサポート

TypeScriptを使用している場合は、カスタムマッチャーの型の安全性を確保するために、もう1つのステップが必要です。Matcherインターフェースをカスタムマッチャーで拡張することにより、すべての型の問題が解消されます。

customMatchers/example.ts

loading...

GitHubで表示

カスタム非対称マッチャーを作成した場合は、同様にexpectの型を次のように拡張できます。

declare global {
  namespace ExpectWebdriverIO {
    interface AsymmetricMatchers {
      myCustomMatcher(value: string): ExpectWebdriverIO.PartialMatcher;
    }
  }
}