报告器
Vitest 提供了多种内置报告器,用于以不同格式显示测试输出,并且还支持使用自定义报告器。你可以通过 --reporter
命令行选项,或者在配置文件中包含 reporters
属性来选择不同的报告器。如果未指定报告器,Vitest 将使用下文描述的 default
报告器。
通过命令行使用报告器:
npx vitest --reporter=verbose
通过 vitest.config.ts
使用报告器:
import { defineConfig } from 'vitest/config';
export default defineConfig({
test: {
reporters: ['verbose'],
},
});
一些报告器可以通过传递额外选项进行自定义。针对不同报告器的选项将在以下部分中描述。
export default defineConfig({
test: {
reporters: ['default', ['junit', { suiteName: 'UI tests' }]],
},
});
报告器输出
默认情况下,Vitest 的报告器会将输出打印到终端。当使用 json
、html
或 junit
报告器时,你可以通过在 Vite 配置文件中或通过 CLI 包含 outputFile
配置选项来将测试输出写入文件。
npx vitest --reporter=json --outputFile=./test-output.json
export default defineConfig({
test: {
reporters: ['json'],
outputFile: './test-output.json',
},
});
组合报告器
你可以同时使用多个报告器,以不同格式输出测试结果。例如:
npx vitest --reporter=json --reporter=default
export default defineConfig({
test: {
reporters: ['json', 'default'],
outputFile: './test-output.json',
},
});
上面的例子会将测试结果以默认样式同时打印到终端,并将其作为 JSON 写入指定输出文件。
当使用多个报告器时,也可以指定多个输出文件,如下所示:
export default defineConfig({
test: {
reporters: ['junit', 'json', 'verbose'],
outputFile: {
junit: './junit-report.xml',
json: './json-report.json',
},
},
});
此示例将分别写入 JSON 和 XML 报告,并在终端打印详细报告。
内置报告器
默认报告器
默认情况下(即未指定报告器时),Vitest 将在底部显示正在运行的测试及其状态的摘要。一旦测试套件通过,其状态将在摘要上方显示。
你可以通过配置报告器来关闭摘要:
export default defineConfig({
test: {
reporters: [['default', { summary: false }]],
},
});
测试运行中的示例输出:
✓ test/example-1.test.ts (5 tests | 1 skipped) 306ms
✓ test/example-2.test.ts (5 tests | 1 skipped) 307ms
❯ test/example-3.test.ts 3/5
❯ test/example-4.test.ts 1/5
Test Files 2 passed (4)
Tests 10 passed | 3 skipped (65)
Start at 11:01:36
Duration 2.00s
测试完成后的最终输出:
✓ test/example-1.test.ts (5 tests | 1 skipped) 306ms
✓ test/example-2.test.ts (5 tests | 1 skipped) 307ms
✓ test/example-3.test.ts (5 tests | 1 skipped) 307ms
✓ test/example-4.test.ts (5 tests | 1 skipped) 307ms
Test Files 4 passed (4)
Tests 16 passed | 4 skipped (20)
Start at 12:34:32
Duration 1.26s (transform 35ms, setup 1ms, collect 90ms, tests 1.47s, environment 0ms, prepare 267ms)
基本报告器
basic
报告器等同于没有 summary
的 default
报告器。
npx vitest --reporter=basic
export default defineConfig({
test: {
reporters: ['basic'],
},
});
使用基本报告器的示例输出:
✓ __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
报告器相同,但它也会在测试套件完成后显示每个单独的测试。它还会显示当前正在运行的、耗时超过 slowTestThreshold
的测试。与 default
报告器类似,你可以通过配置报告器来关闭摘要。
npx vitest --reporter=verbose
export default defineConfig({
test: {
reporters: [['verbose', { summary: false }]],
},
});
默认 slowTestThreshold: 300
时测试进行中的示例输出:
✓ __tests__/example-1.test.ts (2) 725ms
✓ first test file (2) 725ms
✓ 2 + 2 should equal 4
✓ 4 - 2 should equal 2
❯ test/example-2.test.ts 3/5
↳ should run longer than three seconds 1.57s
❯ test/example-3.test.ts 1/5
Test Files 2 passed (4)
Tests 10 passed | 3 skipped (65)
Start at 11:01:36
Duration 2.00s
通过测试套件的最终终端输出示例:
✓ __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
报告器摘要。
npx vitest --reporter=dot
export default defineConfig({
test: {
reporters: ['dot'],
},
});
通过测试套件的终端输出示例:
....
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 文件。
npx vitest --reporter=junit
export default defineConfig({
test: {
reporters: ['junit'],
},
});
JUnit 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 > 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 > 4 - 2 should equal 2" time="0">
</testcase>
</testsuite>
</testsuites>
生成的 XML 包含嵌套的 testsuites
和 testcase
元素。这些也可以通过报告器选项 suiteName
和 classnameTemplate
进行自定义。classnameTemplate
可以是模板字符串或函数。
classnameTemplate
选项支持的占位符有:
- filename
- filepath
export default defineConfig({
test: {
reporters: [
[
'junit',
{
suiteName: 'custom suite name',
classnameTemplate: 'filename:{filename} - filepath:{filepath}',
},
],
],
},
});
JSON 报告器
生成与 Jest 的 --json
选项兼容的 JSON 格式测试结果报告。可以使用 outputFile
配置选项打印到终端或写入文件。
npx vitest --reporter=json
export default defineConfig({
test: {
reporters: ['json'],
},
});
JSON 报告示例:
{
"numTotalTestSuites": 4,
"numPassedTestSuites": 2,
"numFailedTestSuites": 1,
"numPendingTestSuites": 1,
"numTotalTests": 4,
"numPassedTests": 1,
"numFailedTests": 1,
"numPendingTests": 1,
"numTodoTests": 1,
"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
},
"meta": {}
}
],
"startTime": 1697737019787,
"endTime": 1697737019797,
"status": "failed",
"message": "",
"name": "/root-directory/__tests__/test-file-1.test.ts"
}
],
"coverageMap": {}
}
INFO
从 Vitest 3 开始,如果启用了覆盖率,JSON 报告器会在 coverageMap
中包含覆盖率信息。
HTML 报告器
生成一个 HTML 文件,用于通过交互式 GUI 查看测试结果。文件生成后,Vitest 将会启动一个本地开发服务器,并提供一个链接以在浏览器中查看报告。
可以通过 outputFile
配置选项来指定输出文件。如果未提供 outputFile
选项,系统将创建一个新的 HTML 文件。
npx vitest --reporter=html
export default defineConfig({
test: {
reporters: ['html'],
},
});
TIP
此报告器需要安装 @vitest/ui
包。
TAP 报告器
生成遵循 Test Anything Protocol (TAP) 标准的报告。
npx vitest --reporter=tap
export default defineConfig({
test: {
reporters: ['tap'],
},
});
TAP 报告示例:
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 Flat 报告器
输出 TAP flat 报告。与 tap
报告器一样,测试结果会按照 TAP 标准进行格式化,但测试套件会以扁平列表而非嵌套层次结构的形式呈现。
npx vitest --reporter=tap-flat
export default defineConfig({
test: {
reporters: ['tap-flat'],
},
});
TAP flat 报告示例:
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 始终无法退出进程的情况下。
npx vitest --reporter=hanging-process
export default defineConfig({
test: {
reporters: ['hanging-process'],
},
});
Github Actions 报告器
输出 工作流命令,为测试失败提供注释。当 process.env.GITHUB_ACTIONS === 'true'
时,此报告器会随 default
报告器自动启用。
如果你配置了非默认的报告器,则需要显式添加 github-actions
。
export default defineConfig({
test: {
reporters: process.env.GITHUB_ACTIONS ? ['dot', 'github-actions'] : ['dot'],
},
});
你可以使用 onWritePath
选项,自定义在 GitHub 注释命令格式中打印的文件路径。这在容器化环境(如 Docker)中运行 Vitest 时非常有用,因为文件路径可能与 GitHub Actions 环境中的路径不匹配。
export default defineConfig({
test: {
reporters: process.env.GITHUB_ACTIONS
? [
'default',
[
'github-actions',
{
onWritePath(path) {
return path.replace(
/^\/app\//,
`${process.env.GITHUB_WORKSPACE}/`
);
},
},
],
]
: ['default'],
},
});
Blob 报告器
将测试结果存储在本地机器上,以便以后可以使用 --merge-reports
命令进行合并。 默认情况下,所有结果都会存储在 .vitest-reports
文件夹中,但可以使用 --outputFile
或 --outputFile.blob
标志进行覆盖。
npx vitest --reporter=blob --outputFile=reports/blob-1.json
如果你使用 --shard
标志在不同机器上运行 Vitest,我们建议使用此报告器。 所有 blob 报告都可以在 CI 管道结束时,通过使用 --merge-reports
命令合并成一个报告:
npx vitest --merge-reports=reports --reporter=json --reporter=default
TIP
--reporter=blob
和 --merge-reports
都不在观察模式下工作。
自定义报告器
你可以通过在报告器选项中指定包名,来使用从 NPM 安装的第三方自定义报告器:
npx vitest --reporter=some-published-vitest-reporter
export default defineConfig({
test: {
reporters: ['some-published-vitest-reporter'],
},
});
此外,你可以定义自己的自定义报告器,并通过指定其文件路径来使用它们:
npx vitest --reporter=./path/to/reporter.ts
自定义报告器应实现 Reporter 接口。