fix: async checks when calling queries member expressions (#114)

Closes #113 

* refactor(await-async-query): remove redundant checks

While running Program:exit(), nodes were tested again unnecessarily for isAwaited and isPromiseResolved

* fix(await-async-query): check queries being called as member expressions

First, abstract a isQueryUsage function to check if a node should be checked for this rule. Then, add new selector
for queries being called as part of MemberExpression and check their parent against the rule. Finally, use the
queryName prop to make sure the right error message is printed

* docs(await-async-query): add valid and invalid examples using screen

* fix(no-await-sync-query): prevent screen sync queries from using await

First, abstract reportError function. Then, create selector for MemberExpression queries.

* docs(no-await-sync-query): add valid and invalid examples using screen

Author: victorandcode

Diff for: docs/rules/await-async-query.md

@@ -30,6 +30,12 @@ const bar = () => {
   findByText('submit');
   // ...
 };
+
+const baz = () => {
+  // ...
+  screen.findAllByPlaceholderText('name');
+  // ...
+};
 ```
 
 Examples of **correct** code for this rule:
@@ -50,6 +56,12 @@ const bar = () => {
   });
 };
 
+const baz = () => {
+  // ...
+  await screen.findAllByPlaceholderText('name');
+  // ...
+};
+
 // return the promise within a function is correct too!
 const findMyButton = () => findByText('my button');
 

Diff for: docs/rules/no-await-sync-query.md

@@ -29,6 +29,11 @@ const bar = () => {
     // ...
   });
 };
+
+const baz = () => {
+  // ...
+  const button = await screen.getByText('submit');
+};
 ```
 
 Examples of **correct** code for this rule:
@@ -45,6 +50,11 @@ const bar = () => {
   const button = getByText('submit');
   // ...
 };
+
+const baz = () => {
+  // ...
+  const button = screen.getByText('submit');
+};
 ```
 
 ## Further Reading

Diff for: lib/rules/await-async-query.js

@@ -28,18 +28,26 @@ module.exports = {
 
   create: function(context) {
     const testingLibraryQueryUsage = [];
+    const isQueryUsage = node =>
+      !isAwaited(node.parent.parent) &&
+      !isPromiseResolved(node) &&
+      !hasClosestExpectResolvesRejects(node);
+
     return {
       [`CallExpression > Identifier[name=${ASYNC_QUERIES_REGEXP}]`](node) {
-        if (
-          !isAwaited(node.parent.parent) &&
-          !isPromiseResolved(node) &&
-          !hasClosestExpectResolvesRejects(node)
-        ) {
-          testingLibraryQueryUsage.push(node);
+        if (isQueryUsage(node)) {
+          testingLibraryQueryUsage.push({ node, queryName: node.name });
+        }
+      },
+      [`MemberExpression > Identifier[name=${ASYNC_QUERIES_REGEXP}]`](node) {
+        // Perform checks in parent MemberExpression insted of current identifier
+        const parent = node.parent;
+        if (isQueryUsage(parent)) {
+          testingLibraryQueryUsage.push({ node: parent, queryName: node.name });
         }
       },
       'Program:exit'() {
-        testingLibraryQueryUsage.forEach(node => {
+        testingLibraryQueryUsage.forEach(({ node, queryName }) => {
           const variableDeclaratorParent = node.parent.parent;
 
           const references =
@@ -49,17 +57,12 @@ module.exports = {
                 .references.slice(1)) ||
             [];
 
-          if (
-            references &&
-            references.length === 0 &&
-            !isAwaited(node.parent.parent) &&
-            !isPromiseResolved(node)
-          ) {
+          if (references && references.length === 0) {
             context.report({
               node,
               messageId: 'awaitAsyncQuery',
               data: {
-                name: node.name,
+                name: queryName,
               },
             });
           } else {
@@ -73,7 +76,7 @@ module.exports = {
                   node,
                   messageId: 'awaitAsyncQuery',
                   data: {
-                    name: node.name,
+                    name: queryName,
                   },
                 });
 

Diff for: lib/rules/no-await-sync-query.js

@@ -21,18 +21,17 @@ module.exports = {
   },
 
   create: function(context) {
+    const reportError = node =>
+      context.report({
+        node,
+        messageId: 'noAwaitSyncQuery',
+        data: {
+          name: node.name,
+        },
+      });
     return {
-      [`AwaitExpression > CallExpression > Identifier[name=${SYNC_QUERIES_REGEXP}]`](
-        node
-      ) {
-        context.report({
-          node,
-          messageId: 'noAwaitSyncQuery',
-          data: {
-            name: node.name,
-          },
-        });
-      },
+      [`AwaitExpression > CallExpression > Identifier[name=${SYNC_QUERIES_REGEXP}]`]: reportError,
+      [`AwaitExpression > CallExpression > MemberExpression > Identifier[name=${SYNC_QUERIES_REGEXP}]`]: reportError,
     };
   },
 };

Diff for: tests/lib/rules/await-async-query.js

@@ -25,6 +25,14 @@ ruleTester.run('await-async-query', rule, {
       `,
     })),
 
+    // async queries declaration are valid
+    ...ASYNC_QUERIES_COMBINATIONS.map(query => ({
+      code: `async () => {
+        await screen.${query}('foo')
+      }
+      `,
+    })),
+
     // async queries with await operator are valid
     ...ASYNC_QUERIES_COMBINATIONS.map(query => ({
       code: `async () => {
@@ -151,6 +159,25 @@ ruleTester.run('await-async-query', rule, {
           },
         ],
       })),
+      ...ASYNC_QUERIES_COMBINATIONS.map(query => ({
+        code: `async () => {
+        screen.${query}('foo')
+      }
+      `,
+        errors: [
+          {
+            messageId: 'awaitAsyncQuery',
+          },
+        ],
+      })),
+      ...ASYNC_QUERIES_COMBINATIONS.map(query => ({
+        code: `const foo = screen.${query}('foo')`,
+        errors: [
+          {
+            messageId: 'awaitAsyncQuery',
+          },
+        ],
+      })),
       ...ASYNC_QUERIES_COMBINATIONS.map(query => ({
         code: `async () => {
         const foo = ${query}('foo')

Diff for: tests/lib/rules/no-await-sync-query.js

@@ -43,9 +43,9 @@ ruleTester.run('no-await-sync-query', rule, {
     })),
   ],
 
-  invalid:
+  invalid: [
     // sync queries with await operator are not valid
-    SYNC_QUERIES_COMBINATIONS.map(query => ({
+    ...SYNC_QUERIES_COMBINATIONS.map(query => ({
       code: `async () => {
         await ${query}('foo')
       }
@@ -56,4 +56,18 @@ ruleTester.run('no-await-sync-query', rule, {
         },
       ],
     })),
+
+    // sync queries in screen with await operator are not valid
+    ...SYNC_QUERIES_COMBINATIONS.map(query => ({
+      code: `async () => {
+        await screen.${query}('foo')
+      }
+      `,
+      errors: [
+        {
+          messageId: 'noAwaitSyncQuery',
+        },
+      ],
+    })),
+  ],
 });