CI上でPlaywrightのテストが落ちたら確認すること

まだ Playwight に慣れていない人向けに CI 上でテストが落ちた場合、どのようなことを確認すると良いか書いた。

1. まずは CI のログを確認する。
   • Playwight 以外の原因でエラーが出ている場合がある。
   • 分からないと言われて確認すると、Playwight の実行時間が長く CI のタイムアウトに引っかかっていたり、前段の処理でエラーが出ていたことがあった。
2. Playwright のエラーが出ている場合は、どのようなエラーが出ているかを確認する。
3. Playwright のレポートを出力している場合は、レポートを確認する。
   • Github Actions の場合、公式通りの設定をしていればアーティストに出力されている。
   • https://playwright.dev/docs/ci-intro#setting-up-github-actions
4. 確認しても原因がわからない場合は、ローカルでテストを実行する。
5. 落ちているテストがローカルで Flaky でないかを確認する。
   • ローカルでも Flaky である場合、CI 上のマシンスペックによって落ちやすくなっている可能性がある。
   • この場合、まずは Flaky テストの改善を行うべきである。
6. ローカルでは安定してエラーが出ない場合は、CI の環境に問題がある可能性がある。CI の環境とローカルの環境を比較して、違いを確認する。
   • 特に CI 上かつ Webkit でのみ落ちている場合、Linux ランナーを利用していることに起因しており、macOS ランナーを利用することで解消する場合が度々ある。
7. ローカルでもエラーが出る場合は、UI モードや Debug モードを利用して、エラーが出ている際に画面やネットワークがどうなっているかを確認する。

1
# uiモードで起動する
2
npx playwright test --ui
3
# debugモードで起動する
4
npx playwright test --debug