To be able to test the Theme Hook, we first have to set up the context and provide a wrapper component for the Hook's test component.

Let's now create the ThemeContextWrapper component:

1. Create a new src/hooks/testUtils.js file.
2. Import React and the ThemeContext, as follows:

import React from 'react'
import { ThemeContext } from '../contexts'

3. Define a new function component called ThemeContextWrapper; it will accept children as props:

export function ThemeContextWrapper ({ children }) {

4. We return a ThemeContext.Provider with our default theme, and then pass children to it:

    return (
        <ThemeContext.Provider value={{ primaryColor: 'deepskyblue', secondaryColor: 'coral' }}>
            {children}
        </ThemeContext.Provider>
    )
}

As we can see, a context wrapper simply returns a context provider component.