Funkcje

• Konfiguracja, transformacje, resolwery i wtyczki Vite.
• Użyj tej samej konfiguracji, co w Twojej aplikacji, aby uruchomić testy!
• Inteligentny i natychmiastowy tryb obserwacji, działający jak HMR dla testów!
• Testowanie komponentów dla Vue, React, Svelte, Lit i innych
• Obsługa TypeScript / JSX od razu po wyjęciu z pudełka
• ESM first, top level await
• Wielowątkowość za pośrednictwem Workers Tinypool
• Wsparcie dla benchmarków przy użyciu Tinybench
• Filtrowanie, limity czasu, współbieżność dla zestawów testów i pojedynczych testów
• Wsparcie dla Przestrzeni roboczych
• Migawki kompatybilne z Jest
• Wbudowane Chai do asercji oraz API kompatybilne z Jest expect
• Wbudowany Tinyspy do mockowania
• happy-dom lub jsdom do mockowania DOM
• Pokrycie kodu za pośrednictwem v8 lub istanbul
• Testowanie w kodzie źródłowym w stylu Rust
• Testowanie typów za pośrednictwem expect-type

Dowiedz się, jak napisać swój pierwszy test z pomocą wideo

Wspólna konfiguracja dla testów, środowiska deweloperskiego i builda

Konfiguracja, transformacje, resolwery i wtyczki Vite. Użyj tej samej konfiguracji, co w Twojej aplikacji, aby uruchomić testy.

Dowiedz się więcej na Konfigurowanie Vitest.

Tryb obserwacji

$ vitest

Kiedy modyfikujesz kod źródłowy lub pliki testowe, Vitest inteligentnie analizuje graf modułów i ponownie uruchamia tylko powiązane testy, działając jak HMR w Vite!

vitest uruchamia się w trybie obserwacji (watch mode) domyślnie w środowisku deweloperskim oraz w trybie uruchomienia (run mode) w środowisku CI (gdy obecna jest zmienna środowiskowa process.env.CI). Możesz użyć vitest watch lub vitest run, aby jawnie określić pożądany tryb.

Typowe idiomy webowe dostępne od razu

Obsługa ES Module / TypeScript / JSX / PostCSS od razu po wyjęciu z pudełka.

Wątki

Domyślnie Vitest uruchamia pliki testowe w wielu wątkach za pomocą node:worker_threads poprzez Tinypool (lekkiego forka Piscina), umożliwiając jednoczesne uruchamianie testów. Jeśli twój kod testowy nie jest kompatybilny z wielowątkowością, możesz przełączyć się na --pool=forks, który uruchamia testy w wielu procesach za pomocą node:child_process poprzez Tinypool.

Aby uruchomić testy w jednym wątku lub procesie, zobacz poolOptions.

Vitest izoluje również środowisko każdego pliku, więc zmiany w środowisku jednego pliku nie wpływają na inne. Izolację można wyłączyć, przekazując --no-isolate do CLI, co może wpłynąć na poprawność w zamian za wydajność uruchamiania.

Filtrowanie testów

Vitest oferuje wiele sposobów na zawężenie zakresu uruchamianych testów, co przyspiesza testowanie i pozwala skupić się na rozwoju.

Dowiedz się więcej o Filtrowaniu testów.

Uruchamianie testów współbieżnie

Użyj .concurrent w definicji testu, aby uruchomić go współbieżnie.

import { describe, it } from 'vitest';

// Dwa testy oznaczone jako współbieżne zostaną uruchomione równolegle
describe('suite', () => {
  it('serial test', async () => {
    /* ... */
  });
  it.concurrent('concurrent test 1', async ({ expect }) => {
    /* ... */
  });
  it.concurrent('concurrent test 2', async ({ expect }) => {
    /* ... */
  });
});

Jeśli użyjesz .concurrent na zestawie testów (suite), każdy test w nim zostanie uruchomiony równolegle.

import { describe, it } from 'vitest';

// Wszystkie testy w tym zestawie zostaną uruchomione równolegle
describe.concurrent('suite', () => {
  it('concurrent test 1', async ({ expect }) => {
    /* ... */
  });
  it('concurrent test 2', async ({ expect }) => {
    /* ... */
  });
  it.concurrent('concurrent test 3', async ({ expect }) => {
    /* ... */
  });
});

Możesz także używać .skip, .only i .todo z współbieżnymi zestawami testów oraz testami. Przeczytaj więcej w Dokumentacji API.

WARNING

Podczas uruchamiania współbieżnych testów, migawki (Snapshots) i asercje (Assertions) muszą korzystać z expect z lokalnego Kontekstu testowego, aby zapewnić wykrycie właściwego testu.

Migawki

Wsparcie dla migawek kompatybilnych z Jest.

import { expect, it } from 'vitest';

it('renders correctly', () => {
  const result = render();
  expect(result).toMatchSnapshot();
});

Dowiedz się więcej na Migawki.

Kompatybilność Chai i Jest expect

Chai jest wbudowany do asercji, a także API kompatybilne z Jest expect.

Zauważ, że jeśli korzystasz z bibliotek innych firm, które dodają własne matchery, ustawienie test.globals na true poprawi kompatybilność.

Mockowanie

Tinyspy jest wbudowany do mockowania z API kompatybilnym z jest dostępnym poprzez obiekt vi.

import { expect, vi } from 'vitest';

const fn = vi.fn();

fn('hello', 1);

expect(vi.isMockFunction(fn)).toBe(true);
expect(fn.mock.calls[0]).toEqual(['hello', 1]);

fn.mockImplementation(arg => arg);

fn('world', 2);

expect(fn.mock.results[1].value).toBe('world');

Vitest obsługuje zarówno happy-dom, jak i jsdom do mockowania DOM i API przeglądarki. Nie są one dostarczane z Vitest, więc być może trzeba je zainstalować:

$ npm i -D happy-dom
# or
$ npm i -D jsdom

Następnie zmień opcję environment w pliku konfiguracyjnym:

// vitest.config.ts
import { defineConfig } from 'vitest/config';

export default defineConfig({
  test: {
    environment: 'happy-dom', // or 'jsdom', 'node'
  },
});

Dowiedz się więcej na Mockowanie.

Pokrycie

Vitest obsługuje natywne pokrycie kodu za pośrednictwem v8 i instrumentowane pokrycie kodu za pośrednictwem istanbul.

{
  "scripts": {
    "test": "vitest",
    "coverage": "vitest run --coverage"
  }
}

Dowiedz się więcej na Pokrycie.

Testowanie w kodzie źródłowym

Vitest zapewnia również możliwość uruchamiania testów w kodzie źródłowym, obok implementacji, podobnie jak testy modułów w Rust.

Dzięki temu testy dzielą ten sam zakres (closure) co implementacje, co pozwala na testowanie stanów prywatnych bez ich eksportowania. Dodatkowo, skraca to cykl rozwoju.

// src/index.ts

// implementacja
export function add(...args: number[]) {
  return args.reduce((a, b) => a + b, 0);
}

// zestawy testów w kodzie źródłowym
if (import.meta.vitest) {
  const { it, expect } = import.meta.vitest;
  it('add', () => {
    expect(add()).toBe(0);
    expect(add(1)).toBe(1);
    expect(add(1, 2, 3)).toBe(6);
  });
}

Dowiedz się więcej na Testowanie w kodzie źródłowym.

Benchmarking experimental

Od Vitest 0.23.0 możesz uruchamiać testy porównawcze (benchmark) przy użyciu funkcji bench z [Tinybench], aby porównać wydajność różnych rozwiązań.

import { bench, describe } from 'vitest';

describe('sort', () => {
  bench('normal', () => {
    const x = [1, 5, 4, 2, 3];
    x.sort((a, b) => {
      return a - b;
    });
  });

  bench('reverse', () => {
    const x = [1, 5, 4, 2, 3];
    x.reverse().sort((a, b) => {
      return a - b;
    });
  });
});

Testowanie typów experimental

Od Vitest 0.25.0 możesz pisać testy, aby wychwytywać regresje typów. Vitest jest dostarczany z pakietem expect-type, aby zapewnić Ci podobne i łatwe do zrozumienia API.

import { assertType, expectTypeOf } from 'vitest';
import { mount } from './mount.js';

test('my types work properly', () => {
  expectTypeOf(mount).toBeFunction();
  expectTypeOf(mount).parameter(0).toMatchTypeOf<{ name: string }>();

  // @ts-expect-error name is a string
  assertType(mount({ name: 42 }));
});