WebのE2Eフレームワークの選び方

本記事はエムティーアイ Advent Calendar 2021の18日目の記事です。

Cypress、TestCafe、Playwright、CodeceptJSの4つのWebのE2Eテストフレームワークを選ぶ際の指針をまとめます。

まとめ

• 簡単にセットアップしたい、情報が豊富であることを求める → Cypress
• 実機でテストしたい → TestCafe
• WindowsでもSafari（WebKit）のテストがしたい、Web Componentsを使ったアプリを簡単にテストしたい → Playwright
• さまざまなタイプのプロダクトで共通したコードで管理したい → CodeceptJS

フレームワークごとの特徴

Cypress

Cypressは4つのフレームワークのなかで最も利用者が多いフレームワークです。
Cypressはセットアップが簡単です。必要な機能が1つのパッケージに用意されているのでブラウザやドライバを別途インストールする必要がありません。
利用者が多いので知見も多いです。なにか困ったときもGoogleで検索すれば解決方法が見つかる率は他のフレームワークに比べても断然高いです。

TestCafe

TestCafeは唯一実機でテストできるフレームワークです。
PCのブラウザだけでなくタブレットやスマホのブラウザでもテストができます。

Playwright

Playwrightは自前のChromium,Firefox,WebKitを用意したフレームワークです。
Windowsマシン上でもWebKitでのテストができる唯一のフレームワークです。
Shadow DOMへのアクセスも他のフレームワークより優れているので、Web Componentsを使ったアプリケーションのテストがしやすいという特徴があります。

CodeceptJS

CodeceptJSはE2Eフレームワークのラッパーライブラリです。
CodeceptJSで書いたコードをTestCafeやPlaywright、Puppeteer等で実行できます。

参考情報

• E2Eテストフレームワーク調査