How to test navigation from within a test

[bobsilverberg]

We have tests where we render a page, and then want to test what happens when a parameterized part of the URL changes. With react-router v5 we were able to create a history object, render the page, and then use history.push() with the new pathname. This would cause the component under test to react to the change of location and we could verify the behaviour.

This no longer seems to be possible, I suppose because we are no longer able to pass the actual history object into the router.

I saw some discussions of using unstable_HistoryRouter to do this, but it doesn't seem to work with the latest release.

I also saw a discussion of using BrowserRouter and using window.history.pushState() to update the path, but that doesn't seem to trigger a change in the location (i.e., useEffect is not triggered after calling window.history.pushState()).

As this is only required for tests, I wonder if anyone else has encountered this use case and if anyone has any suggestions for making it work. What I am looking for is a way to test a useEffect hook that is expected to fire when the location changes. Nothing I have tried thus far triggers the hook to fire.