Funkciók

• Vite konfigurációk, transzformerek, feloldók és bővítmények támogatása
• Ugyanazt a beállítást használja az alkalmazásban a tesztek futtatásához.
• Intelligens és azonnali figyelő mód, hasonlóan a HMR-hez a tesztek esetében.
• Komponens tesztelés Vue, React, Svelte, Lit, Marko és más keretrendszerek számára.
• TypeScript és JSX támogatás alapértelmezés szerint.
• ESM-központú működés, top-level await támogatással.
• Többszálú feldolgozás worker szálakkal a Tinypool segítségével.
• Teljesítménytesztelés támogatása a Tinybench segítségével.
• Szűrés, időtúllépések és párhuzamos futtatás a tesztcsomagokhoz és tesztekhez.
• Munkaterület támogatás.
• Jest-kompatibilis Snapshot tesztelés.
• Chai beépítve az állításokhoz + Jest expect kompatibilis API-k.
• Tinyspy beépítve a mockinghoz.
• happy-dom vagy jsdom a DOM mockinghoz.
• Böngésző mód a komponens tesztek böngészőben való futtatásához.
• Kódlefedettség a v8 vagy istanbul segítségével.
• Rust-szerű forráskódon belüli tesztelés.
• Típus tesztelés az expect-type segítségével.
• Sharding támogatás.

Tanulja meg, hogyan írja meg első tesztjét videó segítségével

Megosztott konfiguráció a teszt, fejlesztés és build között

A Vitest támogatja a Vite konfigurációit, transzformereit, feloldóit és bővítményeit. Ezáltal ugyanazt a beállítást használhatja az alkalmazásból a tesztek futtatásához.

További információ: Vitest konfigurálása.

Figyelő mód

$ vitest

Amikor módosítja a forráskódot vagy a tesztfájlokat, a Vitest intelligensen átvizsgálja a modulgráfot, és csak a kapcsolódó teszteket futtatja újra, akárcsak a HMR a Vite-ben.

A vitest alapértelmezés szerint watch mode-ban indul fejlesztői környezetben, és intelligensen run mode-ban CI környezetben (amikor process.env.CI jelen van). Használhatja a vitest watch vagy vitest run parancsot a kívánt mód explicit megadásához.

Indítsa el a Vitest-et a --standalone flaggel, hogy a háttérben fusson. Ebben a módban nem futtat teszteket, amíg azok nem változnak. A Vitest nem futtat teszteket a forráskód módosítása esetén, amíg a forrást importáló tesztet nem futtatták le.

Gyakori webes minták alapértelmezés szerint

Alapértelmezett ES Modul, TypeScript, JSX támogatás és PostCSS.

Szálak

Alapértelmezés szerint a Vitest több folyamatban futtatja a tesztfájlokat a node:child_process használatával, a Tinypool (a Piscina könnyűsúlyú forkja) révén, lehetővé téve a tesztek egyidejű futtatását. Ha még tovább szeretné gyorsítani a tesztcsomagot, fontolja meg a --pool=threads engedélyezését a tesztek node:worker_threads segítségével történő futtatásához (vegye figyelembe, hogy egyes csomagok nem működhetnek ezzel a beállítással).

A tesztek egyetlen szálban vagy folyamatban való futtatásához lásd a poolOptions részt.

A Vitest emellett izolálja az egyes fájlok környezetét, így az egyik fájlban végrehajtott környezeti változások nem befolyásolják a többit. Az izoláció letiltható a --no-isolate átadásával a CLI-nek (a helyesség rovására, a futtatási teljesítményért cserébe).

Teszt szűrés

A Vitest számos módot kínál a futtatandó tesztek szűkítésére, felgyorsítva ezzel a tesztelést, hogy a fejlesztésre koncentrálhasson.

További információ a Teszt szűrésről.

Tesztek párhuzamos futtatása

Használja a .concurrent metódust egymást követő tesztekben a párhuzamos indításhoz.

import { describe, it } from 'vitest';

// A két, concurrent jelölésű teszt párhuzamosan indul el
describe('suite', () => {
  it('serial test', async () => {
    /* ... */
  });
  it.concurrent('concurrent test 1', async ({ expect }) => {
    /* ... */
  });
  it.concurrent('concurrent test 2', async ({ expect }) => {
    /* ... */
  });
});

Ha .concurrent jelölést használ egy tesztcsomagon, akkor az összes teszt párhuzamosan indul el benne.

import { describe, it } from 'vitest';

// A tesztcsomagon belüli összes teszt párhuzamosan indul el
describe.concurrent('suite', () => {
  it('concurrent test 1', async ({ expect }) => {
    /* ... */
  });
  it('concurrent test 2', async ({ expect }) => {
    /* ... */
  });
  it.concurrent('concurrent test 3', async ({ expect }) => {
    /* ... */
  });
});

Használhatja a .skip, .only és .todo parancsokat is a párhuzamos tesztcsomagokkal és tesztekkel. További információ az API Referenciában.

WARNING

Párhuzamos tesztek futtatásakor a Snapshotoknak és az állításoknak a helyi Teszt környezetből származó expect-et kell használniuk a megfelelő teszt észleléséhez.

Snapshot

Jest-kompatibilis snapshot támogatás.

import { expect, it } from 'vitest';

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

További információ a Snapshotról.

Chai és Jest expect kompatibilitása

A Chai beépített támogatást nyújt az állításokhoz Jest expect-kompatibilis API-kkal.

Vegye figyelembe, hogy ha harmadik féltől származó könyvtárakat használ, amelyek matcher-eket adnak hozzá, a test.globals true értékre állítása jobb kompatibilitást biztosít.

Mocking

A Tinyspy beépített támogatást nyújt a mockinghoz jest-kompatibilis API-kkal a vi objektumon.

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: string) => arg);

fn('world', 2);

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

A Vitest támogatja a happy-dom vagy a jsdom használatát a DOM és böngésző API-k mockingjához. Ezek nem tartoznak a Vitesthez, külön kell telepíteni őket:

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

Ezt követően módosítsa az environment opciót a konfigurációs fájlban:

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

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

További információ a Mockingról.

Lefedettség

A Vitest támogatja a natív kódlefedettséget a v8 által, és az instrumentált kódlefedettséget az istanbul által.

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

További információ a Lefedettségről.

Forráskódon belüli tesztelés

A Vitest lehetővé teszi a tesztek futtatását a forráskódon belül, az implementációval együtt, hasonlóan a Rust modul tesztjeihez.

Ezáltal a tesztek ugyanazt a scope-ot osztják meg, mint az implementációk, és képesek tesztelni a privát állapotokat exportálás nélkül. Eközben gyorsabb lesz a visszajelzési ciklus a fejlesztéshez.

// src/index.ts

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

// forráskódon belüli tesztcsomagok
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);
  });
}

További információ a Forráskódon belüli tesztelésről.

Benchmarking Kísérleti

Végezhet teljesítményteszteket a bench függvénnyel a Tinybench segítségével a teljesítményeredmények összehasonlításához.

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;
    });
  });
});

Típus tesztelés Kísérleti

Írhat teszteket a típusregressziók felismerésére. A Vitest az expect-type csomaggal érkezik, hogy hasonló és könnyen érthető API-t biztosítson.

import { assertType, expectTypeOf, test } 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 }));
});

Sharding

Futtasson teszteket különböző gépeken a --shard és --reporter=blob flagek segítségével. Minden teszt- és lefedettségi eredmény egyesíthető a CI pipeline végén a --merge-reports paranccsal:

vitest --shard=1/2 --reporter=blob
vitest --shard=2/2 --reporter=blob
vitest --merge-reports --reporter=junit --coverage.reporter=text

További információért lásd a Teljesítmény javítása | Sharding részt.

Környezeti változók

A Vitest kizárólag a VITE_ előtaggal ellátott környezeti változókat tölti be a .env fájlokból, hogy fenntartsa a kompatibilitást a frontend tesztekkel, betartva a Vite által megállapított konvenciót. Ahhoz, hogy minden környezeti változót betöltsön a .env fájlokból, használhatja a loadEnv metódust, amelyet a vite-ből importál:

import { loadEnv } from 'vite';
import { defineConfig } from 'vitest/config';

export default defineConfig(({ mode }) => ({
  test: {
    // a mód határozza meg, hogy melyik ".env.{mode}" fájlt válassza, ha az létezik
    env: loadEnv(mode, process.cwd(), ''),
  },
}));