DEV Community

Cover image for From Jest to Vitest - Migration and Benchmark

From Jest to Vitest - Migration and Benchmark

Matti Bar-Zeev on January 21, 2022

In this post join me as I migrate my project’s test runner framework from Jest to Vitest, and check if it is really as they claim - “A blazing fast...
Collapse
 
elthrasher profile image
Matt Morgan

My friends, family and colleagues told me I shouldn't run off after another test framework, but now I know we're right and they're wrong. Thanks for this article!

Collapse
 
jjhiggz profile image
Jonathan Higger • Edited

I've been using vitest because of remix stacks. Almost everything feels the same as jest but I notice a few things pragmatically.

Pros

  • nicer coloring
  • faster tests
  • less finnicky config maybe

Cons

  • it seems to crash a bit more often
  • .only and .skip don't seem to work as well for me
Collapse
 
iamthebuilder profile image
The Builder

jest setup has been stressing me out all day, I'm happy that at I came across vitest today and then this article helped me solve the document is not defined issue that i ran into when using vitest. Thanks for writing

Collapse
 
mbarzeev profile image
Matti Bar-Zeev

Glad I could help 🍻

Collapse
 
imamdev_ profile image
Imamuzzaki Abu Salam

Love this ❤️

Collapse
 
mbarzeev profile image
Matti Bar-Zeev

Thanks!

Collapse
 
nibble2 profile image
Nibble

Thank you for this post!
Can I use vitest for company new project now?

Collapse
 
mbarzeev profile image
Matti Bar-Zeev

I believe you can, but make sure it answers all your company's needs

Collapse
 
dopamine0 profile image
Roee Fl

You showed how to define setupFiles in vite.config, but you did not reference the contents of setupTests.js.

Could you include what should be in there for the Chai issue to resolve?

Collapse
 
cawabunga profile image
Emil

Vitest is not that fast as it pretends to be. Jest is faster in most cases, because usually you expect isolation in tests, but Vitest has problems with performance. Here is a Github issue github.com/vitest-dev/vitest/issue....

Collapse
 
roblevintennis profile image
Rob Levin

I’m definitely keeping my eyes on vitest and this post makes me wanna give it another shot (forget exactly why but had trouble getting it working a few weeks back) but the whole philosophy of vitest is really compelling. Thanks for the nice case study!

Collapse
 
mbarzeev profile image
Matti Bar-Zeev

With pleasure :)

Collapse
 
larsejaas profile image
Lars Ejaas

Oh, that looked surprisingly simple!
I am still a bit unsure how enzyme would fit into the Vitest environment and how easy it is to setup with next.js - but the Vitest project sounds SO promising!

Collapse
 
cawabunga profile image
Emil

It is suggested to drop enzyme tests, because it is not supported any more. Keeping aside that it brings questionable value.

Collapse
 
larsejaas profile image
Lars Ejaas

Thanks Emil. I have also come to that conclusion myself 🙂

Collapse
 
vaishnavi1029 profile image
vaishnavi1029

Remix Vite plugin can't detect preamble. Something is wrong.
❯ app/routes/stored.tsx:2:8
1| export default function Comp(){
2| return <h1>jcs</h1>

Error: Remix Vite plugin can't detect preamble. Something is wrong.
here is my vite.config
///
///
import { vitePlugin as remix } from "@remix-run/dev";
import { installGlobals } from "@remix-run/node";
import { defineConfig } from "vite";
import tsconfigPaths from "vite-tsconfig-paths";
installGlobals();

export default defineConfig({
test:{
environment:"jsdom",
globals: true,
setupFiles: ["./set-up-test.env.ts"],
},
plugins: [
remix({
ignoredRouteFiles: ["*/.css"],
}),
tsconfigPaths(),

],

});
can you help me solve this

Collapse
 
robole profile image
Rob OLeary • Edited

I hope vitest gets more traction and becomes a solid alternative to jest for vue and svelte also soon. thanks for the write-up

Collapse
 
naeemo profile image
Naeemo

Thank you for this post, just like a "TL,DR" for me to migrate to vitest.

Collapse
 
mbarzeev profile image
Matti Bar-Zeev

Cheers :) Just remember that this is not production ready yet, according to their readme.

Collapse
 
tombyrer profile image
Tom Byrer

Hard to tell how much improvement there is, since we don't know how many & how complicated the tests are.

Collapse
 
timritzer profile image
Tim Ritzer

I mean he literally said it was 4 test files, and 37 tests. A small sample size, sure, but large enough to show relative progress.

I'd love to see some numbers for larger codebases, but that's tough since the software is still considered not production ready.

Collapse
 
mbarzeev profile image
Matti Bar-Zeev • Edited

True. I won't use my little PoC here to determine whether or not you should use Vitest, but I do say it does look promising.

Collapse
 
luispa profile image
LuisPa

Great post!

Collapse
 
alonseg profile image
Alon Segal

as always, love to read your articles!
their comment on not being ready for production and the tight coupling to vite will cause me to wait some more :)

Collapse
 
mbarzeev profile image
Matti Bar-Zeev

Cheers :)
Yeah, I'd wait for it some a little bit more