Raporlayıcılar

Vitest, test sonuçlarını farklı formatlarda göstermek için çeşitli yerleşik raporlayıcılar sunar ve özel raporlayıcıların kullanımına da olanak tanır. --reporter komut satırı seçeneğini kullanarak veya yapılandırma dosyanızda bir reporters özelliği ekleyerek farklı raporlayıcılar seçebilirsiniz. Herhangi bir raporlayıcı belirtilmediğinde, Vitest aşağıda açıklandığı gibi default raporlayıcısını kullanır.

Komut satırı üzerinden raporlayıcıları kullanma:

npx vitest --reporter=verbose

vitest.config.ts aracılığıyla raporlayıcıları kullanma:

/// <reference types="vitest" />
import { defineConfig } from 'vite';

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

Bazı raporlayıcılar, ek seçeneklerle özelleştirilebilir. Raporlayıcıya özel seçenekler aşağıdaki bölümlerde açıklanmıştır.

TIP

Vitest v1.3.0'dan beri

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

Rapor Çıktısı

Varsayılan olarak, Vitest'in raporlayıcıları çıktıları terminale yazdırır. json, html veya junit raporlayıcılarını kullanırken, testlerinizin çıktısını Vite yapılandırma dosyanızda veya CLI aracılığıyla bir outputFile yapılandırma seçeneği ekleyerek bir dosyaya yazdırabilirsiniz.

CLI

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

vitest.config.ts

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

Raporlayıcıları Birlikte Kullanma

Test sonuçlarınızı farklı formatlarda almak için aynı anda birden fazla raporlayıcı kullanabilirsiniz. Örneğin:

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

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

Yukarıdaki örnek, test sonuçlarını varsayılan stilde terminale yazdıracak ve bunları JSON formatında belirtilen çıktı dosyasına kaydedecektir.

Birden fazla raporlayıcı kullanırken, aşağıdaki gibi birden fazla çıktı dosyası belirtmek de mümkündür:

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

Bu örnek, ayrı JSON ve XML raporları oluşturacak ve terminale ayrıntılı bir rapor yazdıracaktır.

Yerleşik Raporlayıcılar

Varsayılan Raporlayıcı

Varsayılan olarak, hiçbir raporlayıcı belirtilmediğinde, Vitest her test paketi için sonuçları hiyerarşik olarak gösterir ve bir paket geçtiğinde daraltır. Tüm testler tamamlandığında, nihai terminal çıktısı sonuçların bir özetini ve başarısız olan testlerin ayrıntılarını görüntüler.

Devam eden testler için örnek çıktı:

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

Testler bittikten sonraki nihai çıktı:

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

Temel Raporlayıcı

basic raporlayıcısı, çalıştırılan test dosyalarını ve tüm paket çalışmayı bitirdikten sonra sonuçların bir özetini görüntüler. Bireysel testler, yalnızca başarısız olduklarında rapora dahil edilir.

CLI

npx vitest --reporter=basic

vitest.config.ts

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

Temel raporlayıcıyı kullanan örnek çıktı:

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

Ayrıntılı Raporlayıcı

verbose raporlayıcısı, default raporlayıcısı ile aynı hiyerarşik yapıyı izler, ancak geçen test paketleri için alt ağaçları daraltmaz. Son terminal çıktısı, geçen testler de dahil olmak üzere çalıştırılan tüm testleri gösterir.

CLI

npx vitest --reporter=verbose

vitest.config.ts

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

Geçen bir test paketi için son terminal çıktısı örneği:

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

Nokta Raporlayıcı

Çalıştırılan tüm testleri gösterirken en az çıktı sağlamak için tamamlanan her test için tek bir nokta yazdırır. Ayrıntılar yalnızca başarısız olan testler için ve paket için basic raporlayıcı özetiyle birlikte sağlanır.

CLI

npx vitest --reporter=dot

vitest.config.ts

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

Geçen bir test paketi için örnek terminal çıktısı:

....

 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 Raporlayıcı

Test sonuçlarının bir raporunu JUnit XML formatında verir. Terminale yazdırılabilir veya outputFile yapılandırma seçeneği kullanılarak bir XML dosyasına yazılabilir.

CLI

npx vitest --reporter=junit

vitest.config.ts

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

Bir JUnit XML raporu örneği:

<?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>

Çıktılan XML, iç içe geçmiş testsuites ve testcase etiketleri içerir. name ve classname özelliklerini yapılandırmak için VITEST_JUNIT_SUITE_NAME ve VITEST_JUNIT_CLASSNAME ortam değişkenlerini kullanabilirsiniz. Bunlar ayrıca raporlayıcı seçenekleri aracılığıyla da özelleştirilebilir:

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

JSON Raporlayıcı

Test sonuçlarının bir raporunu JSON formatında verir. Terminale yazdırılabilir veya outputFile yapılandırma seçeneği kullanılarak bir dosyaya yazılabilir.

CLI

npx vitest --reporter=json

vitest.config.ts

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

Bir JSON raporu örneği:

{
  "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 Raporlayıcı

Test sonuçlarını etkileşimli bir GUI aracılığıyla görüntülemek için bir HTML dosyası oluşturur. Dosya oluşturulduktan sonra, Vitest yerel bir geliştirme sunucusunu çalışır durumda tutacak ve raporu bir tarayıcıda görüntülemek için bir bağlantı sağlayacaktır.

Çıktı dosyası, outputFile yapılandırma seçeneği kullanılarak belirtilebilir. Herhangi bir outputFile seçeneği sağlanmazsa, yeni bir HTML dosyası oluşturulacaktır.

CLI

npx vitest --reporter=html

vitest.config.ts

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

TIP

Bu raporlayıcı, @vitest/ui paketinin yüklenmesini gerektirir.

TAP Raporlayıcı

Test Anything Protocol (TAP) standardını izleyen bir rapor verir.

CLI

npx vitest --reporter=tap

vitest.config.ts

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

Bir TAP raporu örneği:

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 Raporlayıcı

Düz bir TAP raporu verir. tap raporlayıcısı gibi, test sonuçları da TAP standartlarını izleyecek şekilde biçimlendirilir, ancak test paketleri iç içe geçmiş bir hiyerarşi yerine düz bir liste olarak biçimlendirilir.

CLI

npx vitest --reporter=tap-flat

vitest.config.ts

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

Bir TAP düz raporu örneği:

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

Askıda Kalan İşlem Raporlayıcısı

Vitest'in güvenli bir şekilde çıkmasını engelleyen askıda kalan işlemlerin bir listesini görüntüler. hanging-process raporlayıcısı kendi başına test sonuçlarını görüntülemez, ancak testler çalışırken işlemleri izlemek için başka bir raporlayıcıyla birlikte kullanılabilir. Bu raporlayıcının kullanılması kaynak yoğun olabilir, bu nedenle genellikle Vitest'in süreci tutarlı bir şekilde sonlandıramadığı durumlarda hata ayıklama amaçları için ayrılmalıdır.

CLI

npx vitest --reporter=hanging-process

vitest.config.ts

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

GitHub Actions Raporlayıcısı 1.3.0+

Test hataları için açıklamalar sağlamak üzere iş akışı komutları çıktısı verir. Bu raporlayıcı, process.env.GITHUB_ACTIONS === 'true' olduğunda bir default raporlayıcısı ile otomatik olarak etkinleştirilir.

Varsayılan olmayan raporlayıcıları yapılandırırsanız, github-actions'ı açıkça eklemeniz gerekir.

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

Özel Raporlayıcılar

Raporlayıcılar seçeneğinde paket adlarını belirterek NPM'den yüklenen üçüncü taraf özel raporlayıcıları kullanabilirsiniz:

CLI

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

vitest.config.ts

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

Ek olarak, kendi özel raporlayıcılarınızı tanımlayabilir ve dosya yollarını belirterek bunları kullanabilirsiniz:

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

Özel raporlayıcılar, Reporter arayüzünü uygulamak zorundadır.