This is a gem tutorial since so many React courses out there but not so many React Testing Library courses. This is def what I am looking for. Thank you!
findTestById is failing for me - any suggestions how to resolve it? getting the below error: Unable to find an element by: [data-testid="follower-item-0"]
findBy methods are not working as shown here. In the FollowersList.js file the following error is being listed: _TypeError: Cannot destructure property 'data' of '(intermediate value)' as it is undefined._
Do you recommend to query by test-id rather than by say the className? Maybe doing that is less brittle since developers maybe are more likely to change a className than a test-id?
There is a problem with the recent axios v1.2. It will give import error. Add the below line at the end of package.json "jest": { "transformIgnorePatterns": ["node_modules/(?!axios)/"] } restart the test and it will work. This is a temporary solution until axios fixes it
Hey Bro I love the way you are Explaining the test Thank you so much for the course. please can we add a video for the Redux Testing........................
Hey bro, I really like your course and I want to make a similar course of this in spanish, do you have any problem if I use some of your examples? obviusly I will mention you
Nice tutorial! but I do want to point out, that you shouldn't use index as a key, since the index will change if you add/remove an item, and cause inefficiencies in the re-render. You should instead use the id, or some other unique identifier
I could not re-create these results with my app. 2 hours of trying...... Someone help me. 5 days of studying tests and I have 0 meaningful tests written..........
To solve the error: "Unable to find an element by ..." The code below will fix it.. . . . import { render, screen, waitFor } from '@testing-library/react'; const followerDivElement = await waitFor( () => screen.findByTestId('follower-item-0'), { timeout: 5000 } ); . . . It seems the amount of time the API returns our data is more than 1 second (default timeout duration). We can use waitFor method to configure the timeout duration. Then just add key={index} to element on FollowersList.js to fix the next error..
@UCBMw2sInVKJOsNRsFxPpr7g I tried using screen.findByTestId() and sometimes it did work, and sometimes it didn't, it's probably because it takes a little bit of time to fetch the data.
thrown: "Exceeded timeout of 5000 ms for a test. Use jest.setTimeout(newTimeout) to increase the timeout value, if this is a long-running test." i am facing this issue can some one help?
Everything you're doing seems to use getByTestId ... this is supposed to be the last resort and pretty much not suggested ... are you sure you know what you're doing? I miss Net Ninja ... the real one. You are ruining his good name!!!
This is a gem tutorial since so many React courses out there but not so many React Testing Library courses. This is def what I am looking for. Thank you!
Really loved this series ! I have started to love writing tests. It was earlier a nightmare. Thank you so much 😊
findTestById is failing for me - any suggestions how to resolve it?
getting the below error:
Unable to find an element by: [data-testid="follower-item-0"]
same
Did you find a solution yet? I am having the same issue.
Same
Same goes here
Same here as well
findBy methods are not working as shown here. In the FollowersList.js file the following error is being listed:
_TypeError: Cannot destructure property 'data' of '(intermediate value)' as it is undefined._
Solution: Delete the [src/_ _ mocks _ _] folder and rerun npm run test.
@@debarghyachakraborty Why does this occur?
Thank you! Have been trying to figure this out for a while now.
@@debarghyachakraborty Doesn't work
@@debarghyachakraborty WOW! you are right. Why was this the case? Any idea
Gave a boost to face the interview questions on react unit testing
Do you recommend to query by test-id rather than by say the className? Maybe doing that is less brittle since developers maybe are more likely to change a className than a test-id?
There is a problem with the recent axios v1.2. It will give import error. Add the below line at the end of package.json
"jest": {
"transformIgnorePatterns": ["node_modules/(?!axios)/"]
}
restart the test and it will work. This is a temporary solution until axios fixes it
Hey Bro I love the way you are Explaining the test Thank you so much for the course.
please can we add a video for the Redux Testing........................
I am not sure about the use of getByTestId. Is it part of good practices to actually use those "data-testId" in our code?
Hey @6:30 the code 'follower-item-${index}' how come your ${index) is unaffected by the quotation?
mine is, and I think that is causing my test to fail.
Okay nevermind -solved. its not a quotation, its a backtick.
can we create only one one __test__ folder for all components which are we going to test?
best testing course thanks 🚀
No problem, thanks for the support Mehmet :)
Hey bro, I really like your course and I want to make a similar course of this in spanish, do you have any problem if I use some of your examples? obviusly I will mention you
Go ahead.
@@thiagoleite3255 lmao like you own this course
Love the course... thanks!
Nice tutorial! but I do want to point out, that you shouldn't use index as a key, since the index will change if you add/remove an item, and cause inefficiencies in the re-render. You should instead use the id, or some other unique identifier
He already said this wasn't the best practice.
Awesome tutorial… thank you
I could not re-create these results with my app. 2 hours of trying...... Someone help me. 5 days of studying tests and I have 0 meaningful tests written..........
you are a life saver. thanks a lot for this video
If your tests are failing for this, remove __mocks__ in src, problem will be fixed.
Thank you!!!
it doent work i always error
U r the best
What is a program do you record your screen
OBS
Camtasia is the best one for me.
Please upload new django course
Really awesome tutorial. Could you please create a shopping website with all features{filter, color, variants etc} using React hooks and api?
Something else?
@@thiagoleite3255 That's Enough. Thanks for your valuable time. Hoping to see new video from you soon.
To solve the error: "Unable to find an element by ..."
The code below will fix it..
.
.
.
import { render, screen, waitFor } from '@testing-library/react';
const followerDivElement = await waitFor(
() => screen.findByTestId('follower-item-0'),
{ timeout: 5000 }
);
.
.
.
It seems the amount of time the API returns our data is more than 1 second (default timeout duration).
We can use waitFor method to configure the timeout duration.
Then just add key={index} to element on FollowersList.js to fix the next error..
Still doesn't work
@@PixelTB its cause the server isnt always returning data 529 error. I its work if u run it enough times..
@UCBMw2sInVKJOsNRsFxPpr7g I tried using screen.findByTestId() and sometimes it did work, and sometimes it didn't, it's probably because it takes a little bit of time to fetch the data.
lol its funny, that you used in every vid async without awaiting anything but in this vid you removed it, to show how to add async.lol
thrown: "Exceeded timeout of 5000 ms for a test.
Use jest.setTimeout(newTimeout) to increase the timeout value, if this is a long-running test." i am facing this issue can some one help?
Everything you're doing seems to use getByTestId ... this is supposed to be the last resort and pretty much not suggested ... are you sure you know what you're doing? I miss Net Ninja ... the real one. You are ruining his good name!!!