Unit Testing React-Router-Dom Navigation Without Mocking

I think that the best approach to testing navigation between components, is not to mock the api that makes the navigation such as react-router-dom but rather to make use of it in the unit test, whilst utilizing the provided components and apis to manipulate it's behaviour to suite your use case.

In this video, we look at how we use the MemoryRouter from react-router-dom in our tests to simulate a user navigating between pages.

[UvstudioCaToronto]

You are a good man. Thank you for making this quick little video. Solved my problems after hours of researching.

[Param-xuck]

Hi, thanks! One question: is it possible to check if the location pathname matches after clicking a button in a test case?

[waffle]

You're talking about unit testing, but this sounds more like integration testing.

[gregorychamekh]

Thanks to remind me this use of wrapper ;)

[MarcelaoVMS]

Thank you very much! Right to the point!!! Very good!

[frankmartinez]

This is too long and convoluted. I don’t need a back story on this code. This probably could have been summed up in 45 seconds but there is so much in here I cannot tease out what that is. Got a short short version?

[PatrikRasch]

What's the name of the extension you're using for indentation? Looks real nice.
Also, this solved my problem! Or, well, it gave me a workaround! Was trying to test the actual URL to look for a change, but seeing if a piece of content only on the page I'm navigating to exists on the screen works just as well as far as my knowledge goes. Thank you!

[rahulbiswakarma]

What font did u use in your VS code, btw great video

[karimansari]

second like and second comment.
Thanks Bro

[ganeshgopalkrishnan]

exactly what I was looking for, would have been great if you could link a git repo

[danielmagar]

Is QueryClient mandatory? What if I want to test link route which does not use react query