Moderne React Komponenten-Tests mit dem "Vitest Browser Mode"

Zum Testen von React-Anwendungen ist die "React Testing Library" (RTL) der De-facto-Standard. Nun gibt es seit kurzem den "Vitest Browser Mode". Dieser bietet eine sehr ähnliche API wie die RTL, führt unsere Komponenten aber direkt im Browser aus. Damit erhalten wir realistischere Testergebnisse, ohne gleich end-to-end-Tests schreiben zu müssen.

In diesem Live-Coding-Talk möchte ich euch den Vitest Browser Mode anhand praxisnaher Beispiele vorstellen und euch zeigen, ob und wie ein Umstieg von RTL möglich ist. Dabei sehen wir auch die Integration mit "Mock Service Worker" (MSW), mit denen wir unseren Netzwerkverkehr so realistisch wie möglich simulieren.