Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 27a9584

Browse files
authored
feat(renderHook): allow passing of all render options to renderHook (#1118)
1 parent 73ee9ba commit 27a9584

File tree

3 files changed

+42
-12
lines changed

3 files changed

+42
-12
lines changed

‎src/__tests__/renderHook.js‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -60,3 +60,29 @@ test('allows wrapper components', async () => {
6060

6161
expect(result.current).toEqual('provided')
6262
})
63+
64+
test('legacyRoot uses legacy ReactDOM.render', () => {
65+
jest.spyOn(console, 'error').mockImplementation(() => {})
66+
67+
const Context = React.createContext('default')
68+
function Wrapper({children}) {
69+
return <Context.Provider value="provided">{children}</Context.Provider>
70+
}
71+
const {result} = renderHook(
72+
() => {
73+
return React.useContext(Context)
74+
},
75+
{
76+
wrapper: Wrapper,
77+
legacyRoot: true,
78+
},
79+
)
80+
81+
expect(result.current).toEqual('provided')
82+
83+
expect(console.error).toHaveBeenCalledTimes(1)
84+
expect(console.error).toHaveBeenNthCalledWith(
85+
1,
86+
"Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17. Learn more: https://reactjs.org/link/switch-to-createroot",
87+
)
88+
})

‎src/pure.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -219,7 +219,7 @@ function cleanup() {
219219
}
220220

221221
function renderHook(renderCallback, options = {}) {
222-
const {initialProps, wrapper} = options
222+
const {initialProps, ...renderOptions} = options
223223
const result = React.createRef()
224224

225225
function TestComponent({renderCallbackProps}) {
@@ -234,7 +234,7 @@ function renderHook(renderCallback, options = {}) {
234234

235235
const {rerender: baseRerender, unmount} = render(
236236
<TestComponent renderCallbackProps={initialProps} />,
237-
{wrapper},
237+
renderOptions,
238238
)
239239

240240
function rerender(rerenderCallbackProps) {

‎types/index.d.ts‎

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -120,28 +120,32 @@ export interface RenderHookResult<Result, Props> {
120120
unmount: () => void
121121
}
122122

123-
export interface RenderHookOptions<Props> {
123+
export interface RenderHookOptions<
124+
Props,
125+
Q extends Queries = typeof queries,
126+
Container extends Element | DocumentFragment = HTMLElement,
127+
BaseElement extends Element | DocumentFragment = Container,
128+
> extends RenderOptions<Q, Container, BaseElement> {
124129
/**
125130
* The argument passed to the renderHook callback. Can be useful if you plan
126131
* to use the rerender utility to change the values passed to your hook.
127132
*/
128133
initialProps?: Props
129-
/**
130-
* Pass a React Component as the wrapper option to have it rendered around the inner element. This is most useful for creating
131-
* reusable custom render functions for common data providers. See setup for examples.
132-
*
133-
* @see https://testing-library.com/docs/react-testing-library/api/#wrapper
134-
*/
135-
wrapper?: React.JSXElementConstructor<{children: React.ReactElement}>
136134
}
137135

138136
/**
139137
* Allows you to render a hook within a test React component without having to
140138
* create that component yourself.
141139
*/
142-
export function renderHook<Result, Props>(
140+
export function renderHook<
141+
Result,
142+
Props,
143+
Q extends Queries = typeof queries,
144+
Container extends Element | DocumentFragment = HTMLElement,
145+
BaseElement extends Element | DocumentFragment = Container,
146+
>(
143147
render: (initialProps: Props) => Result,
144-
options?: RenderHookOptions<Props>,
148+
options?: RenderHookOptions<Props,Q,Container,BaseElement>,
145149
): RenderHookResult<Result, Props>
146150

147151
/**

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /