Vitest

英語

简体中文

英語

简体中文

外観

レポーター ​

Vitestは、さまざまな形式でテスト出力を表示するためのいくつかの組み込みレポーターと、カスタムレポーターを使用する機能を提供します。--reporterコマンドラインオプションを使用するか、設定ファイルにreportersプロパティを含めることで、異なるレポーターを選択できます。レポーターが指定されていない場合、Vitestは後述するdefaultレポーターを使用します。

コマンドラインでレポーターを使用する

bash
npx vitest --reporter=verbose

vitest.config.tsでレポーターを使用する

ts
/// <reference types="vitest" />
import {  } from 'vite'

export default ({
  : {
    : ['verbose']
  },
})

一部のレポーターは、追加のオプションを渡すことでカスタマイズできます。レポーター固有のオプションについては、以下のセクションで説明します。

ヒント

Vitest v1.3.0以降

ts
export default defineConfig({
  test: {
    reporters: [
      'default',
      ['junit', { suiteName: 'UI tests' }]
    ],
  },
})

レポーターの出力 ​

デフォルトでは、Vitestのレポーターはターミナルに出力を出力します。json、html、またはjunitレポーターを使用する場合、Vite設定ファイルまたはCLIで構成オプションのoutputFileを含めることで、代わりにテストの出力をファイルに書き込むことができます。

bash
npx vitest --reporter=json --outputFile=./test-output.json
ts
export default defineConfig({
  test: {
    reporters: ['json'],
    outputFile: './test-output.json'
  },
})

レポーターの組み合わせ ​

複数のレポーターを同時に使用して、テスト結果を異なる形式で出力できます。例：

bash
npx vitest --reporter=json --reporter=default
ts
export default defineConfig({
  test: {
    reporters: ['json', 'default'],
    outputFile: './test-output.json'
  },
})

上記の例では、デフォルトのスタイルでテスト結果をターミナルに出力し、指定された出力ファイルにJSONとして書き込みます。

複数のレポーターを使用する場合、次のように複数の出力ファイルを指定することもできます。

ts
export default defineConfig({
  reporters: ['junit', 'json', 'verbose'],
  outputFile: {
    junit: './junit-report.xml',
    json: './json-report.json',
  },
})

この例では、個別のJSONレポートとXMLレポートを書き出し、詳細なレポートをターミナルに出力します。

組み込みレポーター ​

デフォルトレポーター ​

デフォルトでは（つまり、レポーターが指定されていない場合）、Vitestは各テストスイートの結果を実行時に階層的に表示し、スイートが合格した後に折りたたみます。すべてのテストが完了すると、最終的なターミナル出力に結果の概要と失敗したテストの詳細が表示されます。

テスト実行中の出力例

bash
✓ __tests__/file1.test.ts (2) 725ms
✓ __tests__/file2.test.ts (5) 746ms
  ✓ second test file (2) 746ms
    ✓ 1 + 1 should equal 2
    ✓ 2 - 1 should equal 1

テスト完了後の最終出力

bash
✓ __tests__/file1.test.ts (2) 725ms
✓ __tests__/file2.test.ts (2) 746ms

 Test Files  2 passed (2)
      Tests  4 passed (4)
   Start at  12:34:32
   Duration  1.26s (transform 35ms, setup 1ms, collect 90ms, tests 1.47s, environment 0ms, prepare 267ms)

基本レポーター ​

basicレポーターは、実行されたテストファイルと、スイート全体が実行完了した後の結果の概要を表示します。個々のテストは、失敗した場合を除き、レポートには含まれません。

bash
npx vitest --reporter=basic
ts
export default defineConfig({
  test: {
    reporters: ['basic']
  },
})

基本レポーターを使用した出力例

bash
✓ __tests__/file1.test.ts (2) 725ms
✓ __tests__/file2.test.ts (2) 746ms

 Test Files  2 passed (2)
      Tests  4 passed (4)
   Start at  12:34:32
   Duration  1.26s (transform 35ms, setup 1ms, collect 90ms, tests 1.47s, environment 0ms, prepare 267ms)

詳細レポーター ​

defaultレポーターと同じ階層構造に従いますが、合格したテストスイートのサブツリーは折りたたみません。最終的なターミナル出力には、合格したものを含め、実行されたすべてのテストが表示されます。

bash
npx vitest --reporter=verbose
ts
export default defineConfig({
  test: {
    reporters: ['verbose']
  },
})

合格したテストスイートの最終的なターミナル出力の例

bash
✓ __tests__/file1.test.ts (2) 725ms
   ✓ first test file (2) 725ms
     ✓ 2 + 2 should equal 4
     ✓ 4 - 2 should equal 2
✓ __tests__/file2.test.ts (2) 746ms
  ✓ second test file (2) 746ms
    ✓ 1 + 1 should equal 2
    ✓ 2 - 1 should equal 1

 Test Files  2 passed (2)
      Tests  4 passed (4)
   Start at  12:34:32
   Duration  1.26s (transform 35ms, setup 1ms, collect 90ms, tests 1.47s, environment 0ms, prepare 267ms)

ドットレポーター ​

実行されたすべてのテストを表示しながら、最小限の出力を提供するために、完了したテストごとに1つのドットを出力します。詳細については、失敗したテストと、スイートのbasicレポーターの概要のみが表示されます。

bash
npx vitest --reporter=dot
ts
export default defineConfig({
  test: {
    reporters: ['dot']
  },
})

合格したテストスイートのターミナル出力例

bash
....

 Test Files  2 passed (2)
      Tests  4 passed (4)
   Start at  12:34:32
   Duration  1.26s (transform 35ms, setup 1ms, collect 90ms, tests 1.47s, environment 0ms, prepare 267ms)

JUnitレポーター ​

JUnit XML形式でテスト結果のレポートを出力します。ターミナルに出力するか、outputFile構成オプションを使用してXMLファイルに書き込むことができます。

bash
npx vitest --reporter=junit
ts
export default defineConfig({
  test: {
    reporters: ['junit']
  },
})

JUnit XMLレポートの例

xml
<?xml version="1.0" encoding="UTF-8" ?>
<testsuites name="vitest tests" tests="2" failures="1" errors="0" time="0.503">
    <testsuite name="__tests__/test-file-1.test.ts" timestamp="2023-10-19T17:41:58.580Z" hostname="My-Computer.local" tests="2" failures="1" errors="0" skipped="0" time="0.013">
        <testcase classname="__tests__/test-file-1.test.ts" name="first test file &gt; 2 + 2 should equal 4" time="0.01">
            <failure message="expected 5 to be 4 // Object.is equality" type="AssertionError">
AssertionError: expected 5 to be 4 // Object.is equality
 ❯ __tests__/test-file-1.test.ts:20:28
            </failure>
        </testcase>
        <testcase classname="__tests__/test-file-1.test.ts" name="first test file &gt; 4 - 2 should equal 2" time="0">
        </testcase>
    </testsuite>
</testsuites>

出力されたXMLには、ネストされたtestsuitesとtestcaseタグが含まれています。環境変数VITEST_JUNIT_SUITE_NAMEとVITEST_JUNIT_CLASSNAMEを使用して、それぞれname属性とclassname属性を構成できます。これらは、レポーターオプションを介してカスタマイズすることもできます。

ts
export default defineConfig({
  test: {
    reporters: [
      ['junit', { suiteName: 'custom suite name', classname: 'custom-classname' }]
    ]
  },
})

JSONレポーター ​

JSON形式でテスト結果のレポートを出力します。ターミナルに出力するか、outputFile構成オプションを使用してファイルに書き込むことができます。

bash
npx vitest --reporter=json
ts
export default defineConfig({
  test: {
    reporters: ['json']
  },
})

JSONレポートの例

json
{
  "numTotalTestSuites": 1,
  "numPassedTestSuites": 0,
  "numFailedTestSuites": 1,
  "numPendingTestSuites": 0,
  "numTotalTests": 1,
  "numPassedTests": 0,
  "numFailedTests": 1,
  "numPendingTests": 0,
  "numTodoTests": 0,
  "startTime": 1697737019307,
  "success": false,
  "testResults": [
    {
      "assertionResults": [
        {
          "ancestorTitles": [
            "",
            "first test file"
          ],
          "fullName": " first test file 2 + 2 should equal 4",
          "status": "failed",
          "title": "2 + 2 should equal 4",
          "duration": 9,
          "failureMessages": [
            "expected 5 to be 4 // Object.is equality"
          ],
          "location": {
            "line": 20,
            "column": 28
          }
        }
      ],
      "startTime": 1697737019787,
      "endTime": 1697737019797,
      "status": "failed",
      "message": "",
      "name": "/root-directory/__tests__/test-file-1.test.ts"
    }
  ]
}

HTMLレポーター ​

インタラクティブなGUIを通じてテスト結果を表示するためのHTMLファイルを生成します。ファイルが生成された後、Vitestはローカル開発サーバーを実行し続け、ブラウザでレポートを表示するためのリンクを提供します。

出力ファイルは、outputFile構成オプションを使用して指定できます。outputFileオプションが指定されていない場合、新しいHTMLファイルが作成されます。

bash
npx vitest --reporter=html
ts
export default defineConfig({
  test: {
    reporters: ['html']
  },
})

ヒント

このレポーターには、@vitest/uiパッケージのインストールが必要です。

TAPレポーター ​

Test Anything Protocol（TAP）に従ってレポートを出力します。

bash
npx vitest --reporter=tap
ts
export default defineConfig({
  test: {
    reporters: ['tap']
  },
})

TAPレポートの例

bash
TAP version 13
1..1
not ok 1 - __tests__/test-file-1.test.ts # time=14.00ms {
    1..1
    not ok 1 - first test file # time=13.00ms {
        1..2
        not ok 1 - 2 + 2 should equal 4 # time=11.00ms
            ---
            error:
                name: "AssertionError"
                message: "expected 5 to be 4 // Object.is equality"
            at: "/root-directory/__tests__/test-file-1.test.ts:20:28"
            actual: "5"
            expected: "4"
            ...
        ok 2 - 4 - 2 should equal 2 # time=1.00ms
    }
}

TAPフラットレポーター ​

TAPフラットレポートを出力します。tapレポーターと同様に、テスト結果はTAP標準に従ってフォーマットされますが、テストスイートはネストされた階層ではなくフラットなリストとしてフォーマットされます。

bash
npx vitest --reporter=tap-flat
ts
export default defineConfig({
  test: {
    reporters: ['tap-flat']
  },
})

TAPフラットレポートの例

bash
TAP version 13
1..2
not ok 1 - __tests__/test-file-1.test.ts > first test file > 2 + 2 should equal 4 # time=11.00ms
    ---
    error:
        name: "AssertionError"
        message: "expected 5 to be 4 // Object.is equality"
    at: "/root-directory/__tests__/test-file-1.test.ts:20:28"
    actual: "5"
    expected: "4"
    ...
ok 2 - __tests__/test-file-1.test.ts > first test file > 4 - 2 should equal 2 # time=0.00ms

ハングプロセスレポーター ​

Vitestが安全に終了するのを妨げているハングプロセスのリストを表示します。hanging-processレポーター自体はテスト結果を表示しませんが、テストの実行中にプロセスを監視するために別のレポーターと組み合わせて使用できます。このレポーターを使用するとリソースを大量に消費する可能性があるため、Vitestがプロセスを終了できない状況でのデバッグ目的のために予約する必要があります。

bash
npx vitest --reporter=hanging-process
ts
export default defineConfig({
  test: {
    reporters: ['hanging-process']
  },
})

Github Actionsレポーター 1.3.0+ ​

テストの失敗に関する注釈を提供するために、ワークフローコマンドを出力します。このレポーターは、process.env.GITHUB_ACTIONS === 'true'の場合、defaultレポーターで自動的に有効になります。

デフォルト以外のレポーターを構成する場合は、github-actionsを明示的に追加する必要があります。

ts
export default defineConfig({
  test: {
    reporters: process.env.GITHUB_ACTIONS ? ['dot', 'github-actions'] : ['dot'],
  },
})
Github ActionsGithub Actions

カスタムレポーター ​

レポーターオプションでパッケージ名を指定することにより、NPMからインストールされたサードパーティのカスタムレポーターを使用できます。

bash
npx vitest --reporter=some-published-vitest-reporter
ts
export default defineConfig({
  test: {
    reporters: ['some-published-vitest-reporter']
  },
})

さらに、独自のカスタムレポーターを定義し、そのファイルパスを指定して使用できます。

bash
npx vitest --reporter=./path/to/reporter.ts

カスタムレポーターは、レポーターインターフェースを実装する必要があります。

MITライセンスの下でリリースされています。

Copyright © 2021-PRESENT Anthony Fu, Matías Capeletto および Vitest contributors