Playwrightテスト結果をmablに公開する

すべてのテスト実行結果をmablクラウドにエクスポートするように、Playwrightテストスイートを設定します。@mablhq/playwright-reporterパッケージを使うと、Playwrightのテストの結果をmablのテスト実行とともに確認することができるため、結果を分析し、テストプラットフォーム間でインサイトを共有することが容易になります。

開始する前に

@mablhq/playwright-reporterパッケージを使用するには、以下のものが必要です。

• Playwright 1.43.1以上 - 詳細については、Playwrightの要件を参照してください。
• mablのワークスペースID - Playwrightのテスト結果を送信するmablのワークスペースで、[ワークスペース] > [ワークスペース] からワークスペースIDを取得します。
• mabl APIキー - mablアプリケーションの [ワークスペース] > [API] で "Command Line Interface" APIキーを作成します。

playwright-reporterのインストール

@mablhq/playwright-reporterパッケージをインストールします。

npm install @mablhq/playwright-reporter -D

playwright-reporterの設定

playwright.config.tsファイル内のdefineConfig関数のレポーターキーでレポーターを設定できます。 

以下のサンプルスクリプトを使用するには、MABL_API_KEYとMABL_WORKSPACE_ID変数をテストスイートのルートディレクトリにある別の.envファイルに保存し、dotenvを使用してその値をインポートしてください。結果をmablプランとして公開したい場合は、planNameオプションを含めてください。

import { defineConfig } from '@playwright/test';
import dotenv from 'dotenv';
import path from 'path';
dotenv.config({ path: path.resolve(__dirname, '.env') });

export default defineConfig({
  use: {
    trace: "on",
    screenshot: "on",
  },
  reporter: [
    // Reference the mabl Playwright reporter for use in your test runs
    [
      '@mablhq/playwright-reporter',
      {
        apiKey: process.env.MABL_API_KEY,
        workspaceId: process.env.MABL_WORKSPACE_ID,
        planName: 'SAMPLE_PLAN_NAME'
      },
    ],
  ],
});

サンプルスクリプトでは、mablのテスト出力にmablステップの詳細とアプリケーションの最終状態のスクリーンショットが含まれるように、traceとscreenshotsを「on」に設定しています。

Playwright レポートの設定に関する詳細は、こちらのドキュメントを参照してください。

Playwrightの実行をアプリケーションと環境に関連付ける

mablアプリでPlaywrightの結果をより効果的にフィルタリングするために、アプリケーションと環境を含めることをお勧めします。関連するmablリソースIDをplaywright.config.tsファイルのプロジェクトセクションに追加してください。

以下の例を使用するには、アプリケーションIDと環境IDを環境変数 MABL_ENVIRONMENT_ID と MABL_APPLICATION_ID として.envファイルに保存してください。

projects: [
   {
     name: "chromium",
     use: {
       mabl: {
         environmentId: process.env.MABL_ENVIRONMENT_ID,
         applicationId: process.env.MABL_APPLICATION_ID,
       },
     },
   },
  ]

まとめると、以下のスクリプトには、Playwrightの実行結果をmablに公開し、mablアプリケーションと環境に関連付けるために必要な変更が含まれています：

import { defineConfig } from '@playwright/test';
import dotenv from 'dotenv';
import path from 'path';
dotenv.config({ path: path.resolve(__dirname, '.env') });

export default defineConfig({
  use: {
    trace: "on",
    screenshot: "on",
  },
  reporter: [
    [
      "@mablhq/playwright-reporter",
      {
        apiKey: process.env.MABL_API_KEY,
        workspaceId: process.env.MABL_WORKSPACE_ID,
        planName: "SAMPLE PLAN NAME",
      },
    ],
  ],
  projects: [
    {
      name: "chromium",
      use: {
        mabl: {
          environmentId: process.env.MABL_ENVIRONMENT_ID,
          applicationId: process.env.MABL_APPLICATION_ID,
        },
      },
    },
  ],
});

mablでの結果の表示

Playwrightテストが実行されると、テストの完了時に、テスト実行の出力がmablに公開されます。これらの結果は、mablの他のテスト結果とともに [テスト結果] タブに表示されます。