Passer au contenu

Fonctionnalités

<FeaturesList class=“!gap-1 text-lg” />

<div h-2 />

Configuration Partagée entre Test, Développement et Construction

La configuration de Vite, les transformateurs, les résolveurs et les plugins. Utilisez la même configuration que celle de votre application pour exécuter les tests.

En savoir plus sur Configuration de Vitest.

Mode Surveillance

Fenêtre de terminal
$ vitest

Lorsque vous modifiez votre code source ou les fichiers de test, Vitest recherche intelligemment le graphe de modules et ne relance que les tests concernés, tout comme le HMR fonctionne dans Vite!

vitest démarre en mode surveillance par défaut dans l’environnement de développement et en mode exécution dans l’environnement CI (lorsque process.env.CI est présent) de manière intelligente. Vous pouvez utiliser vitest watch ou vitest run pour spécifier explicitement le mode souhaité.

Démarrez Vitest avec le drapeau --standalone pour le garder en cours d’exécution en arrière-plan. Il n’exécutera aucun test jusqu’à ce qu’ils changent. Vitest ne lancera pas les tests si le code source est modifié jusqu’à ce que le test qui importe la source ait été exécuté.

Idiomes Web Communs Prêts à l’Emploi

Support ES Module / TypeScript / JSX / PostCSS prêt à l’emploi.

Threads

Par défaut, Vitest exécute les fichiers de test dans plusieurs processus en utilisant node:child_process via Tinypool (un fork léger de Piscina), permettant aux tests de s’exécuter simultanément. Si vous souhaitez accélérer encore plus votre suite de tests, envisagez d’activer --pool=threads pour exécuter les tests en utilisant node:worker_threads (attention, certaines bibliothèques pourraient ne pas fonctionner avec cette configuration).

Pour exécuter des tests dans un seul thread ou processus, consultez poolOptions.

Vitest isole également l’environnement de chaque fichier afin que les mutations d’environnement dans un fichier n’affectent pas les autres. L’isolation peut être désactivée en passant --no-isolate à la CLI (au détriment de la précision pour la performance d’exécution).

Filtrage des Tests

Vitest fournit de nombreuses façons de réduire le nombre de tests à exécuter afin d’accélérer les tests pour que vous puissiez vous concentrer sur le développement.

En savoir plus sur Filtrage des Tests.

Exécution Concurrente des Tests

Utilisez .concurrent dans des tests consécutifs pour les démarrer en parallèle.

import { describe, it } from 'vitest'
// Les deux tests marqués comme concurrent seront démarrés en parallèle
describe('suite', () => {
it('test sériel', async () => { /* ... */ })
it.concurrent('test concurrent 1', async ({ expect }) => { /* ... */ })
it.concurrent('test concurrent 2', async ({ expect }) => { /* ... */ })
})

Si vous utilisez .concurrent sur une suite, chaque test dedans sera démarré en parallèle.

import { describe, it } from 'vitest'
// Tous les tests dans cette suite seront démarrés en parallèle
describe.concurrent('suite', () => {
it('test concurrent 1', async ({ expect }) => { /* ... */ })
it('test concurrent 2', async ({ expect }) => { /* ... */ })
it.concurrent('test concurrent 3', async ({ expect }) => { /* ... */ })
})

Vous pouvez également utiliser .skip, .only, et .todo avec des suites et tests concurrents. Lisez-en plus dans la Référence API.

Instantané

Support d’instantanés compatible Jest.

import { expect, it } from 'vitest'
it('rendra correctement', () => {
const result = render()
expect(result).toMatchSnapshot()
})

En savoir plus sur Instantané.

Compatibilité Chai et Jest expect

Chai est intégré pour des assertions avec les API Jest expect-compatibles.

Notez que si vous utilisez des bibliothèques tierces qui ajoutent des matchers, définir test.globals sur true fournira une meilleure compatibilité.

Simulation

Tinyspy est intégré pour la simulation avec des API compatibles jest sur l’objet 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: string) => arg)
fn('world', 2)
expect(fn.mock.results[1].value).toBe('world')

Vitest prend en charge à la fois happy-dom ou jsdom pour la simulation des API DOM et navigateur. Ils ne sont pas fournis avec Vitest, vous devrez les installer séparément :

Fenêtre de terminal
$ npm i -D happy-dom
# ou
$ npm i -D jsdom

Après cela, changez l’option environment dans votre fichier de configuration :

vitest.config.ts
import { defineConfig } from 'vitest/config'
export default defineConfig({
test: {
environment: 'happy-dom', // ou 'jsdom', 'node'
},
})

En savoir plus sur Simulation.

Couverture

Vitest prend en charge la couverture de code natif via v8 et la couverture de code instrumentée via istanbul.

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

En savoir plus sur Couverture.

Tests en Source

Vitest fournit également un moyen d’exécuter des tests au sein de votre code source en même temps que l’implémentation, similaire aux tests de module de Rust.

Cela permet aux tests de partager la même fermeture que les implémentations et de tester des états privés sans avoir à les exporter. Parallèlement, cela rapproche également la boucle de rétroaction pour le développement.

src/index.ts
// l'implémentation
export function add(...args: number[]): number {
return args.reduce((a, b) => a + b, 0)
}
// suites de tests en source
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)
})
}

En savoir plus sur Tests en Source.

Évaluation de Performance Expérimental

Vous pouvez exécuter des tests de référence avec la fonction bench via Tinybench pour comparer les résultats de performance.

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
})
})
})
Rapport de Benchmark Rapport de Benchmark

Tests de Type Expérimental

Vous pouvez écrire des tests pour détecter les régressions de type. Vitest est livré avec le package expect-type pour vous fournir une API similaire et facile à comprendre.

import { assertType, expectTypeOf, test } from 'vitest'
import { mount } from './mount.js'
test('mes types fonctionnent correctement', () => {
expectTypeOf(mount).toBeFunction()
expectTypeOf(mount).parameter(0).toMatchTypeOf<{ name: string }>()
// @ts-expect-error name est une chaîne
assertType(mount({ name: 42 }))
})

Partitionnement

Exécutez des tests sur différentes machines en utilisant les drapeaux --shard et --reporter=blob. Tous les résultats de tests et de couverture peuvent être fusionnés à la fin de votre pipeline CI en utilisant la commande --merge-reports :

Fenêtre de terminal
vitest --shard=1/2 --reporter=blob
vitest --shard=2/2 --reporter=blob
vitest --merge-reports --reporter=junit --coverage.reporter=text

Consultez Améliorer la Performance | Partitionnement pour plus d’informations.

Variables d’Environnement

Vitest charge automatiquement les variables d’environnement préfixées par VITE_ à partir des fichiers .env pour maintenir la compatibilité avec les tests liés au frontend, conformément à la convention établie par Vite. Pour charger toutes les variables environnementales à partir des fichiers .env, vous pouvez utiliser la méthode loadEnv importée de vite :

import { loadEnv } from 'vite'
import { defineConfig } from 'vitest/config'
export default defineConfig(({ mode }) => ({
test: {
// le mode définit quel fichier ".env.{mode}" choisir s'il existe
env: loadEnv(mode, process.cwd(), ''),
},
}))