refactor: use custom rule creator for promise-queries rules (#260)

* refactor(no-await-sync-query): use custom rule creator * refactor(no-await-sync-query): improve error message * test(no-await-sync-query): check error location in invalid cases * refactor(no-await-sync-query): catch sync queries with detection helper * test(no-await-sync-query): use more realistic scenarios * test(no-await-sync-query): add more cases for custom queries and settings * refactor(await-async-query): use custom rule creator * refactor(await-async-query): improve error message * feat: new detection helpers for findBy queries * refactor(await-async-query): detection helpers + aggressive reporting * test(await-async-query): add cases for custom queries * test(await-async-query): add more cases for custom queries * test(await-async-query): check errors locations * test(await-async-query): mix built-in and custom queries * test(await-async-query): non-matching query case * feat(await-async-query): report query wrappers * refactor(await-async-query): extract ast utils for functions * test(await-async-query): cases for arrow functions * refactor(await-async-query): extract ast util for promise handled * test(await-async-query): increase coverage * refactor(await-async-query): rename isPromiseResolved to hasChainedThen * docs(await-async-query): update rule description and examples * docs(await-async-query): minor improvements * refactor: minor type fix * docs(await-async-query): more fixes * docs(await-async-query): wrong return type * refactor(await-async-query): check regex more efficiently

Author: Belco90

README.md

@@ -127,7 +127,7 @@ To enable this configuration use the `extends` property in your
 
 | Rule | Description | Configurations | Fixable |
 | -------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------- | ----------------------------------------------------------------- | ------------------ |
-| [await-async-query](docs/rules/await-async-query.md) | Enforce async queries to have proper `await`  | ![dom-badge][] ![angular-badge][] ![react-badge][] ![vue-badge][] | |
+| [await-async-query](docs/rules/await-async-query.md) | Enforce promises from async queries to be handled | ![dom-badge][] ![angular-badge][] ![react-badge][] ![vue-badge][] | |
 | [await-async-utils](docs/rules/await-async-utils.md) | Enforce async utils to be awaited properly | ![dom-badge][] ![angular-badge][] ![react-badge][] ![vue-badge][] | |
 | [await-fire-event](docs/rules/await-fire-event.md) | Enforce async fire event methods to be awaited | ![vue-badge][] | |
 | [consistent-data-testid](docs/rules/consistent-data-testid.md) | Ensure `data-testid` values match a provided regex. | | |

docs/rules/await-async-query.md

@@ -1,75 +1,86 @@
-# Enforce async queries to have proper `await` (await-async-query)
+# Enforce promises from async queries to be handled (await-async-query)
 
 Ensure that promises returned by async queries are handled properly.
 
 ## Rule Details
 
-Some of the queries variants that Testing Library provides are
+Some queries variants that Testing Library provides are
 asynchronous as they return a promise which resolves when elements are
 found. Those queries variants are:
 
 - `findBy*`
 - `findAllBy*`
 
-This rule aims to prevent users from forgetting to await the returned
+This rule aims to prevent users from forgetting to handle the returned
 promise from those async queries to be fulfilled, which could lead to
-errors in the tests. The promises can be handled by using either `await`
-operator or `then` method.
+errors in the tests. The promise will be considered as handled when:
+
+- using the `await` operator
+- chaining the `then` method
+- chaining `resolves` or `rejects` from jest
+- it's returned from a function (in this case, that particular function will be analyzed by this rule too)
 
 Examples of **incorrect** code for this rule:
 
 ```js
-const foo = () => {
- // ...
- const rows = findAllByRole('row');
- // ...
-};
-
-const bar = () => {
- // ...
- findByText('submit');
- // ...
-};
-
-const baz = () => {
- // ...
- screen.findAllByPlaceholderText('name');
- // ...
-};
+// async query without handling promise
+const rows = findAllByRole('row');
+
+findByIcon('search');
+
+screen.findAllByPlaceholderText('name');
+```
+
+```js
+// promise from async query returned within wrapper function without being handled
+const findMyButton = () => findByText('my button');
+
+const someButton = findMyButton(); // promise unhandled here
 ```
 
 Examples of **correct** code for this rule:
 
 ```js
 // `await` operator is correct
-const foo = async () => {
- // ...
- const rows = await findAllByRole('row');
- // ...
-};
+const rows = await findAllByRole('row');
+
+await screen.findAllByPlaceholderText('name');
+
+const promise = findByIcon('search');
+const element = await promise;
+```
 
+```js
 // `then` method is correct
-const bar = () => {
- // ...
- findByText('submit').then(() => {
- // ...
- });
-};
-
-const baz = () => {
- // ...
- await screen.findAllByPlaceholderText('name');
- // ...
-};
+findByText('submit').then(() => {});
 
+const promise = findByRole('button');
+promise.then(() => {});
+```
+
+```js
 // return the promise within a function is correct too!
 const findMyButton = () => findByText('my button');
+```
+
+```js
+// promise from async query returned within wrapper function being handled
+const findMyButton = () => findByText('my button');
 
+const someButton = await findMyButton();
+```
+
+```js
 // using a resolves/rejects matcher is also correct
 expect(findByTestId('alert')).resolves.toBe('Success');
 expect(findByTestId('alert')).rejects.toBe('Error');
 ```
 
+```js
+// sync queries don't need to handle any promise
+const element = getByRole('role');
+```
+
 ## Further Reading
 
 - [Async queries variants](https://testing-library.com/docs/dom-testing-library/api-queries#findby)

lib/detect-testing-library-utils.ts

@@ -50,7 +50,9 @@ export type DetectionHelpers = {
  isValidFilename: () => boolean;
  isGetByQuery: (node: TSESTree.Identifier) => boolean;
  isQueryByQuery: (node: TSESTree.Identifier) => boolean;
+ isFindByQuery: (node: TSESTree.Identifier) => boolean;
  isSyncQuery: (node: TSESTree.Identifier) => boolean;
+ isAsyncQuery: (node: TSESTree.Identifier) => boolean;
  isPresenceAssert: (node: TSESTree.MemberExpression) => boolean;
  isAbsenceAssert: (node: TSESTree.MemberExpression) => boolean;
  canReportErrors: () => boolean;
@@ -135,14 +137,21 @@ export function detectTestingLibraryUtils<
  * Determines whether a given node is `getBy*` or `getAllBy*` query variant or not.
  */
  const isGetByQuery: DetectionHelpers['isGetByQuery'] = (node) => {
- return !!node.name.match(/^get(All)?By.+$/);
+ return /^get(All)?By.+$/.test(node.name);
  };
 
  /**
  * Determines whether a given node is `queryBy*` or `queryAllBy*` query variant or not.
  */
  const isQueryByQuery: DetectionHelpers['isQueryByQuery'] = (node) => {
- return !!node.name.match(/^query(All)?By.+$/);
+ return /^query(All)?By.+$/.test(node.name);
+ };
+
+ /**
+ * Determines whether a given node is `findBy*` or `findAllBy*` query variant or not.
+ */
+ const isFindByQuery: DetectionHelpers['isFindByQuery'] = (node) => {
+ return /^find(All)?By.+$/.test(node.name);
  };
 
  /**
@@ -152,6 +161,13 @@ export function detectTestingLibraryUtils<
  return isGetByQuery(node) || isQueryByQuery(node);
  };
 
+ /**
+ * Determines whether a given node is async query or not.
+ */
+ const isAsyncQuery: DetectionHelpers['isAsyncQuery'] = (node) => {
+ return isFindByQuery(node);
+ };
+
  /**
  * Determines whether a given MemberExpression node is a presence assert
  *
@@ -293,7 +309,9 @@ export function detectTestingLibraryUtils<
  isValidFilename,
  isGetByQuery,
  isQueryByQuery,
+ isFindByQuery,
  isSyncQuery,
+ isAsyncQuery,
  isPresenceAssert,
  isAbsenceAssert,
  canReportErrors,