跳至内容

报告器

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 的报告器会将它们的输出打印到终端。当使用 jsonhtmljunit 报告器时,您可以通过在您的 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)

点报告器

为每个完成的测试打印一个点,以提供最少的输出,同时仍然显示所有已运行的测试。仅为失败的测试提供详细信息,以及套件的 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 包含嵌套的 testsuitestestcase 标签。您可以使用环境变量 VITEST_JUNIT_SUITE_NAMEVITEST_JUNIT_CLASSNAME 来分别配置它们的 nameclassname 属性。这些也可以通过报告器选项进行自定义

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 报告器

生成一个 HTML 文件,通过交互式 GUI 查看测试结果。在文件生成后,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

自定义报告器应实现 Reporter 接口