Reportery

Vitest oferuje kilka wbudowanych reporterów do wyświetlania wyników testów w różnych formatach, a także umożliwia korzystanie z niestandardowych reporterów. Możesz wybrać reporterów, używając opcji --reporter w wierszu poleceń lub dodając właściwość reporters do pliku konfiguracji. Jeśli nie zostanie wskazany żaden reporter, Vitest użyje reportera default, zgodnie z opisem poniżej.

Używanie reporterów za pośrednictwem wiersza poleceń:

bash

npx vitest --reporter=verbose

Używanie reporterów za pośrednictwem vitest.config.ts:

import { defineConfig } from 'vitest/config';

export default defineConfig({
  test: {
    reporters: ['verbose'],
  },
});

Niektóre reportery można dostosować, przekazując dodatkowe opcje. Opcje specyficzne dla reportera są opisane w poniższych sekcjach.

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

Dane wyjściowe reportera

Domyślnie reportery Vitest drukują wyniki w terminalu. W przypadku reporterów json, html lub junit możesz zamiast tego zapisać wyniki testów do pliku, dodając opcję konfiguracji outputFile w pliku konfiguracyjnym Vite lub za pośrednictwem CLI.

CLIvitest.config.ts

bash

npx vitest --reporter=json --outputFile=./test-output.json

export default defineConfig({
  test: {
    reporters: ['json'],
    outputFile: './test-output.json',
  },
});

Łączenie reporterów

Możesz jednocześnie używać wielu reporterów do drukowania wyników testów w różnych formatach. Na przykład:

bash

npx vitest --reporter=json --reporter=default

export default defineConfig({
  test: {
    reporters: ['json', 'default'],
    outputFile: './test-output.json',
  },
});

Powyższy przykład zarówno wydrukuje wyniki testów do terminala w domyślnym stylu, jak i zapisze je jako JSON do wyznaczonego pliku wyjściowego.

Używając wielu reporterów, możliwe jest również wyznaczenie wielu plików wyjściowych, w następujący sposób:

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

Ten przykład zapisze oddzielne raporty JSON i XML, a także wydrukuje szczegółowy raport do terminala.

Wbudowane reportery

Domyślny reporter

Domyślnie (czyli gdy nie wybrano żadnego reportera), Vitest wyświetli podsumowanie uruchomionych testów i ich statusu na dole. Gdy zestaw testów zostanie zaliczony, jego status zostanie wyświetlony na górze podsumowania.

Możesz wyłączyć podsumowanie, konfigurując reportera:

vitest.config.ts

export default defineConfig({
  test: {
    reporters: [['default', { summary: false }]],
  },
});

Przykładowe dane wyjściowe podczas wykonywania testów:

bash

 ✓ 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

Końcowe wyjście po zakończeniu testów:

bash

 ✓ 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)

Podstawowy reporter

Reporter basic jest równoważny reporterowi default bez summary.

CLIvitest.config.ts

bash

npx vitest --reporter=basic

export default defineConfig({
  test: {
    reporters: ['basic'],
  },
});

Przykładowe wyjście przy użyciu podstawowego reportera:

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)

Szczegółowy reporter

Szczegółowy reporter działa tak samo jak reporter default, ale wyświetla również każdy pojedynczy test po zakończeniu pakietu. Wyświetla również aktualnie uruchomione testy, których czas wykonania przekracza slowTestThreshold. Podobnie jak w przypadku reportera default, możesz wyłączyć podsumowanie, konfigurując reportera.

CLIvitest.config.ts

bash

npx vitest --reporter=verbose

export default defineConfig({
  test: {
    reporters: [['verbose', { summary: false }]],
  },
});

Przykładowe wyjście dla testów w toku z domyślnym slowTestThreshold: 300:

bash

 ✓ __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

Przykład końcowego wyjścia terminala dla przechodzącego pakietu testów:

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)

Reporter kropek

Wyświetla pojedynczą kropkę dla każdego ukończonego testu, aby zapewnić minimalny wynik, jednocześnie wskazując wszystkie uruchomione testy. Szczegóły są dostępne tylko dla nieudanych testów, uzupełnione o podsumowanie reportera basic dla pakietu.

CLIvitest.config.ts

bash

npx vitest --reporter=dot

export default defineConfig({
  test: {
    reporters: ['dot'],
  },
});

Przykładowe wyjście terminala dla przechodzącego pakietu testów:

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)

Reporter JUnit

Generuje raport wyników testów w formacie XML JUnit. Może być wyświetlany w terminalu lub zapisywany do pliku XML za pomocą opcji konfiguracji outputFile.

CLIvitest.config.ts

bash

npx vitest --reporter=junit

export default defineConfig({
  test: {
    reporters: ['junit'],
  },
});

Przykład raportu 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>

Wygenerowany XML zawiera zagnieżdżone tagi testsuites i testcase. Można je również dostosować za pomocą opcji konfiguracji reportera suiteName i classnameTemplate. classnameTemplate może być albo łańcuchem szablonu, albo funkcją.

Obsługiwane symbole zastępcze dla opcji classnameTemplate to:

filename
filepath

export default defineConfig({
  test: {
    reporters: [
      [
        'junit',
        {
          suiteName: 'niestandardowa nazwa pakietu',
          classnameTemplate: 'filename:{filename} - filepath:{filepath}',
        },
      ],
    ],
  },
});

Reporter JSON

Generuje raport wyników testów w formacie JSON kompatybilnym z opcją --json Jest. Może być wyświetlany w terminalu lub zapisywany do pliku za pomocą opcji konfiguracji outputFile.

CLIvitest.config.ts

bash

npx vitest --reporter=json

export default defineConfig({
  test: {
    reporters: ['json'],
  },
});

Przykład raportu 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": ["", "pierwszy plik testowy"],
          "fullName": " pierwszy plik testowy 2 + 2 powinno równać się 4",
          "status": "failed",
          "title": "2 + 2 powinno równać się 4",
          "duration": 9,
          "failureMessages": ["oczekiwano 4, a otrzymano 5 // równość Object.is"],
          "location": {
            "line": 20,
            "column": 28
          },
          "meta": {}
        }
      ],
      "startTime": 1697737019787,
      "endTime": 1697737019797,
      "status": "failed",
      "message": "",
      "name": "/root-directory/__tests__/test-file-1.test.ts"
    }
  ],
  "coverageMap": {}
}

INFO

Od Vitest 3, reporter JSON zawiera informacje o pokryciu w coverageMap, jeśli pokrycie jest włączone.

Reporter HTML

Generuje plik HTML umożliwiający przeglądanie wyników testów za pośrednictwem interaktywnego GUI. Po wygenerowaniu pliku, Vitest utrzyma lokalny serwer deweloperski i udostępni link do przeglądania raportu w przeglądarce.

Plik wyjściowy można określić za pomocą opcji konfiguracji outputFile. Jeśli opcja outputFile nie zostanie podana, zostanie utworzony nowy plik HTML.

CLIvitest.config.ts

bash

npx vitest --reporter=html

export default defineConfig({
  test: {
    reporters: ['html'],
  },
});

TIP

Ten reporter wymaga zainstalowanego pakietu @vitest/ui.

Reporter TAP

Generuje raport zgodny z Test Anything Protocol (TAP).

CLIvitest.config.ts

bash

npx vitest --reporter=tap

export default defineConfig({
  test: {
    reporters: ['tap'],
  },
});

Przykład raportu 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
    }
}

Reporter TAP Flat

Wyświetla płaski raport TAP. Podobnie jak reporter tap, wyniki testów są formatowane zgodnie ze standardami TAP, jednak pakiety testów są prezentowane jako płaska lista, a nie zagnieżdżona hierarchia.

CLIvitest.config.ts

bash

npx vitest --reporter=tap-flat

export default defineConfig({
  test: {
    reporters: ['tap-flat'],
  },
});

Przykład płaskiego raportu 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

Reporter zawieszonych procesów

Wyświetla listę zawieszonych procesów, jeśli którekolwiek z nich uniemożliwiają Vitest bezpieczne zakończenie. Reporter hanging-process sam w sobie nie wyświetla wyników testów, ale może być używany w połączeniu z innym reporterem do monitorowania procesów podczas uruchamiania testów. Używanie tego reportera może być zasobochłonne, więc powinno być zazwyczaj zarezerwowane do celów debugowania w sytuacjach, gdy Vitest konsekwentnie nie może zakończyć procesu.

CLIvitest.config.ts

bash

npx vitest --reporter=hanging-process

export default defineConfig({
  test: {
    reporters: ['hanging-process'],
  },
});

Reporter GitHub Actions

Generuje polecenia przepływu pracy w celu dostarczenia adnotacji dla nieudanych testów. Ten reporter jest automatycznie włączany wraz z reporterem default, gdy process.env.GITHUB_ACTIONS === 'true'.

Jeśli skonfigurujesz reportery inne niż domyślne, musisz jawnie dodać github-actions.

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

Możesz dostosować ścieżki plików, które są wyświetlane w formacie poleceń adnotacji GitHub, używając opcji onWritePath. Jest to przydatne podczas uruchamiania Vitest w środowisku kontenerowym, takim jak Docker, gdzie ścieżki plików mogą nie być zgodne ze ścieżkami w środowisku 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'],
  },
});

Reporter Blob

Przechowuje wyniki testów lokalnie, aby można je było później połączyć za pomocą polecenia --merge-reports. Domyślnie przechowuje wszystkie wyniki w folderze .vitest-reports, ale można to zmienić za pomocą flag --outputFile lub --outputFile.blob.

bash

npx vitest --reporter=blob --outputFile=reports/blob-1.json

Zalecamy użycie tego reportera, jeśli uruchamiasz Vitest na różnych maszynach z flagą --shard. Wszystkie raporty blob można połączyć, a następnie wygenerować z nich dowolny typ raportu, używając polecenia --merge-reports na końcu potoku CI:

bash

npx vitest --merge-reports=reports --reporter=json --reporter=default

TIP

Zarówno --reporter=blob, jak i --merge-reports nie działają w trybie watch.

Niestandardowe reportery

Możesz używać niestandardowych reporterów innych firm zainstalowanych z NPM, określając ich nazwę pakietu w opcji konfiguracji reporterów:

CLIvitest.config.ts

bash

npx vitest --reporter=some-published-vitest-reporter

export default defineConfig({
  test: {
    reporters: ['some-published-vitest-reporter'],
  },
});

Dodatkowo możesz zdefiniować własne niestandardowe reportery i używać ich, podając ich ścieżkę pliku:

bash

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

Niestandardowe reportery powinny implementować interfejs Reporter.

Reportery ​

Dane wyjściowe reportera ​

Łączenie reporterów ​

Wbudowane reportery ​

Domyślny reporter ​

Podstawowy reporter ​

Szczegółowy reporter ​

Reporter kropek ​

Reporter JUnit ​

Reporter JSON ​

Reporter HTML ​

Reporter TAP ​

Reporter TAP Flat ​

Reporter zawieszonych procesów ​

Reporter GitHub Actions ​

Reporter Blob ​

Niestandardowe reportery ​

Reportery

Dane wyjściowe reportera

Łączenie reporterów

Wbudowane reportery

Domyślny reporter

Podstawowy reporter

Szczegółowy reporter

Reporter kropek

Reporter JUnit

Reporter JSON

Reporter HTML

Reporter TAP

Reporter TAP Flat

Reporter zawieszonych procesów

Reporter GitHub Actions

Reporter Blob

Niestandardowe reportery