Mastering React Test-Driven Development

Navigating router history in a Redux saga

It's fairly simple to navigate router history within a saga. We just have to make sure that we can get hold of the same history object that is passed to our React components. Unfortunately, the React router doesn't come set up by default to make this easy for us.

The trick is to use Router rather than BrowserRouter in your application entrypoint. That allows you to pass in your own history, which you can then explicitly construct yourself.

This has already been done for you in the repo. Here's src/history.js:

import { createBrowserHistory } from 'history';export const appHistory = createBrowserHistory();

This module is already imported into src/index.js, where appHistory is passed into a Router instance. ...