Reportéři

Vitest nabízí několik vestavěných reportérů pro zobrazení výstupu testů v různých formátech a umožňuje používat i vlastní reportéry. Reportéry lze vybrat pomocí volby příkazového řádku --reporter nebo definováním vlastnosti reporters v konfiguračním souboru. Pokud není zadán žádný reportér, Vitest použije výchozí reportér default, popsaný níže.

Použití reportérů prostřednictvím příkazového řádku:

bash

npx vitest --reporter=verbose

Použití reportérů prostřednictvím vitest.config.ts:

import { defineConfig } from 'vitest/config';

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

Některé reportéry umožňují další přizpůsobení pomocí voleb. Specifické volby reportérů jsou popsány v následujících sekcích.

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

Výstup reportérů

Ve výchozím nastavení reportéři Vitest vypisují svůj výstup do terminálu. Při použití reportérů json, html nebo junit můžete výstup testů uložit do souboru pomocí volby outputFile v konfiguraci, a to buď v konfiguračním souboru Vite, nebo prostřednictvím CLI.

CLIvitest.config.ts

bash

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

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

Kombinování reportérů

Můžete současně používat více reportérů pro tisk výsledků testů v různých formátech. Například:

bash

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

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

Výše uvedený příklad vytiskne výsledky testů do terminálu ve výchozím formátu a zároveň je uloží ve formátu JSON do určeného výstupního souboru.

Při použití více reportérů je také možné určit více výstupních souborů, jak je uvedeno níže:

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

Tento příklad vytvoří samostatné reporty ve formátech JSON a XML a zároveň vypíše podrobnou zprávu do terminálu.

Vestavěné reportéry

Výchozí reportér

Pokud není zadán žádný reportér (tj. ve výchozím nastavení), Vitest zobrazuje výsledky pro každou sadu testů hierarchicky během jejího běhu a po úspěšném dokončení sadu sbalí. Po dokončení všech testů se ve finálním výstupu terminálu zobrazí souhrn výsledků a podrobnosti o všech neúspěšných testech.

Příklad výstupu pro probíhající testy:

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

Finální výstup po dokončení testů:

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)

Základní reportér

Reportér basic zobrazuje spuštěné testovací soubory a souhrn výsledků po dokončení celé sady. Jednotlivé testy jsou zahrnuty do zprávy pouze v případě, že selžou.

CLIvitest.config.ts

bash

npx vitest --reporter=basic

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

Příklad výstupu se základním reportérem:

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)

Podrobný reportér

Sleduje stejnou hierarchickou strukturu jako reportér default, ale neskrývá podstromy pro úspěšné testovací sady. Finální výstup terminálu zobrazuje všechny testy, které byly spuštěny, včetně těch, které prošly.

CLIvitest.config.ts

bash

npx vitest --reporter=verbose

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

Příklad finálního výstupu terminálu pro úspěšnou sadu testů vypadá takto:

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)

Tečkový reportér

Vytiskne jednu tečku za každý dokončený test, čímž poskytuje minimální výstup a zároveň zobrazuje všechny spuštěné testy. Podrobnosti jsou poskytovány pouze pro neúspěšné testy spolu se souhrnem reportéru basic pro sadu.

CLIvitest.config.ts

bash

npx vitest --reporter=dot

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

Příklad výstupu terminálu pro úspěšnou sadu testů vypadá takto:

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 reportér

Vypíše zprávu o výsledcích testů ve formátu JUnit XML. Může být vytištěna do terminálu nebo zapsána do souboru XML pomocí konfigurační volby outputFile.

CLIvitest.config.ts

bash

npx vitest --reporter=junit

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

Příklad zprávy ve formátu JUnit XML vypadá takto:

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>

Výstupní XML obsahuje vnořené značky testsuites a testcase. Tyto atributy můžete konfigurovat pomocí možností reportéra:

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

JSON reportér

Vypíše zprávu o výsledcích testů ve formátu JSON. Může být vytištěna do terminálu nebo zapsána do souboru pomocí konfigurační volby outputFile.

CLIvitest.config.ts

bash

npx vitest --reporter=json

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

Příklad zprávy ve formátu JSON vypadá takto:

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"
    }
  ]
}

HTML reportér

Generuje soubor HTML pro zobrazení výsledků testů prostřednictvím interaktivního GUI. Po vygenerování souboru Vitest spustí lokální vývojový server a zobrazí odkaz pro zobrazení zprávy v prohlížeči.

Výstupní soubor lze zadat pomocí konfigurační volby outputFile. Pokud není zadána žádná volba outputFile, bude vytvořen nový soubor HTML.

CLIvitest.config.ts

bash

npx vitest --reporter=html

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

TIP

Tento reportér vyžaduje nainstalovaný balíček @vitest/ui.

TAP reportér

Vypíše zprávu podle Test Anything Protocol (TAP).

CLIvitest.config.ts

bash

npx vitest --reporter=tap

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

Příklad zprávy ve formátu TAP vypadá takto:

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 Flat reportér

Vypíše plochou zprávu TAP. Stejně jako reportér tap jsou výsledky testů formátovány tak, aby odpovídaly standardům TAP, ale sady testů jsou formátovány jako plochý seznam spíše než vnořená hierarchie.

CLIvitest.config.ts

bash

npx vitest --reporter=tap-flat

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

Příklad ploché zprávy ve formátu TAP vypadá takto:

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

Reportér visících procesů

Samotný reportér hanging-process nezobrazuje výsledky testů, ale lze jej použít ve spojení s jiným reportérem pro sledování procesů během testování. Použití tohoto reportéru může být náročné na systémové zdroje, takže by mělo být obecně vyhrazeno pro účely ladění v situacích, kdy Vitest nedokáže správně ukončit běh.

CLIvitest.config.ts

bash

npx vitest --reporter=hanging-process

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

GitHub Actions reportér

Vypisuje příkazy pracovního postupu pro anotace selhávajících testů. Tento reportér je automaticky aktivován spolu s reportérem [default], pokud process.env.GITHUB_ACTIONS === 'true'.

Pokud nastavujete jiné než výchozí reportéry, musíte explicitně přidat github-actions.

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

Blob Reporter

Ukládá výsledky testů na stroj, takže je lze později sloučit pomocí příkazu --merge-reports. Ve výchozím nastavení ukládá všechny výsledky do složky .vitest-reports, ale lze to přepsat pomocí příznaků --outputFile nebo --outputFile.blob.

bash

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

Doporučujeme použít tento reportér, pokud spouštíte Vitest na různých počítačích s příznakem --shard. Všechny blob reporty lze sloučit do jakéhokoli reportu pomocí příkazu --merge-reports na konci vašeho CI pipeline:

bash

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

TIP

Jak --reporter=blob, tak i --merge-reports nefungují v režimu watch.

Vlastní reportéři

Můžete použít reportéry třetích stran nainstalované z NPM. Stačí zadat název balíčku v nastavení reportérů:

CLIvitest.config.ts

bash

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

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

Kromě toho můžete definovat vlastní reportéry a používat je zadáním jejich cesty k souboru:

bash

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

Vlastní reportéři by měli implementovat rozhraní Reporter.

Reportéři ​

Výstup reportérů ​

Kombinování reportérů ​

Vestavěné reportéry ​

Výchozí reportér ​

Základní reportér ​

Podrobný reportér ​

Tečkový reportér ​

JUnit reportér ​

JSON reportér ​

HTML reportér ​

TAP reportér ​

TAP Flat reportér ​

Reportér visících procesů ​

GitHub Actions reportér ​

Blob Reporter ​

Vlastní reportéři ​

Reportéři

Výstup reportérů

Kombinování reportérů

Vestavěné reportéry

Výchozí reportér

Základní reportér

Podrobný reportér

Tečkový reportér

JUnit reportér

JSON reportér

HTML reportér

TAP reportér

TAP Flat reportér

Reportér visících procesů

GitHub Actions reportér

Blob Reporter

Vlastní reportéři