Skip to content

Commit 5476027

Browse files
committed
docs: update no-node-access rule details and examples
1 parent 47f1ac9 commit 5476027

File tree

1 file changed

+14
-2
lines changed

1 file changed

+14
-2
lines changed

docs/rules/no-node-access.md

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,11 @@
44

55
<!-- end auto-generated rule header -->
66

7-
The Testing Library already provides methods for querying DOM elements.
7+
Disallow direct access or manipulation of DOM nodes in favor of Testing Library's user-centric APIs.
88

99
## Rule Details
1010

11-
This rule aims to disallow DOM traversal using native HTML methods and properties, such as `closest`, `lastChild` and all that returns another Node element from an HTML tree.
11+
This rule aims to disallow direct access and manipulation of DOM nodes using native HTML properties and methods — including traversal (e.g. `closest`, `lastChild`) as well as direct actions (e.g. `click()`, `focus()`). Use Testing Library’s queries and userEvent APIs instead.
1212

1313
Examples of **incorrect** code for this rule:
1414

@@ -21,6 +21,12 @@ screen.getByText('Submit').closest('button'); // chaining with Testing Library m
2121
```js
2222
import { screen } from '@testing-library/react';
2323

24+
screen.getByText('Submit').click();
25+
```
26+
27+
```js
28+
import { screen } from '@testing-library/react';
29+
2430
const buttons = screen.getAllByRole('button');
2531
expect(buttons[1].lastChild).toBeInTheDocument();
2632
```
@@ -41,6 +47,12 @@ const button = screen.getByRole('button');
4147
expect(button).toHaveTextContent('submit');
4248
```
4349

50+
```js
51+
import { screen } from '@testing-library/react';
52+
53+
userEvent.click(screen.getByText('Submit'));
54+
```
55+
4456
```js
4557
import { render, within } from '@testing-library/react';
4658

0 commit comments

Comments
 (0)