Start / Blog

Blog

Vitest: Tests, die sich die Vite-Config teilen

Testen scheitert selten am Schreiben der Tests. Es scheitert daran, dass die Testumgebung anders konfiguriert ist als die Anwendung — und Dinge brechen, die im Browser längst laufen.

Eine Konfiguration statt zwei

Vitest ist ein Vite-nativer Test-Runner: Er nutzt dieselbe Konfiguration und dieselbe Transformationspipeline wie deine App. Kein zweites Build-Setup, keine abweichenden Aliase, keine Überraschungen durch abweichendes Transpiling. Was in der App funktioniert, funktioniert im Test genauso.

Vertraute API, deutlich schneller

Die API ist weitgehend Jest-kompatibeldescribe, it, expect bleiben, wie du sie kennst. Der Umstieg kostet also kaum Einarbeitung. Der spürbare Unterschied liegt im Tempo: ESM und die geteilte Transformation machen Läufe schnell, und der Watch-Mode führt nur die Tests erneut aus, die von einer Änderung betroffen sind.

Drei Schritte zum Setup

Mehr braucht es nicht: vitest, jsdom und die Testing-Library installieren, in der vite.config die Umgebung auf jsdom setzen, ein test-Script in die package.json. Danach steht das Component Testing.

Mehr dazu im Seminar

Vom Setup über Component Testing bis zu interaktiven Tests mit Nutzer-Ereignissen führt das Modul Testing mit Vitest.

Zum Seminar React v19 Grundlagen & Moderne Features

← Alle Beiträge