feat(no-wait-for-side-effects): report render usage in waitFor (#363)

* feat(no-wait-for-side-effects): report render in waitFor

* refactor: move null check into isTestingLibraryUtil

* refactor: move null check into assignment

* refactor: add brackets around null check

* refactor: introduce early returns in getSideEffectNodes()

* refactor: remove newlines

* refactor: move checks to separate functions to improve readability

* refactor: merge multiple if statements into one

* refactor: remove null types in utils

* refactor: merge two functions into one, add missing test case

* feat: add docs entry

* refactor: pass function arg without wrapping it

Author: zaicevas

docs/rules/no-wait-for-side-effects.md

@@ -2,7 +2,7 @@
 
 ## Rule Details
 
-This rule aims to avoid the usage of side effects actions (`fireEvent` or `userEvent`) inside `waitFor`.
+This rule aims to avoid the usage of side effects actions (`fireEvent`, `userEvent` or `render`) inside `waitFor`.
 Since `waitFor` is intended for things that have a non-deterministic amount of time between the action you performed and the assertion passing,
 the callback can be called (or checked for errors) a non-deterministic number of times and frequency.
 This will make your side-effect run multiple times.
@@ -32,6 +32,18 @@ Example of **incorrect** code for this rule:
     userEvent.click(button);
     expect(b).toEqual('b');
   });
+
+  // or
+  await waitFor(() => {
+    render(<App />)
+    expect(b).toEqual('b');
+  });
+
+  // or
+  await waitFor(function() {
+    render(<App />)
+    expect(b).toEqual('b');
+  });
 };
 ```
 
@@ -60,6 +72,18 @@ Examples of **correct** code for this rule:
   await waitFor(function() {
     expect(b).toEqual('b');
   });
+
+  // or
+  render(<App />)
+  await waitFor(() => {
+    expect(b).toEqual('b');
+  });
+
+  // or
+  render(<App />)
+  await waitFor(function() {
+    expect(b).toEqual('b');
+  });
 };
 ```
 

lib/node-utils/is-node-of-type.ts

@@ -16,6 +16,15 @@ export const isCallExpression = isNodeOfType(AST_NODE_TYPES.CallExpression);
 export const isExpressionStatement = isNodeOfType(
   AST_NODE_TYPES.ExpressionStatement
 );
+export const isVariableDeclaration = isNodeOfType(
+  AST_NODE_TYPES.VariableDeclaration
+);
+export const isAssignmentExpression = isNodeOfType(
+  AST_NODE_TYPES.AssignmentExpression
+);
+export const isSequenceExpression = isNodeOfType(
+  AST_NODE_TYPES.SequenceExpression
+);
 export const isImportDeclaration = isNodeOfType(
   AST_NODE_TYPES.ImportDeclaration
 );

lib/rules/no-wait-for-side-effects.ts

@@ -2,6 +2,10 @@ import { TSESTree } from '@typescript-eslint/experimental-utils';
 import {
   getPropertyIdentifierNode,
   isExpressionStatement,
+  isVariableDeclaration,
+  isAssignmentExpression,
+  isCallExpression,
+  isSequenceExpression,
 } from '../node-utils';
 import { createTestingLibraryRule } from '../create-testing-library-rule';
 
@@ -32,7 +36,11 @@ export default createTestingLibraryRule<Options, MessageIds>({
   defaultOptions: [],
   create: function (context, _, helpers) {
     function isCallerWaitFor(
-      node: TSESTree.BlockStatement | TSESTree.CallExpression
+      node:
+        | TSESTree.BlockStatement
+        | TSESTree.CallExpression
+        | TSESTree.AssignmentExpression
+        | TSESTree.SequenceExpression
     ): boolean {
       if (!node.parent) {
         return false;
@@ -48,22 +56,78 @@ export default createTestingLibraryRule<Options, MessageIds>({
       );
     }
 
+    function isRenderInVariableDeclaration(node: TSESTree.Node) {
+      return (
+        isVariableDeclaration(node) &&
+        node.declarations.some(helpers.isRenderVariableDeclarator)
+      );
+    }
+
+    function isRenderInExpressionStatement(node: TSESTree.Node) {
+      if (
+        !isExpressionStatement(node) ||
+        !isAssignmentExpression(node.expression)
+      ) {
+        return false;
+      }
+
+      const expressionIdentifier = getPropertyIdentifierNode(
+        node.expression.right
+      );
+
+      if (!expressionIdentifier) {
+        return false;
+      }
+
+      return helpers.isRenderUtil(expressionIdentifier);
+    }
+
+    function isRenderInAssignmentExpression(node: TSESTree.Node) {
+      if (!isAssignmentExpression(node)) {
+        return false;
+      }
+
+      const expressionIdentifier = getPropertyIdentifierNode(node.right);
+      if (!expressionIdentifier) {
+        return false;
+      }
+
+      return helpers.isRenderUtil(expressionIdentifier);
+    }
+
+    function isRenderInSequenceAssignment(node: TSESTree.Node) {
+      if (!isSequenceExpression(node)) {
+        return false;
+      }
+
+      return node.expressions.some(isRenderInAssignmentExpression);
+    }
+
     function getSideEffectNodes(
       body: TSESTree.Node[]
     ): TSESTree.ExpressionStatement[] {
       return body.filter((node) => {
-        if (!isExpressionStatement(node)) {
+        if (!isExpressionStatement(node) && !isVariableDeclaration(node)) {
           return false;
         }
 
+        if (
+          isRenderInVariableDeclaration(node) ||
+          isRenderInExpressionStatement(node)
+        ) {
+          return true;
+        }
+
         const expressionIdentifier = getPropertyIdentifierNode(node);
+
         if (!expressionIdentifier) {
           return false;
         }
 
         return (
           helpers.isFireEventUtil(expressionIdentifier) ||
-          helpers.isUserEventUtil(expressionIdentifier)
+          helpers.isUserEventUtil(expressionIdentifier) ||
+          helpers.isRenderUtil(expressionIdentifier)
         );
       }) as TSESTree.ExpressionStatement[];
     }
@@ -81,19 +145,33 @@ export default createTestingLibraryRule<Options, MessageIds>({
       );
     }
 
-    function reportImplicitReturnSideEffect(node: TSESTree.CallExpression) {
+    function reportImplicitReturnSideEffect(
+      node:
+        | TSESTree.CallExpression
+        | TSESTree.AssignmentExpression
+        | TSESTree.SequenceExpression
+    ) {
       if (!isCallerWaitFor(node)) {
         return;
       }
 
-      const expressionIdentifier = getPropertyIdentifierNode(node.callee);
-      if (!expressionIdentifier) {
+      const expressionIdentifier = isCallExpression(node)
+        ? getPropertyIdentifierNode(node.callee)
+        : null;
+
+      if (
+        !expressionIdentifier &&
+        !isRenderInAssignmentExpression(node) &&
+        !isRenderInSequenceAssignment(node)
+      ) {
         return;
       }
 
       if (
+        expressionIdentifier &&
         !helpers.isFireEventUtil(expressionIdentifier) &&
-        !helpers.isUserEventUtil(expressionIdentifier)
+        !helpers.isUserEventUtil(expressionIdentifier) &&
+        !helpers.isRenderUtil(expressionIdentifier)
       ) {
         return;
       }
@@ -107,6 +185,8 @@ export default createTestingLibraryRule<Options, MessageIds>({
     return {
       'CallExpression > ArrowFunctionExpression > BlockStatement': reportSideEffects,
       'CallExpression > ArrowFunctionExpression > CallExpression': reportImplicitReturnSideEffect,
+      'CallExpression > ArrowFunctionExpression > AssignmentExpression': reportImplicitReturnSideEffect,
+      'CallExpression > ArrowFunctionExpression > SequenceExpression': reportImplicitReturnSideEffect,
       'CallExpression > FunctionExpression > BlockStatement': reportSideEffects,
     };
   },