レポーター

はじめに

Playwright Test には、さまざまなニーズに対応するいくつかの組み込みレポーターと、カスタムレポーターを提供する機能があります。組み込みレポーターを試す最も簡単な方法は、--reporter コマンドラインオプションを渡すことです。

npx playwright test --reporter=line

より詳細な制御を行うには、設定ファイルでレポーターをプログラムで指定できます。

playwright.config.ts

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: 'line',
});

複数のレポーター

複数のレポーターを同時に使用できます。たとえば、'list' を使用して見やすいターミナル出力を得て、'json' を使用してテスト結果の包括的な json ファイルを取得できます。

playwright.config.ts

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: [
    ['list'],
    ['json', {  outputFile: 'test-results.json' }]
  ],
});

CIでのレポーター

ローカルとCIで異なるレポーターを使用できます。たとえば、簡潔な 'dot' レポーターを使用すると、出力が多すぎないようにできます。これはCIでのデフォルトです。

playwright.config.ts

import { defineConfig } from '@playwright/test';

export default defineConfig({
  // Concise 'dot' for CI, default 'list' when running locally
  reporter: process.env.CI ? 'dot' : 'list',
});

組み込みレポーター

すべての組み込みレポーターは、失敗に関する詳細情報を示し、主に成功した実行の冗長性において異なります。

リストレポーター

リストレポーターはデフォルトです（dot レポーターがデフォルトのCIを除く）。実行中の各テストに対して1行を出力します。

npx playwright test --reporter=list

playwright.config.ts

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: 'list',
});

テスト実行中の出力例を以下に示します。失敗は最後にリストされます。

npx playwright test --reporter=list
Running 124 tests using 6 workers

 1  ✓ should access error in env (438ms)
 2  ✓ handle long test names (515ms)
 3  x 1) render expected (691ms)
 4  ✓ should timeout (932ms)
 5    should repeat each:
 6  ✓ should respect enclosing .gitignore (569ms)
 7    should teardown env after timeout:
 8    should respect excluded tests:
 9  ✓ should handle env beforeEach error (638ms)
10    should respect enclosing .gitignore:

以下の設定オプションを渡すことで、ステップのレンダリングを有効にできます。

playwright.config.ts

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: [['list', { printSteps: true }]],
});

リストレポートは、以下の設定オプションと環境変数をサポートしています。

環境変数名	レポーター設定オプション	説明	デフォルト
PLAYWRIGHT_LIST_PRINT_STEPS	printSteps	各ステップを独自の行に印刷するかどうか。	false
PLAYWRIGHT_FORCE_TTY		ライブターミナルに適した出力を生成するかどうか。true、1、false、0、[WIDTH]、および [WIDTH]x[HEIGHT] をサポートします。[WIDTH] および [WIDTH]x[HEIGHT] は TTY の寸法を指定します。	ターミナルが TTY モードの場合 true、それ以外の場合 false。
FORCE_COLOR		色付き出力を生成するかどうか。	ターミナルが TTY モードの場合 true、それ以外の場合 false。

ラインレポーター

ラインレポーターはリストレポーターよりも簡潔です。最後の完了したテストを報告するために単一行を使用し、失敗が発生したときにそれを出力します。ラインレポーターは、大規模なテストスイートで進行状況を表示しますが、すべてのテストをリストして出力をスパムしない場合に役立ちます。

npx playwright test --reporter=line

playwright.config.ts

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: 'line',
});

テスト実行中の出力例を以下に示します。失敗はインラインで報告されます。

npx playwright test --reporter=line
Running 124 tests using 6 workers
  1) dot-reporter.spec.ts:20:1 › render expected ===================================================

    Error: expect(received).toBe(expected) // Object.is equality

    Expected: 1
    Received: 0

[23/124] gitignore.spec.ts - should respect nested .gitignore

ラインレポートは、以下の設定オプションと環境変数をサポートしています。

環境変数名	レポーター設定オプション	説明	デフォルト
PLAYWRIGHT_FORCE_TTY		ライブターミナルに適した出力を生成するかどうか。true、1、false、0、[WIDTH]、および [WIDTH]x[HEIGHT] をサポートします。[WIDTH] および [WIDTH]x[HEIGHT] は TTY の寸法を指定します。	ターミナルが TTY モードの場合 true、それ以外の場合 false。
FORCE_COLOR		色付き出力を生成するかどうか。	ターミナルが TTY モードの場合 true、それ以外の場合 false。

ドットレポーター

ドットレポーターは非常に簡潔です。成功したテスト実行ごとに単一の文字のみを生成します。これはCIのデフォルトであり、多くの出力が必要ない場合に役立ちます。

npx playwright test --reporter=dot

playwright.config.ts

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: 'dot',
});

テスト実行中の出力例を以下に示します。失敗は最後にリストされます。

npx playwright test --reporter=dot
Running 124 tests using 6 workers
······F·············································

実行された各テストに対して1文字が表示され、そのステータスを示します。

文字	説明
·	合格
F	失敗
×	失敗またはタイムアウト - 再試行されます
±	再試行で合格（不安定）
T	タイムアウト
°	スキップ済み

ドットレポートは、以下の設定オプションと環境変数をサポートしています。

環境変数名	レポーター設定オプション	説明	デフォルト
PLAYWRIGHT_FORCE_TTY		ライブターミナルに適した出力を生成するかどうか。true、1、false、0、[WIDTH]、および [WIDTH]x[HEIGHT] をサポートします。[WIDTH] および [WIDTH]x[HEIGHT] は TTY の寸法を指定します。	ターミナルが TTY モードの場合 true、それ以外の場合 false。
FORCE_COLOR		色付き出力を生成するかどうか。	ターミナルが TTY モードの場合 true、それ以外の場合 false。

HTMLレポーター

HTMLレポーターは、ウェブページとして提供できるテスト実行のレポートを含む自己完結型のフォルダを生成します。

npx playwright test --reporter=html

デフォルトでは、いくつかのテストが失敗した場合、HTMLレポートは自動的に開かれます。この動作は、Playwright設定の open プロパティまたは PLAYWRIGHT_HTML_OPEN 環境変数で制御できます。このプロパティの可能な値は、always、never、および on-failure（デフォルト）です。

HTMLレポートを提供するのに使用される host と port を設定することもできます。

playwright.config.ts

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: [['html', { open: 'never' }]],
});

デフォルトでは、レポートは現在の作業ディレクトリの playwright-report フォルダに書き込まれます。この場所は、PLAYWRIGHT_HTML_OUTPUT_DIR 環境変数またはレポーター設定を使用して上書きできます。

設定ファイルで、オプションを直接渡す

playwright.config.ts

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: [['html', { outputFolder: 'my-report' }]],
});

データフォルダから他の場所にアタッチメントをアップロードしている場合、attachmentsBaseURL オプションを使用して、HTMLレポートがどこからそれらを探すべきかを指定できます。

playwright.config.ts

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: [['html', { attachmentsBaseURL: 'https://external-storage.com/' }]],
});

最後のテスト実行レポートを開く簡単な方法は次のとおりです。

npx playwright show-report

または、カスタムフォルダ名がある場合

npx playwright show-report my-report

HTMLレポートは、以下の設定オプションと環境変数をサポートしています。

環境変数名	レポーター設定オプション	説明	デフォルト
PLAYWRIGHT_HTML_TITLE	title	生成されたレポートに表示するタイトル。	デフォルトではタイトルは表示されません。
PLAYWRIGHT_HTML_OUTPUT_DIR	outputFolder	レポートを保存するディレクトリ。	playwright-report
PLAYWRIGHT_HTML_OPEN	open	ブラウザでHTMLレポートを開くタイミング。'always'、'never'、または 'on-failure' のいずれか。	'on-failure'
PLAYWRIGHT_HTML_HOST	host	レポートがブラウザで開かれる場合、このホスト名にバインドされて提供されます。	localhost
PLAYWRIGHT_HTML_PORT	port	レポートがブラウザで開かれる場合、このポートで提供されます。	9323 または、9323 が利用できない場合は任意の利用可能なポート。
PLAYWRIGHT_HTML_ATTACHMENTS_BASE_URL	attachmentsBaseURL	data サブディレクトリからの添付ファイルがアップロードされる別の場所。レポートと data を別々の場所に個別にアップロードする場合にのみ必要です。	data/
PLAYWRIGHT_HTML_NO_SNIPPETS	noSnippets	trueの場合、アクションログでのコードスニペットのレンダリングを無効にします。トップレベルのエラーがある場合でも、コードスニペットを含むそのレポートセクションはレンダリングされます。true、1、false、および 0 をサポートします。	false

ブロブレポーター

ブロブレポートにはテスト実行に関するすべての詳細が含まれており、後で他のレポートを生成するために使用できます。それらの主な機能は、シャーディングされたテストからのレポートのマージを容易にすることです。

npx playwright test --reporter=blob

デフォルトでは、レポートは package.json ディレクトリまたは現在の作業ディレクトリ（package.json が見つからない場合）の blob-report ディレクトリに書き込まれます。レポートファイル名は report-.zip のようになります。また、シャーディングが使用されている場合は report--.zip のようになります。ハッシュは、--grep、--grepInverted、--project、およびコマンドライン引数として渡されたファイルフィルタから計算されるオプション値です。ハッシュは、異なるコマンドラインオプションで Playwright を実行すると、異なるが実行間で安定したレポート名が生成されることを保証します。出力ファイル名は、設定ファイルで上書きするか、'PLAYWRIGHT_BLOB_OUTPUT_FILE' 環境変数として渡すことができます。

playwright.config.ts

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: [['blob', { outputFile: `./blob-report/report-${os.platform()}.zip` }]],
});

ブロブレポートは、以下の設定オプションと環境変数をサポートしています。

環境変数名	レポーター設定オプション	説明	デフォルト
PLAYWRIGHT_BLOB_OUTPUT_DIR	outputDir	出力を保存するディレクトリ。新しいレポートを書き込む前に既存のコンテンツは削除されます。	blob-report
PLAYWRIGHT_BLOB_OUTPUT_NAME	fileName	レポートファイル名。	report-<project>-<hash>-<shard_number>.zip
PLAYWRIGHT_BLOB_OUTPUT_FILE	outputFile	出力ファイルへのフルパス。定義されている場合、outputDir と fileName は無視されます。	未定義

JSONレポーター

JSONレポーターは、テスト実行に関するすべての情報を含むオブジェクトを生成します。

JSONをファイルに書き込みたい場合がほとんどです。--reporter=json で実行する場合、PLAYWRIGHT_JSON_OUTPUT_NAME 環境変数を使用します。

Bash

PLAYWRIGHT_JSON_OUTPUT_NAME=results.json npx playwright test --reporter=json

PowerShell

$env:PLAYWRIGHT_JSON_OUTPUT_NAME="results.json"
npx playwright test --reporter=json

Batch

set PLAYWRIGHT_JSON_OUTPUT_NAME=results.json
npx playwright test --reporter=json

設定ファイルで、オプションを直接渡す

playwright.config.ts

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: [['json', { outputFile: 'results.json' }]],
});

JSONレポートは、以下の設定オプションと環境変数をサポートしています。

環境変数名	レポーター設定オプション	説明	デフォルト
PLAYWRIGHT_JSON_OUTPUT_DIR		出力ファイルを保存するディレクトリ。出力ファイルが指定されている場合、無視されます。	cwd または設定ディレクトリ。
PLAYWRIGHT_JSON_OUTPUT_NAME	outputFile	出力ディレクトリに対する出力の基本ファイル名。	JSONレポートは標準出力に出力されます。
PLAYWRIGHT_JSON_OUTPUT_FILE	outputFile	出力ファイルへのフルパス。定義されている場合、PLAYWRIGHT_JSON_OUTPUT_DIR と PLAYWRIGHT_JSON_OUTPUT_NAME は無視されます。	JSONレポートは標準出力に出力されます。

JUnitレポーター

JUnitレポーターは、JUnit形式のXMLレポートを生成します。

レポートをXMLファイルに書き込みたい場合がほとんどです。--reporter=junit で実行する場合、PLAYWRIGHT_JUNIT_OUTPUT_NAME 環境変数を使用します。

Bash

PLAYWRIGHT_JUNIT_OUTPUT_NAME=results.xml npx playwright test --reporter=junit

PowerShell

$env:PLAYWRIGHT_JUNIT_OUTPUT_NAME="results.xml"
npx playwright test --reporter=junit

Batch

set PLAYWRIGHT_JUNIT_OUTPUT_NAME=results.xml
npx playwright test --reporter=junit

設定ファイルで、オプションを直接渡す

playwright.config.ts

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: [['junit', { outputFile: 'results.xml' }]],
});

JUnitレポートは、以下の設定オプションと環境変数をサポートしています。

環境変数名	レポーター設定オプション	説明	デフォルト
PLAYWRIGHT_JUNIT_OUTPUT_DIR		出力ファイルを保存するディレクトリ。出力ファイルが指定されていない場合、無視されます。	cwd または設定ディレクトリ。
PLAYWRIGHT_JUNIT_OUTPUT_NAME	outputFile	出力ディレクトリに対する出力の基本ファイル名。	JUnitレポートは標準出力に出力されます。
PLAYWRIGHT_JUNIT_OUTPUT_FILE	outputFile	出力ファイルへのフルパス。定義されている場合、PLAYWRIGHT_JUNIT_OUTPUT_DIR と PLAYWRIGHT_JUNIT_OUTPUT_NAME は無視されます。	JUnitレポートは標準出力に出力されます。
PLAYWRIGHT_JUNIT_STRIP_ANSI	stripANSIControlSequences	レポートに書き込む前に、テキストからANSI制御シーケンスを削除するかどうか。	デフォルトでは、出力テキストはそのまま追加されます。
PLAYWRIGHT_JUNIT_INCLUDE_PROJECT_IN_TEST_NAME	includeProjectInTestName	すべてのテストケースにPlaywrightプロジェクト名を名前のプレフィックスとして含めるかどうか。	デフォルトでは含まれません。
PLAYWRIGHT_JUNIT_SUITE_ID		ルート <testsuites/> レポートエントリの id 属性の値。	空の文字列。
PLAYWRIGHT_JUNIT_SUITE_NAME		ルート <testsuites/> レポートエントリの name 属性の値。	空の文字列。

GitHub Actions アノテーション

GitHub Actions で実行する場合、組み込みの github レポーターを使用して、自動的な失敗アノテーションを取得できます。

他のすべてのレポーターも GitHub Actions で動作しますが、アノテーションは提供しません。また、スタックトレースの失敗が倍増して GitHub のファイル表示を不明瞭にするため、マトリックス戦略でテストを実行する場合は、このアノテーションタイプを使用することはお勧めしません。

playwright.config.ts

import { defineConfig } from '@playwright/test';

export default defineConfig({
  // 'github' for GitHub Actions CI to generate annotations, plus a concise 'dot'
  // default 'list' when running locally
  reporter: process.env.CI ? 'github' : 'list',
});

カスタムレポーター

一部のレポーターメソッドを実装するクラスを作成することで、カスタムレポーターを作成できます。レポーター API の詳細をご覧ください。

my-awesome-reporter.ts

import type {
  FullConfig, FullResult, Reporter, Suite, TestCase, TestResult
} from '@playwright/test/reporter';

class MyReporter implements Reporter {
  onBegin(config: FullConfig, suite: Suite) {
    console.log(`Starting the run with ${suite.allTests().length} tests`);
  }

  onTestBegin(test: TestCase, result: TestResult) {
    console.log(`Starting test ${test.title}`);
  }

  onTestEnd(test: TestCase, result: TestResult) {
    console.log(`Finished test ${test.title}: ${result.status}`);
  }

  onEnd(result: FullResult) {
    console.log(`Finished the run: ${result.status}`);
  }
}

export default MyReporter;

次に、testConfig.reporter とともにこのレポーターを使用します。

playwright.config.ts

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: './my-awesome-reporter.ts',
});

または、レポーターファイルのパスを --reporter コマンドラインオプションとして渡すだけです。

npx playwright test --reporter="./myreporter/my-awesome-reporter.ts"

独自のレポーターを作成する際に参考にできるオープンソースのレポーター実装の短いリストを以下に示します。

• Allure Reporter
• Github Actions Reporter
• Mail Reporter
• ReportPortal
• Monocart