見出し画像

JUnit XMLによる自動テストレポート-Playwright + Gitlab編 Day.12

★SHIFTGroup技術ブログ(公式note)でアドベントカレンダー★
SHIFT公式ブロガーによるブログ版アドベンドカレンダーで、SHIFTらしい多彩な最新記事をクリスマスまでの25日間に毎日お届けします!
まとめ記事も公開中
SHIFT公式アドカレ2023まとめ記事
SHIFT公式アドカレ2022はじめます
SHIFTGroup技術ブログTOP

昨日の記事は、
AnsibleでAWS EC2のfstabを正しく作成する方法でした。
いかがでしたか?さて本日はこちら!


はじめに

みなさんこんにちは。SHIFTの牧野です。
自動テストの効果的な導入は、プロジェクトの品質向上や開発効率の向上につながります。この記事では、JUnit XMLによる自動テストの結果をGitLabに統合する手法について解説します。なぜこの取り組みが重要であるか、そしてどのような課題に対処し、どのような利点があるのかについて説明します。

今回はPlaywrightによるE2E自動テストを行い、テスト結果としてJUnit XMLを出力、Gitlab CIのTestsビューにてレポートするというシナリオにて解説します。


背景とモチベーション


テスト結果の閲覧という手間

コンソール出力を読み解くなどの手法では、テスト結果の追跡や管理が手動で行われ、効率が低下しています。また、CI/CDパイプラインに統合した場合はさらに複雑になり、失敗したテストの発見などの解析・追跡がスムーズに進まないことがあります。

期待する成果

この取り組みにより、以下のような利点が期待できます。

  1. 効率的なテスト結果管理: JUnit XML形式の利用により、テスト結果の管理が効率的に行えます。各テストケースの実行結果が明確になり、問題の早期発見が可能です。

  2. CI/CDパイプラインの向上: GitLab CIとの統合により、各コミットやマージリクエストにおけるテスト結果が視覚的かつ即座に確認できます。これにより、開発プロセスが迅速に進むでしょう。

JUnit XML


自動テストにおいて、テストの結果を可視化し、分析するためのデファクトスタンダードと言えば、まさにJUnit XMLです。

素晴らしいですよね。今でもJUnit XMLが標準的な形式として利用され、何年経っても健在で、このフォーマットを利用できるツールが多数作成されています。多くのCIプラットフォームでも、このJUnit XMLを使ってテスト結果を素晴らしいビューで表示できるようになっています。

GitlabもJUnit XMLを利用してテスト結果を一覧表示し、成功率や実行時間等のメトリクスを表示する「テスト」タブ機能を備えています。

JUnit XMLの出力


Playwrightはテスト結果をJUnit XMLとして出力することが可能です。Playwrightドキュメントに詳細が記載されています。

playwright.config.tsファイルのdefineConfig.reporterメンバに'junit', {outputFile: 'results.xml'}を追加するか、npx playwright test --reporter=junitコマンドを使用します。

個人的には設定ファイルに直接書き込むことが多いので、今回は前者の例を示します。私の好みなので、実行時に設定しても構いません。

export default defineConfig({
  // 他の設定...
  reporter: [['junit', { outputFile: 'results.xml' }], ['html']],
  // 他の設定...
});

GitLab CIの設定


GitLabでは、JUnit XMLの出力を活用する方法が提供されています。GitLabドキュメントを参照してください。

GitLab CIの設定においては、artifacts以下が重要です。reportsにJUnit XMLのパスを指定することで、各パイプラインの「テスト」タブにレポートが表示されるようになります。

JUnit XMLのパスが分からない場合は、先程の設定ファイルに記載したdefineConfig.reporterのoutputFileで指定したファイルを探してみてください。

stages:
  - test

tests:
  stage: test
  image: mcr.microsoft.com/playwright:v1.39.0-jammy
  script:
    - npm install @playwright/test
    - npx playwright test
  artifacts:
    reports:
      junit: results.xml

テスト結果の出力例


パイプラインをクリックし、テストタブを選択するだけで各テストの結果が閲覧できます。

Playwrightはhtmlレポートを出力する機能を備えていますが、CI上で確認する際にはアーティファクトとして保存されたファイルをたどる必要があり、テスト結果を即座に確認する際に若干の手間があります。この方法は多くのCIプラットフォームにてテスト結果を最速で閲覧するための、最も簡単な方法となるでしょう。

これにより失敗したテストを見つけるまでの手間は予想以上に簡単かつ高速になり、CIトラブルのストレスが軽減できます。
ぜひ試してみてください。


執筆者プロフィール:牧野 真哉
自動テストで生計を立てています

★★SHIFT公式ブログでアドベントカレンダー★★
明日の記事は、
『アジャイルジャパン2023に参加レポ=人生初のオンラインイベント参加で私が感じたこと学べたこと、まとめ』
お楽しみに!


お問合せはお気軽に

SHIFTについて(コーポレートサイト)
https://www.shiftinc.jp/

SHIFTのサービスについて(サービスサイト)
https://service.shiftinc.jp/

SHIFTの導入事例
https://service.shiftinc.jp/case/

お役立ち資料はこちら
https://service.shiftinc.jp/resources/

SHIFTの採用情報はこちら