React Testing Library wrapper option
In the docs
The wrapper option lets you pass in a component to be wrapped around the given ui in a RTL render().
jsx
const RenderWrapper = ({ children }) => {
return (
<ThemeProvider theme="light">
{children}
</ThemeProvider>
)
}
const customRender = (ui, options) => {
return render(ui, { wrapper: RenderWrapper, ...options });
}See Custom Render in the React Testing Library API docs
In the source
wrapper is passed in to the renderRoot function, it's renamed to WrapperComponent.
Which is then passed in to wrapUiIfNeeded as wrapperComponent
js
function wrapUiIfNeeded(innerElement, wrapperComponent) {
return wrapperComponent
? React.createElement(wrapperComponent, null, innerElement)
: innerElement
}