Skip to content

Commit 259fbf9

Browse files
committed
docs: add custom queries example to custom render docs
1 parent 7f53277 commit 259fbf9

File tree

1 file changed

+29
-0
lines changed

1 file changed

+29
-0
lines changed

docs/react-testing-library/setup.md

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -144,6 +144,35 @@ module.exports = {
144144

145145
</details>
146146

147+
<details>
148+
<summary>Modify queries globally with custom render</summary>
149+
150+
You can override and append queries via the render function by passing a [`queries`](api.md#render-options) option.
151+
152+
If you want to add custom queries globally, you can do this by defining a custom render method:
153+
154+
```js
155+
// test-utils.js
156+
import { render, queries, queryHelpers } from '@testing-library/react'
157+
158+
const customQueries = {
159+
getByDataCy: queryHelpers.queryByAttribute.bind(
160+
null,
161+
'data-cy'
162+
),
163+
};
164+
165+
const customRender = (ui, options) =>
166+
render(ui, { queries: { ...queries, ...customQueries } })
167+
168+
// re-export everything
169+
export * from '@testing-library/react'
170+
171+
// override render method
172+
export { customRender as render }
173+
```
174+
</details>
175+
147176
### Configuring Jest with Test Utils
148177

149178
To make your custom test file accessible in your Jest test files without using

0 commit comments

Comments
 (0)