diff --git a/README.md b/README.md
index 0fa46197..20b8322c 100644
--- a/README.md
+++ b/README.md
@@ -299,7 +299,7 @@ module.exports = [
| [await-async-utils](docs/rules/await-async-utils.md) | Enforce promises from async utils to be awaited properly | ![badge-angular][] ![badge-dom][] ![badge-marko][] ![badge-react][] ![badge-vue][] | | |
| [consistent-data-testid](docs/rules/consistent-data-testid.md) | Ensures consistent usage of `data-testid` | | | |
| [no-await-sync-events](docs/rules/no-await-sync-events.md) | Disallow unnecessary `await` for sync events | ![badge-angular][] ![badge-dom][] ![badge-react][] | | |
-| [no-await-sync-queries](docs/rules/no-await-sync-queries.md) | Disallow unnecessary `await` for sync queries | ![badge-angular][] ![badge-dom][] ![badge-marko][] ![badge-react][] ![badge-vue][] | | |
+| [no-await-sync-queries](docs/rules/no-await-sync-queries.md) | Disallow unnecessary `await` for sync queries | ![badge-angular][] ![badge-dom][] ![badge-marko][] ![badge-react][] ![badge-vue][] | | 🔧 |
| [no-container](docs/rules/no-container.md) | Disallow the use of `container` methods | ![badge-angular][] ![badge-marko][] ![badge-react][] ![badge-vue][] | | |
| [no-debugging-utils](docs/rules/no-debugging-utils.md) | Disallow the use of debugging utilities like `debug` | | ![badge-angular][] ![badge-marko][] ![badge-react][] ![badge-vue][] | |
| [no-dom-import](docs/rules/no-dom-import.md) | Disallow importing from DOM Testing Library | ![badge-angular][] ![badge-marko][] ![badge-react][] ![badge-vue][] | | 🔧 |
diff --git a/docs/rules/no-await-sync-queries.md b/docs/rules/no-await-sync-queries.md
index a4538d71..9724b712 100644
--- a/docs/rules/no-await-sync-queries.md
+++ b/docs/rules/no-await-sync-queries.md
@@ -2,6 +2,8 @@
💼 This rule is enabled in the following configs: `angular`, `dom`, `marko`, `react`, `vue`.
+🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
+
<!-- end auto-generated rule header -->
Ensure that sync queries are not awaited unnecessarily.
diff --git a/lib/rules/no-await-sync-queries.ts b/lib/rules/no-await-sync-queries.ts
index c6f4a70c..a8c341c3 100644
--- a/lib/rules/no-await-sync-queries.ts
+++ b/lib/rules/no-await-sync-queries.ts
@@ -1,4 +1,4 @@
-import { TSESTree } from '@typescript-eslint/utils';
+import { ASTUtils, TSESTree } from '@typescript-eslint/utils';
import { createTestingLibraryRule } from '../create-testing-library-rule';
import { getDeepestIdentifierNode } from '../node-utils';
@@ -26,15 +26,20 @@ export default createTestingLibraryRule<Options, MessageIds>({
'`{{ name }}` query is sync so it does not need to be awaited',
},
schema: [],
+ fixable: 'code',
},
defaultOptions: [],
create(context, _, helpers) {
return {
'AwaitExpression > CallExpression'(node: TSESTree.CallExpression) {
+ const awaitExpression = node.parent;
const deepestIdentifierNode = getDeepestIdentifierNode(node);
- if (!deepestIdentifierNode) {
+ if (
+ !ASTUtils.isAwaitExpression(awaitExpression) ||
+ !deepestIdentifierNode
+ ) {
return;
}
@@ -45,6 +50,15 @@ export default createTestingLibraryRule<Options, MessageIds>({
data: {
name: deepestIdentifierNode.name,
},
+ fix: (fixer) => {
+ const awaitRangeStart = awaitExpression.range[0];
+ const awaitRangeEnd = awaitExpression.range[0] + 'await'.length;
+
+ return fixer.replaceTextRange(
+ [awaitRangeStart, awaitRangeEnd],
+ ''
+ );
+ },
});
}
},
diff --git a/tests/lib/rules/no-await-sync-queries.test.ts b/tests/lib/rules/no-await-sync-queries.test.ts
index 0896f817..3d91625b 100644
--- a/tests/lib/rules/no-await-sync-queries.test.ts
+++ b/tests/lib/rules/no-await-sync-queries.test.ts
@@ -142,6 +142,10 @@ ruleTester.run(RULE_NAME, rule, {
column: 31,
},
],
+ output: `async () => {
+ const element = ${query}('foo')
+ }
+ `,
}) as const
),
// custom sync queries with await operator are not valid
@@ -152,6 +156,24 @@ ruleTester.run(RULE_NAME, rule, {
}
`,
errors: [{ messageId: 'noAwaitSyncQuery', line: 3, column: 31 }],
+ output: `
+ async () => {
+ const element = getByIcon('search')
+ }
+ `,
+ },
+ {
+ code: `
+ async () => {
+ const element = await(getByIcon('search'))
+ }
+ `,
+ errors: [{ messageId: 'noAwaitSyncQuery', line: 3, column: 31 }],
+ output: `
+ async () => {
+ const element = (getByIcon('search'))
+ }
+ `,
},
{
code: `
@@ -160,6 +182,11 @@ ruleTester.run(RULE_NAME, rule, {
}
`,
errors: [{ messageId: 'noAwaitSyncQuery', line: 3, column: 31 }],
+ output: `
+ async () => {
+ const element = queryByIcon('search')
+ }
+ `,
},
{
code: `
@@ -168,6 +195,11 @@ ruleTester.run(RULE_NAME, rule, {
}
`,
errors: [{ messageId: 'noAwaitSyncQuery', line: 3, column: 38 }],
+ output: `
+ async () => {
+ const element = screen.getAllByIcon('search')
+ }
+ `,
},
{
code: `
@@ -176,6 +208,11 @@ ruleTester.run(RULE_NAME, rule, {
}
`,
errors: [{ messageId: 'noAwaitSyncQuery', line: 3, column: 38 }],
+ output: `
+ async () => {
+ const element = screen.queryAllByIcon('search')
+ }
+ `,
},
// sync queries with await operator inside assert are not valid
...SYNC_QUERIES_COMBINATIONS.map(
@@ -192,6 +229,10 @@ ruleTester.run(RULE_NAME, rule, {
column: 22,
},
],
+ output: `async () => {
+ expect( ${query}('foo')).toBeEnabled()
+ }
+ `,
}) as const
),
@@ -210,6 +251,10 @@ ruleTester.run(RULE_NAME, rule, {
column: 38,
},
],
+ output: `async () => {
+ const element = screen.${query}('foo')
+ }
+ `,
}) as const
),
@@ -228,6 +273,10 @@ ruleTester.run(RULE_NAME, rule, {
column: 29,
},
],
+ output: `async () => {
+ expect( screen.${query}('foo')).toBeEnabled()
+ }
+ `,
}) as const
),
@@ -244,6 +293,12 @@ ruleTester.run(RULE_NAME, rule, {
}
`,
errors: [{ messageId: 'noAwaitSyncQuery', line: 4, column: 38 }],
+ output: `
+ import { screen } from '${testingFramework}'
+ () => {
+ const element = screen.getByRole('button')
+ }
+ `,
}) as const
),
// sync query awaited and related to custom module is not valid
@@ -256,6 +311,12 @@ ruleTester.run(RULE_NAME, rule, {
}
`,
errors: [{ messageId: 'noAwaitSyncQuery', line: 4, column: 38 }],
+ output: `
+ import { screen } from 'test-utils'
+ () => {
+ const element = screen.getByRole('button')
+ }
+ `,
},
// awaited custom sync query matching custom-queries setting is invalid
@@ -269,6 +330,11 @@ ruleTester.run(RULE_NAME, rule, {
})
`,
errors: [{ messageId: 'noAwaitSyncQuery', line: 3, column: 31 }],
+ output: `
+ test('A valid example test', async () => {
+ const element = queryByIcon('search')
+ })
+ `,
},
],
});