feat: new no-unnecessary-act rule

README.md

@@ -193,15 +193,16 @@ To enable this configuration use the `extends` property in your
 | [testing-library/no-node-access](docs/rules/no-node-access.md)                                   | Disallow direct Node access                                                              | ![angular-badge][] ![react-badge][] ![vue-badge][]                |                    |
 | [testing-library/no-promise-in-fire-event](docs/rules/no-promise-in-fire-event.md)               | Disallow the use of promises passed to a `fireEvent` method                              | ![dom-badge][] ![angular-badge][] ![react-badge][] ![vue-badge][] |                    |
 | [testing-library/no-render-in-setup](docs/rules/no-render-in-setup.md)                           | Disallow the use of `render` in setup functions                                          |                                                                   |                    |
+| [testing-library/no-unnecessary-act](docs/rules/no-unnecessary-act.md)                           | Disallow wrapping Testing Library utils or empty callbacks in `act`                      |                                                                   |                    |
 | [testing-library/no-wait-for-empty-callback](docs/rules/no-wait-for-empty-callback.md)           | Disallow empty callbacks for `waitFor` and `waitForElementToBeRemoved`                   | ![dom-badge][] ![angular-badge][] ![react-badge][] ![vue-badge][] |                    |
 | [testing-library/no-wait-for-multiple-assertions](docs/rules/no-wait-for-multiple-assertions.md) | Disallow the use of multiple expect inside `waitFor`                                     |                                                                   |                    |
 | [testing-library/no-wait-for-side-effects](docs/rules/no-wait-for-side-effects.md)               | Disallow the use of side effects inside `waitFor`                                        |                                                                   |                    |
 | [testing-library/no-wait-for-snapshot](docs/rules/no-wait-for-snapshot.md)                       | Ensures no snapshot is generated inside of a `waitFor` call                              |                                                                   |                    |
 | [testing-library/prefer-explicit-assert](docs/rules/prefer-explicit-assert.md)                   | Suggest using explicit assertions rather than just `getBy*` queries                      |                                                                   |                    |
 | [testing-library/prefer-find-by](docs/rules/prefer-find-by.md)                                   | Suggest using `findBy*` methods instead of the `waitFor` + `getBy` queries               | ![dom-badge][] ![angular-badge][] ![react-badge][] ![vue-badge][] | ![fixable-badge][] |
 | [testing-library/prefer-presence-queries](docs/rules/prefer-presence-queries.md)                 | Enforce specific queries when checking element is present or not                         |                                                                   |                    |
-| [testing-library/prefer-user-event](docs/rules/prefer-user-event.md)                             | Suggest using `userEvent` library instead of `fireEvent` for simulating user interaction |                                                                   |                    |
 | [testing-library/prefer-screen-queries](docs/rules/prefer-screen-queries.md)                     | Suggest using screen while using queries                                                 | ![dom-badge][] ![angular-badge][] ![react-badge][] ![vue-badge][] |                    |
+| [testing-library/prefer-user-event](docs/rules/prefer-user-event.md)                             | Suggest using `userEvent` library instead of `fireEvent` for simulating user interaction |                                                                   |                    |
 | [testing-library/prefer-wait-for](docs/rules/prefer-wait-for.md)                                 | Use `waitFor` instead of deprecated wait methods                                         |                                                                   | ![fixable-badge][] |
 | [testing-library/render-result-naming-convention](docs/rules/render-result-naming-convention.md) | Enforce a valid naming for return value from `render`                                    | ![angular-badge][] ![react-badge][] ![vue-badge][]                |                    |
 

docs/rules/no-unnecessary-act.md

@@ -0,0 +1,117 @@
+# Disallow wrapping Testing Library utils or empty callbacks in `act` (`testing-library/no-unnecessary-act`)
+
+> ⚠️ The `act` method is only available on the following Testing Library packages:
+>
+> - `@testing-library/react` (supported by this plugin)
+> - `@testing-library/preact` (not supported yet by this plugin)
+> - `@testing-library/svelte` (not supported yet by this plugin)
+
+## Rule Details
+
+This rule aims to avoid the usage of `act` to wrap Testing Library utils just to silence "not wrapped in act(...)" warnings.
+
+All Testing Library utils are already wrapped in `act`. Most of the time, if you're seeing an `act` warning, it's not just something to be silenced, but it's actually telling you that something unexpected is happening in your test.
+
+Additionally, wrapping empty callbacks in `act` is also an incorrect way of silencing "not wrapped in act(...)" warnings.
+
+Code violations reported by this rule will pinpoint those unnecessary `act`, helping to understand when `act` actually is necessary.
+
+Example of **incorrect** code for this rule:
+
+```js
+// ❌ wrapping things related to Testing Library in `act` is incorrect
+import {
+  act,
+  render,
+  screen,
+  waitFor,
+  fireEvent,
+} from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+
+// ...
+
+act(() => {
+  render(<Example />);
+});
+
+await act(async () => waitFor(() => {}));
+
+act(() => screen.getByRole('button'));
+
+act(() => {
+  fireEvent.click(element);
+});
+
+act(() => {
+  userEvent.click(element);
+});
+```
+
+```js
+// ❌ wrapping empty callbacks in `act` is incorrect
+import { act } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+
+// ...
+
+act(() => {});
+
+await act(async () => {});
+```
+
+```js
+// ❌ wrapping things related to Testing Library in React DOM Test Utils `act` is also incorrect
+import { act } from 'react-dom/test-utils';
+import { render, screen, waitFor, fireEvent } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+
+// ...
+
+act(() => {
+  render(<Example />);
+});
+
+await act(async () => waitFor(() => {}));
+
+act(() => screen.getByRole('button'));
+
+act(() => {
+  fireEvent.click(element);
+});
+
+act(() => {
+  userEvent.click(element);
+});
+```
+
+Examples of **correct** code for this rule:
+
+```js
+// ✅ wrapping things not related to Testing Library in `act` is correct
+import { act } from '@testing-library/react';
+import { stuffThatDoesNotUseRTL } from 'somwhere-else';
+
+// ...
+
+act(() => {
+  stuffThatDoesNotUseRTL();
+});
+```
+
+```js
+// ✅ wrapping both things related and not related to Testing Library in `act` is correct
+import { act, screen } from '@testing-library/react';
+import { stuffThatDoesNotUseRTL } from 'somwhere-else';
+
+await act(async () => {
+  await screen.findByRole('button');
+  stuffThatDoesNotUseRTL();
+});
+```
+
+## Further Reading
+
+- [Inspiration for this rule](https://kentcdodds.com/blog/common-mistakes-with-react-testing-library#wrapping-things-in-act-unnecessarily)
+- [Fix the "not wrapped in act(...)" warning](https://kentcdodds.com/blog/fix-the-not-wrapped-in-act-warning)
+- [About React Testing Library `act`](https://testing-library.com/docs/react-testing-library/api/#act)