2
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Microsoft Playwright Testing 使ってみた

Last updated at Posted at 2023-10-16

はじめに

本文書は Microsoft Playwright Testing を調査した内容をまとめたものである。メモに近い記述になっている部分がある。
また、本文書は、以下のドキュメントを参照し、記述する。

What is Microsoft Playwright Testing ?

Microsoft Playwright Testing は Playwright を用いた end-to-end での Web アプリケーションの自動テストの実行環境を Microsoft Azure 上のマネージドサービスとして提供するもの。
2023/10現在 public preview で公開されている。このサービスには、以下の利点がある。

  • すでにある Playwright を用いたテストコードをそのままクラウド上で実行できる。
  • ローカル環境では実現し難い、並列実行数でテスト実行をスケールできる。
  • 以下の複数のブラウザ、複数のOSをサポートする。
    • OS: Windows, Linux
    • Browsers: Chromium, Firefox, WebKit, Microsoft Edge
  • Web アプリケーションがインターネット上に公開されている、いないに関わらずテスト実行できる。また、ローカル環境で実行しているアプリケーションに対してもテスト実行できる。

How it works

以下の図は、Microsoft Playwright Testing のアーキテクチャを示している。

Architecture overview
  • Playwright の実行自体はクライアントマシンで行い、 Microsoft Playwright Testing がホストするブラウザ上で、テスト実行のするためにやりとりする。
  • クライアントマシンには、自前のワークステーション、および CI エージェントマシンを利用できる。CI に組み込む場合は、 Microsoft Playwright Testing を利用したテスト実行をワークフローの一部にできる。
  • テスト実行後は、実行結果のメタデータを Microsoft Playwright Testing のサービスにアップロードされ、テスト実行結果、トレースファイル、スクリーンショット、ビデオなどの出力をクライアントマシンから取得できる。

Pricing

料金は、従量課金制で、実行時間1分あたりで計算される。ワーカー数での課金はないため、並列実行数は自由に設定できる模様。独立したテストケースを実装し、1ファイル内のテストケースも並列実行で実行できるようにした方が有効にサービスを活用できることになる。ただし、実行時間は、ワーカーごとの実行時間の合計となる。具体的な料金は Microsoft Playwright Testing pricing のページに記載がある。

実際に使ってみた

実行編

Free trial として試すことができる。利用期間は30日間で、テスト実行時間は合計100分までとなっている。
Quick start: Run end-to-end tests at scale with Microsoft Playwright Testing Previewに従って、 Microsoft Playwright Testing を利用したテスト実行を行う。手順は以下の通りで、 Playwright を用いたテストコードのプロジェクトがあれば、簡単に試すことができた。なお、@playwright/test のパッケージはバージョンを v1.37 以上を利用する必要がある。

  1. ワークスペース作成
  2. テストコードを管理するプロジェクトに playwright.service.config.ts を追加する。
  3. サービスの認証のために Access Token を発行する。
  4. サービスへ接続するエンドポイントURLを取得する
  5. PLAYWRIGHT_SERVICE_ACCESS_TOKENPLAYWRIGHT_SERVICE_URL の環境変数を .env ファイルで設定する。このファイルは git 等のリポジトリ管理下に置かないこと。
  6. npx playwright test --config=playwright.service.config.ts --workers=20 でテスト実行する。

継続的実行環境編

Quick start: Set up continuous end-to-end testing with Microsoft Playwright Testing Previewに従って、 Microsoft Playwright Testing を利用したテストの継続的実行環境を構築する。ここでは GitHub Actions を用いたが、ほぼ前述の「実行編」の手順と同様なので、差異がある部分のみ記述する。

  • PLAYWRIGHT_SERVICE_ACCESS_TOKENPLAYWRIGHT_SERVICE_URL の環境変数は GitHub Actions の Secrets に設定する。

  • ワークフローファイルには以下のように記述する。

    - name: Install dependencies
      working-directory: path/to/playwright/folder # update accordingly
      run: npm ci
    - name: Run Playwright tests
      working-directory: path/to/playwright/folder # update accordingly
      env:
        # Access token and regional endpoint for Microsoft Playwright Testing
        PLAYWRIGHT_SERVICE_ACCESS_TOKEN: ${{ secrets.PLAYWRIGHT_SERVICE_ACCESS_TOKEN }}
        PLAYWRIGHT_SERVICE_URL: ${{ secrets.PLAYWRIGHT_SERVICE_URL }}
        PLAYWRIGHT_SERVICE_RUN_ID: ${{ github.run_id }}-${{ github.run_attempt }}-${{ github.sha }}
      run: npx playwright test -c playwright.service.config.ts --workers=20
    

まとめ

Microsoft Playwright Testing はテストの並列実行環境を提供するサービスで、テスト実行自体のトリガーやスケジューリングなど、いわゆる CI のホストの機能は、提供していない。GitHub Actions や Azure Pipelines などと併せて利用することで、継続的なテスト実行環境を構築することになる。導入自体は、すでに Playwright を用いたテストコードがあれば、簡単にできる。

2
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?