Skip to content

Commit 196a2a4

Browse files
authored
docs(user-event): fix a typo (#1036)
1 parent 408ed68 commit 196a2a4

File tree

1 file changed

+15
-19
lines changed

1 file changed

+15
-19
lines changed

docs/user-event/intro.mdx

Lines changed: 15 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,9 @@ events that would happen if the interaction took place in a browser.
99

1010
:::note Latest version
1111

12-
These docs describe `user-event@14`.
13-
We recommend updating your projects to this version, as it includes important
14-
bug fixes and new features. You can find the docs for `[email protected]`
15-
[here](../ecosystem-user-event.mdx).
12+
These docs describe `user-event@14`. We recommend updating your projects to this
13+
version, as it includes important bug fixes and new features. You can find the
14+
docs for `[email protected]` [here](../ecosystem-user-event.mdx).
1615

1716
:::
1817

@@ -22,36 +21,33 @@ with any framework as long as there is a DOM.
2221
## Difference to `fireEvent`
2322

2423
The built-in [`fireEvent`](dom-testing-library/api-events.mdx#fireevent) is a
25-
utility to easier dispatch events.
26-
It dispatches exactly the events you tell it to and just those - even if those
27-
exact events never had been dispatched in a real interaction in a browser.
24+
utility to easier dispatch events. It dispatches exactly the events you tell it
25+
to and just those - even if those exact events never had been dispatched in a
26+
real interaction in a browser.
2827

2928
`user-event` on the other hand dispatches the events like they would happen if a
30-
user interacted with the document.
31-
That might lead to the same events you previously dispatched per `fireEvent`
32-
directly, but it also might catch bugs that make it impossible for a user to
33-
trigger said events.
34-
This is
29+
user interacted with the document. That might lead to the same events you
30+
previously dispatched per `fireEvent` directly, but it also might catch bugs
31+
that make it impossible for a user to trigger said events. This is
3532
[why you should use `user-event`](https://ph-fritsche.github.io/blog/post/why-userevent)
3633
to test interaction with your components.
3734

3835
## Writing tests with `userEvent`
3936

4037
We recommend to use [`userEvent.setup()`](setup.mdx) when rendering your
4138
component and inline that rendering and setup in your test or use a setup
42-
function.
43-
We discourage rendering or using any `userEvent` functions outside of the test
44-
itself - e.g. in a `before`/`after` hook - for reasons described in
39+
function. We discourage rendering or using any `userEvent` functions outside of
40+
the test itself - e.g. in a `before`/`after` hook - for reasons described in
4541
["Avoid Nesting When You're Testing"](https://kentcdodds.com/blog/avoid-nesting-when-youre-testing).
4642

4743
```js
4844
test('trigger some awesome feature when clicking the button', async () => {
49-
const user = userEvent.setup()
50-
render(<MyComponent/>)
45+
const user = userEvent.setup()
46+
render(<MyComponent />)
5147

52-
await user.click(screen.getByRole('button', name: /click me!/))
48+
await user.click(screen.getByRole('button', {name: /click me!/i}))
5349

54-
// ...assertions...
50+
// ...assertions...
5551
})
5652
```
5753

0 commit comments

Comments
 (0)