Srovnání s jinými testovacími nástroji

Jest

Jest se stal dominantním testovacím frameworkem díky podpoře "out of the box" pro většinu JavaScriptových projektů, pohodlnému a intuitivnímu API (it a expect) a kompletní sadě testovacích funkcí, které většina nastavení vyžaduje (snímky, mockování, pokrytí). Jsme vděčni týmu Jest a komunitě za vytvoření příjemného testovacího API a prosazování mnoha testovacích vzorů, které jsou nyní standardem ve webovém ekosystému.

Je možné používat Jest v nastaveních Vite. @sodatea vytvořil vite-jest, jehož cílem je poskytnout prvotřídní integraci Vite pro Jest. Poslední překážky v Jest byly vyřešeny, takže je to platná možnost pro vaše unit testy.

Nicméně, ve světě, kde máme Vite, který poskytuje podporu pro nejběžnější webové nástroje (TypeScript, JSX, nejoblíbenější UI frameworky), Jest představuje zdvojení složitosti. Pokud je vaše aplikace poháněna Vite, není nutné mít dva různé procesy pro konfiguraci a údržbu. S Vitest definujete konfiguraci pro vaše vývojové, build a testovací prostředí jako jediný proces, sdílející stejné pluginy a stejný vite.config.js.

I když vaše knihovna nepoužívá Vite (například pokud je postavena pomocí esbuild nebo Rollup), Vitest je zajímavá možnost, protože vám poskytuje rychlejší běh pro vaše unit testy a zlepšení DX díky výchozímu watch mode používajícímu Vite instant HMR. Vitest nabízí kompatibilitu s většinou Jest API a ekosystémových knihoven, takže ve většině projektů by měl být snadno nahraditelný Jestem.

Cypress

Cypress je testovací nástroj založený na prohlížeči a doplňkový nástroj k Vitest. Pokud chcete používat Cypress, doporučujeme používat Vitest pro veškerou headless logiku ve vaší aplikaci a Cypress pro veškerou logiku založenou na prohlížeči.

Cypress je známý jako nástroj pro end-to-end testování, ale jejich nový component test runner má vynikající podporu pro testování komponent Vite a je ideální volbou pro testování čehokoli, co se vykresluje v prohlížeči.

Testovací nástroje založené na prohlížeči, jako jsou Cypress, WebdriverIO a Web Test Runner, zachytí problémy, které Vitest nemůže, protože používají skutečný prohlížeč a reálné prohlížečové API.

Cypress se zaměřuje na testování viditelnosti, přístupnosti a interaktivity prvků. Cypress je speciálně navržen pro vývoj a testování UI a jeho DX se soustředí na testování vašich vizuálních komponent. Vidíte svou komponentu vykreslenou vedle testovacího reportu. Po dokončení testu zůstává komponenta interaktivní a můžete ladit případné chyby, které se vyskytnou, pomocí vývojářských nástrojů prohlížeče.

Naproti tomu Vitest se zaměřuje na poskytování nejlepší možné DX pro bleskově rychlé, headless testování. Nástroje založené na Node, jako je Vitest, podporují různá částečně implementovaná prohlížečová prostředí, jako je jsdom, která implementují dostatek pro rychlé unit testování jakéhokoli kódu, který odkazuje na prohlížečové API. Nevýhodou je, že tato prohlížečová prostředí mají omezení v tom, co mohou implementovat. Například jsdom postrádá řadu funkcí, jako je window.navigation nebo vykreslovací engine (offsetTop atd.).

A konečně, na rozdíl od Web Test Runner, je Cypress spíše vývojové prostředí (IDE) než testovací nástroj, protože v prohlížeči vidíte také skutečnou vykreslenou komponentu spolu s výsledky testů a protokoly.

Cypress také integroval Vite do svých produktů: přestavuje UI své aplikace pomocí Vitesse a používá Vite k testování vývoje svého projektu.

Věříme, že Cypress není dobrá volba pro unit testování headless kódu, ale že používání Cypress (pro E2E a Component Testing) a Vitest (pro unit testy) by pokrylo potřeby testování vaší aplikace.

WebdriverIO

WebdriverIO je, podobně jako Cypress, alternativní testovací nástroj založený na prohlížeči a doplňkový nástroj k Vitest. Může být použit jako nástroj pro end-to-end testování i pro testování webových komponent. Dokonce používá komponenty Vitest pod kapotou, např. pro vytváření mocků a stubů v rámci testů komponent.

WebdriverIO přichází se stejnými výhodami jako Cypress, což vám umožňuje testovat vaši logiku ve skutečném prohlížeči. Používá však skutečné webové standardy pro automatizaci, což překonává některé kompromisy a omezení při spouštění testů v Cypress. Kromě toho vám umožňuje spouštět testy i na mobilních zařízeních, což vám dává přístup k testování vaší aplikace v ještě více prostředích.

Web Test Runner

@web/test-runner spouští testy uvnitř headless prohlížeče a poskytuje stejné prostředí pro spouštění jako vaše webová aplikace bez nutnosti mockování prohlížečových API nebo DOM. To také umožňuje ladit uvnitř skutečného prohlížeče pomocí vývojářských nástrojů, i když se nezobrazuje žádné UI pro krokování testem, jako je tomu v testech Cypress.

Chcete-li používat @web/test-runner s projektem Vite, použijte @remcovaes/web-test-runner-vite-plugin. @web/test-runner neobsahuje knihovny pro assertion nebo mockování, takže je na vás, abyste je přidali.

uvu

uvu je testovací nástroj pro Node.js a prohlížeč. Spouští testy v jediném vlákně, takže testy nejsou izolované a může docházet k únikům mezi soubory. Vitest však používá worker threads k izolaci testů a jejich paralelnímu spouštění.

Pro transformaci vašeho kódu se uvu spoléhá na require a zavaděcí háky. Vitest používá Vite, takže soubory jsou transformovány s plnou silou systému pluginů Vite. Ve světě, kde máme Vite, který poskytuje podporu pro nejběžnější webové nástroje (TypeScript, JSX, nejoblíbenější UI frameworky), uvu představuje zdvojení složitosti. Pokud je vaše aplikace poháněna Vite, je zbytečné mít dva různé procesy pro konfiguraci a údržbu. S Vitest definujete konfiguraci pro vaše vývojové, build a testovací prostředí jako jediný proces, sdílející stejné pluginy a stejný konfiguraci.

uvu neposkytuje inteligentní watch mode pro opětovné spuštění změněných testů, zatímco Vitest vám dává úžasnou DX díky výchozímu watch mode používajícímu Vite instant HMR.

uvu je rychlá možnost pro spouštění jednoduchých testů, ale Vitest může být rychlejší a spolehlivější pro složitější testy a projekty.