Jest Crash Course - Learn How to Test your JavaScript Application
HTML-код
- Опубликовано: 26 июн 2024
- In this crash course, we will cover Jest which is a terrific JavaScript testing framework
Second Channel:
/ @laiture123
GitHub Repo:
github.com/harblaith7/jest-cr...
Timeline:
0:00 - Matcher Methods
28:30 -Testing Async Functions
37:29 - Setting Up & Tearing Down Tests
50:24 - Mocks
I swear i've been searching for jest crash courses for 30mins now ! and then i get the notification ...
What a day !
love your channel, I've recently found you but your channel has everything I was looking for with great quality, thanks a lot
I just subscribed, because I never knew there was such a great teacher like you teaching JEST on RUclips.
Exactly the crash course I wanted!! Thanks Laith.
If anyone wants to clarify that why 3 === 3 is true and {} === {} is false, it is because in case of 3 === 3 is compared by value whereas objects are compared by hashcode(a location of the memory where the object exists). When you are comparing {} === {} then these are two different object at two different memory location which result in two different hashcode for comparison and thus return false. I hope I have done a good job in clarifying it 😅
Yes
I have to say, you have the best quality tutorials out there!
Great course, thanks for including mocks and not just the simple pure function stuff.
For anyone who struggled to understand how the mock.calls worked, as I did, too, initially - here is what [x] [y] mean: x represents the index of the call made (i.e. 0 = first call, 1 = second call, 2 = third call etc) and y represents the index of the first argument we find on that call (i.e. always 0 as we only have one argument).
So, taking our example in the tutorial 'expect(mockCallback.mock.calls[1][0]).toBe(1)' - [1] represents the second call and [0] first argument, which in this case is 1. Hope this helps to clarify and keep up the good work studying!
Thanks Laith Academy!
Terrific, the best tutorial I found on youtube about mocks.
Спасибо за новое видео. Уже давно слежу за вашим каналом, нашла много полезного для себя.
This channel is incredible, your teaching skill is great. Thank you, I appreciate what you're doing on this channel.
Very cool, thanks! I am starting to learn jest. Your course has been very helpful!
Beautiful video, crisp, to the point and nice explanation!
Thanks for the quick and short crash course for Jest beginners!
Came here from Net Ninja!
New Subscriber!
Best Explanation Ever for Jest, Just Incredible
Thank you so much. since long I was not able to get understanding of mocking which you explained practically in good way.. thanks and keep on.
wow you create the video in one shot, that is amazing
Such a nice tutorial, you're amazing. Thank you!❤❤❤
Laith, you do deserve a 1M Subs for sure!
Thanks for the content.
Thanks for providing Jest & React testing Library courses 🙏
Real nice tutorial L. Thanks for your hard work. 🙂
You didn't once fail to teach me any concept. Perfect teaching skills you have! Great explanation once again.
Great stuff, thanks for this!
Just a great channel , nothing to say else
Very helpful video! Thank you!
I love your contest Laith! Been following your content when you had only few hundred subscribers : ) Do you have any plan to make web3 development tutorials in future?
Nice! Especially thanks for mocking example with axios
Nice course, very informative I have learned a lot.
Thank You ❤️
You are the GOAT thanks a lot!
Amazing video. Many thanks for mocking example with axios.
Very good and helpful crash course👍👍👍
Thanks Laith, liked the course! Would've preferred a few less matcher methods and a bit more advanced info though, like using Jest with ES modules or testing React.
Thanks. Wish you went more into mocking with classes and stuff.. but I get it now. ❤
Nice tutorial 👍
great lecture... keep it up
Wow 👍🏼 beautiful. Amazing, I like your channel so much, 👍🏼❤️🎉🙏
Thank you .
The mocks part in the tutorial needs to be demystified more.
cool thing. nice explanation
Really nice
Laith, very good tutorial on Jest. Do you have any tutorial on JEST with LWC component to test field value on clicking submit button in the LWC.
thank you for this
Thanks Laith
Not sure if mentioned but I believe a mocked module/function must be included/required in the test code.
for toBeCloseTo() assertion you can see the error not passed test, it show the limit (expected difference is 0.005)
Thank you sir
could you do a small project using context api + http requests? with your explanation it would be awesome!
thank you
Have you mock a prisma client before? I have trouble using it in my test, the mockResolvedValue I given to first test file is working, but the data i put there exists to the next test file. I have clearMock or resetMock but it is not working, :(. maybe can you do a video mocking prisma?
can i install jest globally in my laptop ?
Can you please tell me how to write unit test for a button click..
I see you're a fan of Traversy Media lol gotta practise that Boston accent to really stick the landing 😜
Please a video for testing next.js with typescript
Are you Brad? :)
Nice course but I didn't get mocks
the course is really cool but the mocks part needed more explination and clarification
please make on video React unit testing crash course
I have one on my channel:
ruclips.net/video/GLSSRtnNY0g/видео.html
and on Net Ninja channel:
ruclips.net/video/7dTTFW7yACQ/видео.html
Can we get react crash course for beginners plz
You can find this on Brad Schiff's LearnWebCode youtube channel. He is a good instructor too.
around 58:49 if you don't understand this, console.log it. and add some values to forEach(['zero', 1, 'spread'], mockCalledBack); for clarity.
For Example: console.log(mockCalledBack.mock.calls[0][0]) will return zero so it returns the string zero
forEach(['zero', 1, 'spread'], mockCalledBack);
If you run it again with console.log(mockCalledBack.mock.calls[0]) it will return [ ' zero ' ] a array with 1 element a string 'zero'
So with the first notation you get the element inside the array.
With the second notation you get a array with the element at your chosen index. For example:
console.log(mockCalledBack.mock.calls[2][0]) returns a string spread
console.log(mockCalledBack.mock.calls[2]) returns a array with 1 element at index 2 of the original array. so [ ' spread ' ]
There for changing the second number to higher then 0 will return undefined because the array length is 1.
And you access that first and only element with calls[indexOriginalArray][0]
console.log(mockCalledBack.mock.calls[2][1]) returns undefined
Testing:
expect(mockCalledBack.mock.calls[2][0]).toMatch('spread');
Will pass because
console.log(mockCalledBack.mock.calls[2][0]) returns a string spread
Keep supporting channels like this, it makes all of us a better dev :)
It's a bad practice and something to avoid when testing real endpoints. You should have a mock data, preferably using MSW package to mock your endpoints. Never test real endpoints.
Why is everyone on RUclips trying to teach the most basic elementary level shit? Meanwhile every job in the real world has 10+ years of code all piled into 1,000+ line long react components that use every known library to man, a giant clusterfuck of class based and functional based components, hundreds of thousands of objects stored in Redux, an entire other section of the UI using Angular 2, one small UI element in Vue.js, a whole other UI in Ember.js that has been deprecated, a holiday/promotional section using Knockout and jQuery and 3 working tests with 145 skipped tests. And were supposed to take his 1+2=3 test experiment into the real world?
I feel you. Know any videos/courses better than this?
There is an error on the jest home page at the beginning:
it says: "Jest is a delightful javascript testing framework".
It should be "Jest is shit and a nightmare".
build a better testing framework then
Great tutorial on Jest!! A lot of this stuff I learnt on my own but over a much longer period. I came here because im having an issue with a spy and a mockImplementationOne() call. It just isn't replacing the implementation with the one being passed... no idea why.