Testing with Jest: From zero to hero

Learn more about how to test your React apps with Jest.
Introduction - 00:00
Set up -- 01:07
Test example #1- 02:42
Mocking --10:18
Test example #2 - 26:27
Data matching - 29:02
Github repo: github.com/karlhadwen/jest-pl...
Try LogRocket for free: logrocket.com/?yt35
LogRocket is a frontend application monitoring solution that lets you replay problems as if they happened in your own browser. Instead of guessing why errors happen, or asking users for screenshots and log dumps, LogRocket lets you replay the session to quickly understand what went wrong. It works perfectly with any app, regardless of framework, and has plugins to log additional context from Redux, Vuex, and @ngrx/store.
In addition to logging Redux actions and state, LogRocket records console logs, JavaScript errors, stacktraces, network requests/responses with headers + bodies, browser metadata, and custom logs. It also instruments the DOM to record the HTML and CSS on the page, recreating pixel-perfect videos of even the most complex single-page apps.
Try it for free: logrocket.com/signup/

[@niklasport5100]

This was very informative. Wish there was a bit more use of these ideas on actual or hypothetical projects. A lot of it seemed to just be a little arbitrary, and not actually testing an App

[@thomasb1205]

Great tutorial, covered lots of concepts, thanks!

[@antoniosousa2848]

Great tutorial, that's really good for those who have never worked with tests before. Thanks!

[@kylerebstock1487]

This was great! The best there is on the topic! I can't see to find much else. I guess it's time to deepdive the docs. ;)

[@theriddler525]

This is a great video. Thanks for putting this out there!

[@paulthomas1052]

Great video. Concise and useful. Thanks.

[@ghostpieces2362]

This is so simple to follow :), Please make more testing videos.

[@afamsval]

Thanks so much for this video. I really enjoyed it

[@johngorman8020]

Really useful, a great starting point. Thanks!

[@santoshnakka7431]

Great session, thank you very much.

[@wlancer8826]

from zero to sidekick... I feel like a hero though thank you very muuuuuch!!

[@barath89]

Thanks a lot. It's a great guide for the first-time learner like me.

[@joemart6887]

If on Typescript, you might get an error "Cannot find module './data.json'. Consider using '--resolveJsonModule' to import module with '.json' extension." The way that I fixed it was to add ""resolveJsonModule": true" to the 'tsconfig.json' under 'compilerOptions' and it worked.

[@brahmadev7419]

Thanks for the great video... You provided super info in less time.... If possible can you show how do we handle the Filesystem mocks and any database mocs as well

[@mocococo2877]

Thank you for the time to put that good tutorial. There were so many examples. My complaints though will be Never used a real f-n to mock so I still can not make connection between what you showed and what should I do in case of real f-n. It all goes against a json file. Very heavy dialect, it was like you you do it intentionally or you do not care if we can follow.

[@sleepcycle_]

I'll be hero! 🔥

[@jacksontriffon5064]

found there were quite a few things missing: - How to test a react component - How to test render() and probably lots more since this is only a basic intro.. after the video don't expect(to be able to test React components).toBe(true) just expect to understand that line and how to understand basic function testing

[@sabermazoji466]

thank you very helpful for me

[@ahmedpatel408]

very good video

[@nemoahmed]

your awesome. thanks

[@sdf0as9f0a9sda0s]

from zero - means to teach how to do a basic setup and configuration.

[@kresimircosic3753]

Let's be real, this requires no setup. And if you're checking out testing, you're bound to know the basics of programming and setting up your workflow in some shape or form.

[@xXxDerfoufixXx]

First person to be exited about an error

[@kemalakcil]

Nicest!

[@aaron___6014]

On a scale, 0 to 10....you started at like a 3 or more. What if you're using webpack?

[@marcosyamgarcia6684]

You could have started by showing the script you ran you install jest..

[@maikelm20]

What ide is this?

[@bolorshagaienkhbold5722]

This is just test "json" file

[@nope8605]

i think just this so can't to be a hero for jest :(((

[@lucadifazio2735]

I am from Sicily and I wonder what Sicilian Pizza is 😂

[@codercodercoder5977]

how to test graphql calls on front end S:

[@davedave9]

Great viseo, but the way you pronounce “mock” is driving me crazy

[@mania4k0]

While you are learning of how to become a "hero" in testing with Jest, it is very important to realize that every "for loop" you wrote so far is too basic, so you need to rewrite that [8:25], where "i++" should be "i += 1" instead!