How to use Vitest with Jest-DOM and React Testing Library

[@fatasefer]

Finally, exactly what I was looking for. Simple and straight to the point. Thank you so much!

[@DrumkitCodes]

Thanks so much for the tutorial! I couldn't figure out how to get vitest working before, I really appreciate how you went through the full setup and explained why we were setting certain things to certain values. Can't wait to see more in your TDD series

[@ErickoAndriamanarivo]

I really needed this one, I am switching to typescript and react-vite now and I am struggling with testing with jest library with typescript. This one is easier to configure and faster. You should continue this TDD serie dude, you will help a lot of young, beginners, junior developers like me

[@BenHuxford]

great video 😊 one thing to note is you install the "jsdom" package at 4:50. In my setup this module is not needed when using testing-library's "jest-dom" because they both perform the same functionality of mimicking the browser DOM

[@ericwinkdev]

Awesome, thanks for the note!

[@ethanjacobsson]

when you created a new folder at 3:01 was that to keep your testing separate from the project?

[@vponochovny]

Really nice to link the vitest examples. It helped me much cause my setup was failing for some strange reasons

[@JMIKAEL6]

After 3 hours trying to configure i found your video and solve it in 10min.
Thank you so much!

[@ericwinkdev]

So glad that it helped!

[@jeff-creations]

Nice presentation and super useful! Thank you so much, my component tests don't error out now. Keep up the great work!

[@ramioooz]

This is a very important video. Thank you for sharing.

[@wellingtonostemberg7585]

I loved that! It´s exactly what i was looking for. Thank you!

[@paulgasbarra]

This is the most helpful thing.

[@keifer7813]

Thanks a ton for this. Nice and easy setup, first time using vitest for me

[@kikevanegazz325]

Brother, great tutorial. I like it because it's spot on.

[@ЭзизК]

I have a problem, MISSING DEPENDENCY Cannot find dependency 'jsdom'
Should I install it as devdepend?

[@Prathap_SK]

To be honest, It is first video in vitest. It is pretty straightforward to go the content. Thank for clear view

[@ThaRealIansanity]

Great start. I'm taking a vitest course and want to learn to use it with both react and vue. Thank you

[@faruzzy]

Thanks for walking us through this!

[@bornback4524]

Thx for helping to understand and easy to implement 🙂

[@ericwinkdev]

I'm glad this helped you out!

[@SteelGamePad]

great explanation, can't wait for part 2

[@mrluckyuncle]

Excellent. Just what I was looking for. One little thing... it would be nice if the video was available in a higher resolution.

[@altamashkhan4858]

Thank you for posting this video.

[@coderboyakash5853]

This is really helpful for me buddy thanks so much

[@jamesbotwina8744]

Thanks, you just saved me a ton of time

[@WitchingHr]

thank you so much man. this helped a lot

[@Sulaiman-softoo]

Page not found. The link is not working for me.

[@kedaraksym12]

Thanks for this manual, I appreciate that ;)

[@tobibada6443]

I was so giddy after hearing the name😂. Randomly chose the video and heard a name from my best tech podcast🤭🤭

[@mahanmashoof1989]

great intro to vitest! thanks

[@abhijitmondalabhi2146]

Most of the things are not working any more. I think they already changed the setups little bit.

[@manavjethani4118]

This is really great, i am able to setup vitest with your help, although i am stuck with this error `TypeError: Class extends value undefined is not a constructor or null` while using amcharts4 in our project, wanted to ask do we have to do add any config to allow `Class extends` syntax?

[@raj.blazers]

Much thanks man! Helped a lot. 🎉

[@ahoymatey1234]

I found an alternative to adding those reference types by adding this to my tsconfig
"types": [
"vite/client",
"vitest/globals"
]

[@gustuckit2052]

i get an error saying "no test files found", very weird... :( (im not using ts)

[@IrakliTsaishvili]

clear and helpful. thank you very much

[@FingerTipWisdom]

Thanks lot brother save me lot of time !!!

[@pranshubasak8796]

You are really a saviour

[@kakun7238]

but how do i test for huge components i am stuck

[@majaynathreddy5605]

I know it is very late to ask, i am also stuck on how to test large components which have children and grandchildren. Did you find a way?

[@kakun7238]

@@majaynathreddy5605 nope left testing

[@simonprato9666]

Thanks men, very clear!

[@Anthony-wg7fn]

Can you do this same thing with the T3 stack?

[@1haker]

ABSOLUTLY AMAZING :)

[@ronyortizop]

Great video, thanks!

[@guillermoemmanuelsanchezin1664]

Hi! Would you be so kind to try using vitest with MSW, I would really appreciate it!

[@михаилкиселёв-н5г]

No tests weere found error

[@yatinpatel4123]

yes, there is no tutorial available like this set for react + vite for testing library.

[@booi_mangang]

Hey, great video.
I've a question. What if you are not using typescript. what changes will there be from your guide?

[@ericwinkdev]

Thanks for checking it out! If you're not using typescript, there's no tsconfig file, and the only differences should be with the file extensions. Rather than .ts and .tsx, you'll use .js and .jsx respsectively.
If anything goes wonky let me know and I'll do my best to help out!

[@booi_mangang]

@@ericwinkdev thanks for the reply.
I’d figured it out.
your video helped.

[@joelkomieter6557]

@@ericwinkdev Creating that jsconfig file won't have any of what tsconfig,json has. What do I need to do about that?

[@rannue2921]

Thank you so much!!!

[@splat_bang]

Thankyou so much!

[@davidjnevin]

Life saver!

[@v1r47]

FYI: Vitest 0.33+= requires at least node16 to run properly.

[@walidaguib3944]

Thanks a lot😍

[@dolevdo]

thank you a lot!

[@somajuice666]

THANKS

[@Gabriel-kl6bt]

Good. Just why isn't Code suggesting methods from the testing libs?