💯

Webdriver.ioという自動テストフレームワークはおすすめ 

2023/12/21に公開

この記事はQiita ソフトウェアテストのアドベントカレンダー 18日目の記事です

はじめに

  • e2eテストの検証の中で、Playwrightでもなく、Cypressでもなく、Seleniumでもない、すごくいいテストフレームワークのWebdriver.ioというものを発見したので普段Typescript, Javascript使いであればおすすめしたい。という思いでこの記事を記載します。

いいところ

開発元は OpenJS Foundationである

言語とエコシステムは JavaScriptとNode.jsベース

  • 開発元はOpenJS Foundationであるため、開発はJavaScriptとNode.jsのエコシステムを使用する。
    • フロントエンドエンジニアで最も馴染みがある言語での開発が可能
    • 当たり前だが、TypeScriptでの開発も可能

自動待機、待機処理、非同期処理が容易

  • 同一ページであれば、await を記載しておけば、自動待機してくれます。
  • Webdriver.io側で、色々なwait処理を容易してくれます。余計なsleep処理とかでごまかさないで安定的にテストを回すことができます
  • 非同期も async / awaitでの記載が可能
    • JavaScriptで実装するため、async / await構文をサポートしている

シンプルなアーキテクチャー

  • 別の記事にアーキテクチャーをまとめました。
  • セキュリティが厳しい職場で、e2eの実装に苦労しているところもWebdriver.ioであれば実装できるかもしれないです!検証してみてください!
  • Cypressとか、Playwrightなどの最近有名どころのテストフレームはwebsocketなどを採用しており開発者体験がすごく飛躍的にアップしております。またダッシュボードも用意していることでアーキテクチャーが複雑になっております。モダンな開発環境であれば、それでいいのですが今の職場ではCypress, Playwrightを採用するもの一苦労です。そうゆう職場はいっぱいあると思う!シンプルなアーキテクチャーが助かる職場もあるのです。

マルチブラウザ、複数のデバイスでのテストが可能

  • Chrome, Firefox, Safariのブラウザでテストが可能
  • iOS, Androidなどのモバイルテストも可能
  • これはすごくありがたい。想定ユーザーは色々なデバイス、色々なブラウザを使用します。想定されるデバイスとブラウザでテストができるのは品質保証の観点からとても有益!

どのテストフェーズでも活用ができる

  • e2e, unit test, component testもサポートされている
    • Vue, React Sveltなどのフレームワークのテスト環境のセットアップも簡単にできる

テストランナーも比較的(?)、触ったことがあるテストフレームワークから選択できる

  • Mocha, Jasmine, Cucumber

テスト結果の確認方法もリッチなものから、シンプルなものから選べる

コミュニティが活発

ちゃんとメンテナンスもされている

やっぱり検討する上で重要なことは、そのツールがちゃんとメンテナンスされているのかどうか!
大丈夫です!しっかりとメンテナンスされております!
今のバージョンはv8まで来ております!
頻繁にバグフィックスとか、New featureとかが取り込まれております!
github

わるいところ

なぜか認知度がない

今回、セキュリティがすっごく厳しい中、e2eテストの検証を行いました。最初はCypress, Playwrightでのテストを想定していたのですが、なかなかうまくいきませんでした。その中で他になにか実現できるものはないかと調べていたら、このWebdriver.ioにたどり着きました。調べていくうちにドキュメントもすごく充実して、これいいじゃん!ってなりました。

テストフレームワークにJestがない

なんでJestがないんだ!私はJestを使用したかった!

おわりに

日本での認知度がなさすぎて、逆にこれはチャンスだ!と思って最近、DeepLさんと協力して、このWebdriver.ioの翻訳活動しております。
お時間がある方は一緒に行いましょ!
正直当初は、Playwrightを使用してモダンを感じながら、かっこよくe2eテストの実装をしたかったのですが、その中でこのWebdriver.ioに出会って、ちょっと感動的な出会いになりました!これこそ人間万事塞翁が馬ですね!(ちがうな)
おわり

参考

https://webdriver.io/

https://openjsf.org/

Discussion