1 | // TypeScript Version: 3.8
|
2 |
|
3 | import {
|
4 | queries,
|
5 | Queries,
|
6 | BoundFunction,
|
7 | prettyFormat,
|
8 | } from '@testing-library/dom'
|
9 | import {Renderer} from 'react-dom'
|
10 | import {act as reactAct} from 'react-dom/test-utils'
|
11 |
|
12 | export * from '@testing-library/dom'
|
13 |
|
14 | export type RenderResult<
|
15 | Q extends Queries = typeof queries,
|
16 | Container extends Element | DocumentFragment = HTMLElement,
|
17 | BaseElement extends Element | DocumentFragment = Container,
|
18 | > = {
|
19 | container: Container
|
20 | baseElement: BaseElement
|
21 | debug: (
|
22 | baseElement?:
|
23 | | Element
|
24 | | DocumentFragment
|
25 | | Array<Element | DocumentFragment>,
|
26 | maxLength?: number,
|
27 | options?: prettyFormat.OptionsReceived,
|
28 | ) => void
|
29 | rerender: (ui: React.ReactElement) => void
|
30 | unmount: () => void
|
31 | asFragment: () => DocumentFragment
|
32 | } & {[P in keyof Q]: BoundFunction<Q[P]>}
|
33 |
|
34 | export interface RenderOptions<
|
35 | Q extends Queries = typeof queries,
|
36 | Container extends Element | DocumentFragment = HTMLElement,
|
37 | BaseElement extends Element | DocumentFragment = Container,
|
38 | > {
|
39 | /**
|
40 | * By default, React Testing Library will create a div and append that div to the document.body. Your React component will be rendered in the created div. If you provide your own HTMLElement container via this option,
|
41 | * it will not be appended to the document.body automatically.
|
42 | *
|
43 | * For example: If you are unit testing a `<tbody>` element, it cannot be a child of a div. In this case, you can
|
44 | * specify a table as the render container.
|
45 | *
|
46 | * @see https://testing-library.com/docs/react-testing-library/api/#container
|
47 | */
|
48 | container?: Container
|
49 | /**
|
50 | * Defaults to the container if the container is specified. Otherwise `document.body` is used for the default. This is used as
|
51 | * the base element for the queries as well as what is printed when you use `debug()`.
|
52 | *
|
53 | * @see https://testing-library.com/docs/react-testing-library/api/#baseelement
|
54 | */
|
55 | baseElement?: BaseElement
|
56 | /**
|
57 | * If `hydrate` is set to `true`, then it will render with `ReactDOM.hydrate`. This may be useful if you are using server-side
|
58 | * rendering and use ReactDOM.hydrate to mount your components.
|
59 | *
|
60 | * @see https://testing-library.com/docs/react-testing-library/api/#hydrate)
|
61 | */
|
62 | hydrate?: boolean
|
63 | /**
|
64 | * Set to `true` if you want to force synchronous `ReactDOM.render`.
|
65 | * Otherwise `render` will default to concurrent React if available.
|
66 | */
|
67 | legacyRoot?: boolean
|
68 | /**
|
69 | * Queries to bind. Overrides the default set from DOM Testing Library unless merged.
|
70 | *
|
71 | * @see https://testing-library.com/docs/react-testing-library/api/#queries
|
72 | */
|
73 | queries?: Q
|
74 | /**
|
75 | * Pass a React Component as the wrapper option to have it rendered around the inner element. This is most useful for creating
|
76 | * reusable custom render functions for common data providers. See setup for examples.
|
77 | *
|
78 | * @see https://testing-library.com/docs/react-testing-library/api/#wrapper
|
79 | */
|
80 | wrapper?: React.JSXElementConstructor<{children: React.ReactElement}>
|
81 | }
|
82 |
|
83 | type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>
|
84 |
|
85 | /**
|
86 | * Render into a container which is appended to document.body. It should be used with cleanup.
|
87 | */
|
88 | export function render<
|
89 | Q extends Queries = typeof queries,
|
90 | Container extends Element | DocumentFragment = HTMLElement,
|
91 | BaseElement extends Element | DocumentFragment = Container,
|
92 | >(
|
93 | ui: React.ReactElement,
|
94 | options: RenderOptions<Q, Container, BaseElement>,
|
95 | ): RenderResult<Q, Container, BaseElement>
|
96 | export function render(
|
97 | ui: React.ReactElement,
|
98 | options?: Omit<RenderOptions, 'queries'>,
|
99 | ): RenderResult
|
100 |
|
101 | export interface RenderHookResult<Result, Props> {
|
102 | /**
|
103 | * Triggers a re-render. The props will be passed to your renderHook callback.
|
104 | */
|
105 | rerender: (props?: Props) => void
|
106 | /**
|
107 | * This is a stable reference to the latest value returned by your renderHook
|
108 | * callback
|
109 | */
|
110 | result: {
|
111 | /**
|
112 | * The value returned by your renderHook callback
|
113 | */
|
114 | current: Result
|
115 | }
|
116 | /**
|
117 | * Unmounts the test component. This is useful for when you need to test
|
118 | * any cleanup your useEffects have.
|
119 | */
|
120 | unmount: () => void
|
121 | }
|
122 |
|
123 | export interface RenderHookOptions<Props> {
|
124 | /**
|
125 | * The argument passed to the renderHook callback. Can be useful if you plan
|
126 | * to use the rerender utility to change the values passed to your hook.
|
127 | */
|
128 | 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}>
|
136 | }
|
137 |
|
138 | /**
|
139 | * Allows you to render a hook within a test React component without having to
|
140 | * create that component yourself.
|
141 | */
|
142 | export function renderHook<Result, Props>(
|
143 | render: (initialProps: Props) => Result,
|
144 | options?: RenderHookOptions<Props>,
|
145 | ): RenderHookResult<Result, Props>
|
146 |
|
147 | /**
|
148 | * Unmounts React trees that were mounted with render.
|
149 | */
|
150 | export function cleanup(): void
|
151 |
|
152 | /**
|
153 | * Simply calls ReactDOMTestUtils.act(cb)
|
154 | * If that's not available (older version of react) then it
|
155 | * simply calls the given callback immediately
|
156 | */
|
157 | export const act: typeof reactAct extends undefined
|
158 | ? (callback: () => void) => void
|
159 | : typeof reactAct
|
160 |
|
\ | No newline at end of file |