Reporter
Vitest bietet verschiedene integrierte Reporter, um die Testergebnisse in unterschiedlichen Formaten anzuzeigen. Zusätzlich besteht die Möglichkeit, eigene Reporter zu verwenden. Sie können die gewünschten Reporter entweder über die Befehlszeilenoption --reporter auswählen oder eine reporters-Eigenschaft in Ihrer Konfigurationsdatei definieren. Wenn kein Reporter angegeben ist, verwendet Vitest den default-Reporter, der unten beschrieben wird.
Verwendung von Reportern über die Befehlszeile:
npx vitest --reporter=verboseVerwendung von Reportern über vitest.config.ts:
/// <reference types="vitest" />
import { defineConfig } from 'vite';
export default defineConfig({
test: {
reporters: ['verbose'],
},
});Einige Reporter können durch Übergabe zusätzlicher Optionen angepasst werden. Die spezifischen Optionen für die einzelnen Reporter werden in den folgenden Abschnitten beschrieben.
TIP
Verfügbar seit Vitest v1.3.0
export default defineConfig({
test: {
reporters: ['default', ['junit', { suiteName: 'UI tests' }]],
},
});Ausgabe der Reporter
Standardmäßig erfolgt die Ausgabe der Vitest-Reporter im Terminal. Wenn Sie die Reporter json, html oder junit verwenden, können Sie die Ausgabe Ihrer Tests stattdessen in eine Datei schreiben, indem Sie die Konfigurationsoption outputFile entweder in Ihre Vite-Konfigurationsdatei oder über die Befehlszeile aufnehmen.
npx vitest --reporter=json --outputFile=./test-output.jsonexport default defineConfig({
test: {
reporters: ['json'],
outputFile: './test-output.json',
},
});Kombination mehrerer Reporter
Sie können mehrere Reporter gleichzeitig verwenden, um Ihre Testergebnisse in verschiedenen Formaten auszugeben. Zum Beispiel:
npx vitest --reporter=json --reporter=defaultexport default defineConfig({
test: {
reporters: ['json', 'default'],
},
outputFile: './test-output.json',
});Das obige Beispiel gibt die Testergebnisse im Standardstil im Terminal aus und schreibt sie zusätzlich als JSON in die angegebene Ausgabedatei.
Bei Verwendung mehrerer Reporter ist es auch möglich, für jeden Reporter eine separate Ausgabedatei anzugeben:
export default defineConfig({
reporters: ['junit', 'json', 'verbose'],
outputFile: {
junit: './junit-report.xml',
json: './json-report.json',
},
});Dieses Beispiel schreibt separate JSON- und XML-Berichte und gibt zusätzlich einen ausführlichen Bericht im Terminal aus.
Integrierte Reporter
Standard-Reporter
Standardmäßig zeigt Vitest die Ergebnisse für jede Testsuite hierarchisch an, während die Tests ausgeführt werden. Nach dem Bestehen einer Suite werden die Ergebnisse ausgeblendet. Nach Abschluss aller Tests zeigt die abschließende Terminalausgabe eine Zusammenfassung der Ergebnisse sowie Details zu allen fehlgeschlagenen Tests an.
Beispielausgabe während der Testausführung:
✓ __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 1Abschließende Ausgabe nach Abschluss der Tests:
✓ __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 Reporter
Der basic-Reporter zeigt die ausgeführten Testdateien und eine Zusammenfassung der Ergebnisse nach Abschluss aller Tests an. Einzelne Tests werden nur dann im Bericht aufgeführt, wenn sie fehlschlagen.
npx vitest --reporter=basicexport default defineConfig({
test: {
reporters: ['basic'],
},
});Beispielausgabe mit dem Basic Reporter:
✓ __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)Verbose Reporter
Dieser Reporter folgt der gleichen hierarchischen Struktur wie der default-Reporter, blendet jedoch keine Unterstrukturen für bestandene Testsuiten aus. Die abschließende Terminalausgabe zeigt alle ausgeführten Tests an, einschließlich der bestandenen.
npx vitest --reporter=verboseexport default defineConfig({
test: {
reporters: ['verbose'],
},
});Beispiel für die abschließende Terminalausgabe für eine bestandene Testsuite:
✓ __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)Punkt-Reporter
Dieser Reporter gibt für jeden abgeschlossenen Test einen einzelnen Punkt aus, um eine minimale Ausgabe zu erzielen und alle ausgeführten Tests anzuzeigen. Details werden nur für fehlgeschlagene Tests zusammen mit der basic-Reporterzusammenfassung für die Suite bereitgestellt.
npx vitest --reporter=dotexport default defineConfig({
test: {
reporters: ['dot'],
},
});Beispiel für die Terminalausgabe für eine bestandene Testsuite:
....
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-Reporter
Dieser Reporter gibt die Testergebnisse im JUnit-XML-Format aus. Die Ausgabe kann entweder im Terminal erfolgen oder mit der Konfigurationsoption outputFile in eine XML-Datei geschrieben werden.
npx vitest --reporter=junitexport default defineConfig({
test: {
reporters: ['junit'],
},
});Beispiel für einen JUnit-XML-Bericht:
<?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>Das ausgegebene XML enthält die verschachtelten Tags testsuites und testcase. Sie können die Umgebungsvariablen VITEST_JUNIT_SUITE_NAME und VITEST_JUNIT_CLASSNAME verwenden, um die Attribute name bzw. classname des testsuites- und testcase-Tags zu konfigurieren. Alternativ können diese auch über Reporteroptionen angepasst werden:
export default defineConfig({
test: {
reporters: [
[
'junit',
{ suiteName: 'custom suite name', classname: 'custom-classname' },
],
],
},
});JSON-Reporter
Dieser Reporter gibt einen Bericht der Testergebnisse im JSON-Format aus. Die Ausgabe kann entweder im Terminal erfolgen oder mit der Konfigurationsoption outputFile in eine Datei geschrieben werden.
npx vitest --reporter=jsonexport default defineConfig({
test: {
reporters: ['json'],
},
});Beispiel für einen JSON-Bericht:
{
"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-Reporter
Dieser Reporter generiert eine HTML-Datei, um Testergebnisse über eine interaktive GUI anzuzeigen. Nachdem die Datei generiert wurde, startet Vitest einen lokalen Entwicklungsserver und stellt einen Link zur Verfügung, um den Bericht in einem Browser anzuzeigen.
Die Ausgabedatei kann mit der Konfigurationsoption outputFile angegeben werden. Wenn keine outputFile-Option angegeben ist, wird eine neue HTML-Datei erstellt.
npx vitest --reporter=htmlexport default defineConfig({
test: {
reporters: ['html'],
},
});TIP
Dieser Reporter erfordert die Installation des Pakets @vitest/ui.
TAP-Reporter
Dieser Reporter gibt einen Bericht gemäß dem Test Anything Protocol (TAP) aus.
npx vitest --reporter=tapexport default defineConfig({
test: {
reporters: ['tap'],
},
});Beispiel für einen TAP-Bericht:
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-Reporter
Dieser Reporter gibt einen flachen TAP-Bericht aus. Wie beim tap-Reporter werden die Testergebnisse so formatiert, dass sie den TAP-Standards entsprechen, aber Testsuiten werden als flache Liste anstelle einer verschachtelten Hierarchie formatiert.
npx vitest --reporter=tap-flatexport default defineConfig({
test: {
reporters: ['tap-flat'],
},
});Beispiel für einen flachen TAP-Bericht:
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.00msHanging-Process-Reporter
Dieser Reporter zeigt eine Liste der hängenden Prozesse an, falls diese verhindern, dass Vitest sicher beendet wird. Der hanging-process-Reporter zeigt selbst keine Testergebnisse an, kann aber in Verbindung mit einem anderen Reporter verwendet werden, um Prozesse während der Testausführung zu überwachen. Dieser Reporter kann ressourcenintensiv sein und sollte daher primär für Debugging-Zwecke verwendet werden, wenn Vitest Probleme beim Beenden des Prozesses hat.
npx vitest --reporter=hanging-processexport default defineConfig({
test: {
reporters: ['hanging-process'],
},
});Github Actions Reporter 1.3.0+
Dieser Reporter nutzt Workflow-Befehle, um Testfehler in Form von Anmerkungen darzustellen. Dieser Reporter wird automatisch zusammen mit dem default-Reporter aktiviert, wenn process.env.GITHUB_ACTIONS === 'true'.
Wenn Sie nicht die Standardreporter konfigurieren, müssen Sie github-actions explizit hinzufügen.
export default defineConfig({
test: {
reporters: process.env.GITHUB_ACTIONS ? ['dot', 'github-actions'] : ['dot'],
},
});Eigene Reporter
Um eigene Reporter von Drittanbietern zu verwenden, die über NPM installiert wurden, geben Sie deren Paketnamen in der Option reporters an:
npx vitest --reporter=some-published-vitest-reporterexport default defineConfig({
test: {
reporters: ['some-published-vitest-reporter'],
},
});Zusätzlich können Sie Ihre eigenen benutzerdefinierten Reporter definieren und verwenden, indem Sie ihren Dateipfad angeben:
npx vitest --reporter=./path/to/reporter.tsBenutzerdefinierte Reporter sollten die Reporter-Schnittstelle implementieren.