How To Test React Components - Learn To Use React Testing Library

Here you will learn how to test any React components using React testing library.

We'll write a simple component using ReactJS and Javascript and test it using Jest and React Testing Library

I write about React and TypeScript there

[DruSerkes]

This was solid - would really appreciate more quality videos like this one on react testing (unit and integration if possible)

[adamwoolf]

As always, Maksim, super clear and great to follow. Nice one!

[robisupi]

Bang On ! Straight to the point.... awesome !

[Here]

really liked how you explained everything, thank you.

[pannihto]

Great stuff. I was keeping myself away from testing for far too long, it's time to jump in

[lougieq]

Thank you for this! Btw, you should probably add react testing library in your devDependecy instead?

[a_m_dev]

i love how you explain testing in react, please more testing videos

[volosgoto]

Привет! Упущено 3 момента
Где создать файл SearchBox.test.js
Как запускать тест?
Не показан код компонента SearchButton

[matte]

great video - what theme are you using here?

[InferSoul]

Great! It was exactly what I was looking for.

[adrien_]

Finally able to understand this, thank you pal

[nilmendes]

Congratulations!
A direct and content-rich demo (tips).
Your tutorial helped me a lot.
Professor Marsim, I have two questions, please enlighten me:
1. In your opinion, is it a good idea to create a test branch?
2. Create a component to determine when the application has less movement or usage, perform branch tests, send a test report to the application administrator, and perform repairs if necessary.
I have a tutorial request: Images.
Thanks for sharing your knowledge and time.
Success in your projects!

[IkraamDev]

How can you test components that interact with other components? For example what if a function changes pages with React Router? Or if a button opens a menu etc?

[glenndollard]

Maybe I'm missing something here but where in your component did you specify the "search-button" value for the data-testid?

[codingexpedition]

Can you share the repository so we can follow along?

[HuyKon]

How to make a test case for a loop of state ?

[YoannBuzenet]

Hello, thanks for this tutorial. Are queryByTesId and queryByPlaceholderText included methods that you get from render ? How do you know their name ?

[earlyriser]

What do you do to actually run the tests? I guess there's some watcher there, but what's on the test script and how do you run it?

[hectorserrano]

These videos are pure gold! 💪🏻 by the way, I desperately want you to pronounce Button differently lol sounds like word "bottom"

[MmmMmmGood]

This is an unpopular opinion.. but writing tests on the frontend just feels like wasted time.. it’s like writing another application on top of your existing application 😭