fix(prefer-find-by): simplify error message

Author: Belco90

lib/rules/prefer-find-by.ts

@@ -17,7 +17,7 @@ export const RULE_NAME = 'prefer-find-by';
 export type MessageIds = 'preferFindBy';
 type Options = [];
 
-export const WAIT_METHODS = ['waitFor', 'waitForElement', 'wait'];
+export const WAIT_METHODS = ['waitFor', 'waitForElement', 'wait'] as const;
 
 export function getFindByQueryVariant(
   queryMethod: string
@@ -53,13 +53,13 @@ export default createTestingLibraryRule<Options, MessageIds>({
     type: 'suggestion',
     docs: {
       description:
-        'Suggest using find* instead of waitFor to wait for elements',
+        'Suggest using `find*` query instead of `waitFor` + `get*` to wait for elements',
       category: 'Best Practices',
       recommended: 'warn',
     },
     messages: {
       preferFindBy:
-        'Prefer {{queryVariant}}{{queryMethod}} method over using await {{fullQuery}}',
+        'Prefer `{{queryVariant}}{{queryMethod}}` query over using `{{waitForMethodName}}` + `{{prevQuery}}`',
     },
     fixable: 'code',
     schema: [],
@@ -71,30 +71,39 @@ export default createTestingLibraryRule<Options, MessageIds>({
 
     /**
      * Reports the invalid usage of wait* plus getBy/QueryBy methods and automatically fixes the scenario
-     * @param {TSESTree.CallExpression} node - The CallExpresion node that contains the wait* method
-     * @param {'findBy' | 'findAllBy'} replacementParams.queryVariant - The variant method used to query: findBy/findByAll.
-     * @param {string} replacementParams.queryMethod - Suffix string to build the query method (the query-part that comes after the "By"): LabelText, Placeholder, Text, Role, Title, etc.
-     * @param {ReportFixFunction} replacementParams.fix - Function that applies the fix to correct the code
+     * @param node - The CallExpresion node that contains the wait* method
+     * @param replacementParams - Object with info for error message and autofix:
+     * @param replacementParams.queryVariant - The variant method used to query: findBy/findAllBy.
+     * @param replacementParams.prevQuery - The query originally used inside `waitFor`
+     * @param replacementParams.queryMethod - Suffix string to build the query method (the query-part that comes after the "By"): LabelText, Placeholder, Text, Role, Title, etc.
+     * @param replacementParams.waitForMethodName - wait for method used: waitFor/wait/waitForElement
+     * @param replacementParams.fix - Function that applies the fix to correct the code
      */
     function reportInvalidUsage(
       node: TSESTree.CallExpression,
-      {
-        queryVariant,
-        queryMethod,
-        fix,
-      }: {
+      replacementParams: {
         queryVariant: 'findBy' | 'findAllBy';
         queryMethod: string;
+        prevQuery: string;
+        waitForMethodName: string;
         fix: ReportFixFunction;
       }
     ) {
+      const {
+        queryMethod,
+        queryVariant,
+        prevQuery,
+        waitForMethodName,
+        fix,
+      } = replacementParams;
       context.report({
         node,
         messageId: 'preferFindBy',
         data: {
           queryVariant,
           queryMethod,
-          fullQuery: sourceCode.getText(node),
+          prevQuery,
+          waitForMethodName,
         },
         fix,
       });
@@ -104,7 +113,7 @@ export default createTestingLibraryRule<Options, MessageIds>({
       'AwaitExpression > CallExpression'(node: TSESTree.CallExpression) {
         if (
           !ASTUtils.isIdentifier(node.callee) ||
-          !WAIT_METHODS.includes(node.callee.name)
+          !helpers.isAsyncUtil(node.callee, WAIT_METHODS)
         ) {
           return;
         }
@@ -117,6 +126,9 @@ export default createTestingLibraryRule<Options, MessageIds>({
         if (!isCallExpression(argument.body)) {
           return;
         }
+
+        const waitForMethodName = node.callee.name;
+
         // ensure here it's one of the sync methods that we are calling
         if (
           isMemberExpression(argument.body.callee) &&
@@ -134,6 +146,8 @@ export default createTestingLibraryRule<Options, MessageIds>({
           reportInvalidUsage(node, {
             queryMethod,
             queryVariant,
+            prevQuery: fullQueryMethod,
+            waitForMethodName,
             fix(fixer) {
               const property = ((argument.body as TSESTree.CallExpression)
                 .callee as TSESTree.MemberExpression).property;
@@ -163,6 +177,8 @@ export default createTestingLibraryRule<Options, MessageIds>({
         reportInvalidUsage(node, {
           queryMethod,
           queryVariant,
+          prevQuery: fullQueryMethod,
+          waitForMethodName,
           fix(fixer) {
             // we know from above callee is an Identifier
             if (

tests/lib/rules/prefer-find-by.test.ts

@@ -149,7 +149,8 @@ ruleTester.run(RULE_NAME, rule, {
           data: {
             queryVariant: getFindByQueryVariant(queryMethod),
             queryMethod: queryMethod.split('By')[1],
-            fullQuery: `${waitMethod}(() => ${queryMethod}('foo', { name: 'baz' }))`,
+            prevQuery: queryMethod,
+            waitForMethodName: waitMethod,
           },
         },
       ],
@@ -176,7 +177,8 @@ ruleTester.run(RULE_NAME, rule, {
           data: {
             queryVariant: getFindByQueryVariant(queryMethod),
             queryMethod: queryMethod.split('By')[1],
-            fullQuery: `${waitMethod}(() => screen.${queryMethod}('foo', { name: 'baz' }))`,
+            prevQuery: queryMethod,
+            waitForMethodName: waitMethod,
           },
         },
       ],
@@ -204,7 +206,8 @@ ruleTester.run(RULE_NAME, rule, {
           data: {
             queryVariant: 'findBy',
             queryMethod: 'Text',
-            fullQuery: `${waitMethod}(() => getByText('baz', { name: 'button' }))`,
+            prevQuery: 'getByText',
+            waitForMethodName: waitMethod,
           },
         },
       ],
@@ -231,7 +234,8 @@ ruleTester.run(RULE_NAME, rule, {
           data: {
             queryVariant: 'findAllBy',
             queryMethod: 'Role',
-            fullQuery: `${waitMethod}(() => getAllByRole('baz', { name: 'button' }))`,
+            prevQuery: 'getAllByRole',
+            waitForMethodName: waitMethod,
           },
         },
       ],
@@ -252,7 +256,8 @@ ruleTester.run(RULE_NAME, rule, {
           data: {
             queryVariant: 'findBy',
             queryMethod: 'Text',
-            fullQuery: `waitFor(() => getByText('baz', { name: 'button' }))`,
+            prevQuery: 'getByText',
+            waitForMethodName: 'waitFor',
           },
         },
       ],
@@ -270,7 +275,8 @@ ruleTester.run(RULE_NAME, rule, {
           data: {
             queryVariant: 'findBy',
             queryMethod: 'Role',
-            fullQuery: `waitFor(() => getByRole('baz', { name: 'button' }))`,
+            prevQuery: 'getByRole',
+            waitForMethodName: 'waitFor',
           },
         },
       ],
@@ -294,7 +300,8 @@ ruleTester.run(RULE_NAME, rule, {
           data: {
             queryVariant: 'findBy',
             queryMethod: 'CustomQuery',
-            fullQuery: `${waitMethod}(() => getByCustomQuery('baz'))`,
+            prevQuery: 'getByCustomQuery',
+            waitForMethodName: waitMethod,
           },
         },
       ],
@@ -321,7 +328,8 @@ ruleTester.run(RULE_NAME, rule, {
           data: {
             queryVariant: 'findBy',
             queryMethod: 'CustomQuery',
-            fullQuery: `${waitMethod}(() => screen.getByCustomQuery('baz'))`,
+            prevQuery: 'getByCustomQuery',
+            waitForMethodName: waitMethod,
           },
         },
       ],