Mastering React Test-Driven Development

Building a root component

In this section, we'll look at some specific tests from the App component once it has been reworked to use React Router. There are a few key points:

• The initial screen, which contains a button bar and the AppointmentsDayViewLoader, needs to be wrapped in a single component so that we can pass it to the component prop of Route.
• The Switch component is used to decide which high-level component should be shown. This replaces our own switch.
• The non-default Route component instances uses a render function to display their components, because they require specific props to be passed in. We'll look at how to avoid this in the next chapter when we introduce Redux.