Testing components within a router
In this section, we’ll look at how to use the primary Router
, Routes
, and Route
components.
No walkthrough in this chapter
As mentioned in the chapter introduction, this chapter does not follow the usual walkthrough approach. The examples shown here are taken from the completed refactoring of our Appointments code base, which you’ll find in the Chapter11/Complete
directory of the GitHub repository.
The Router component and its test equivalent
This is a top-level component that hooks into your browser’s location mechanics. We do not generally test drive this because JSDOM doesn’t deal with page transitions, or have full support for the window.location
API.
Instead, we put it in the src/index.js
file:
import React from "react"; import ReactDOM from "react-dom/client"; import { BrowserRouter } from "react-router-dom"; import { App } from "./App"; ReactDOM.createRoot...