fix: handle require, add tests

alessbell · alessbell · commit 08131945eba4 · 2020-08-07T11:06:54.000-04:00
diff --git a/lib/node-utils.ts b/lib/node-utils.ts
@@ -56,7 +56,7 @@ export function isRenderFunction(
 ) {
   // returns true for `render` and e.g. `customRenderFn`
   // as well as `someLib.render` and `someUtils.customRenderFn`
-  return ['render', ...renderFunctions].some(name => {
+  return renderFunctions.some(name => {
     return (
       (isIdentifier(callNode.callee) && name === callNode.callee.name) ||
       (isMemberExpression(callNode.callee) &&
diff --git a/lib/rules/no-debug.ts b/lib/rules/no-debug.ts
@@ -22,15 +22,15 @@ function isRenderVariableDeclarator(
     if (isAwaitExpression(node.init)) {
       return (
         node.init.argument &&
-        isRenderFunction(
-          node.init.argument as TSESTree.CallExpression,
-          renderFunctions
-        )
+        isRenderFunction(node.init.argument as TSESTree.CallExpression, [
+          'render',
+          ...renderFunctions,
+        ])
       );
     } else {
       return (
         isCallExpression(node.init) &&
-        isRenderFunction(node.init, renderFunctions)
+        isRenderFunction(node.init, ['render', ...renderFunctions])
       );
     }
   }
diff --git a/lib/rules/no-render-in-setup.ts b/lib/rules/no-render-in-setup.ts
@@ -1,9 +1,13 @@
 import { ESLintUtils, TSESTree } from '@typescript-eslint/experimental-utils';
 import { getDocsUrl, TESTING_FRAMEWORK_SETUP_HOOKS } from '../utils';
 import {
+  isLiteral,
+  isProperty,
   isIdentifier,
+  isObjectPattern,
   isCallExpression,
   isRenderFunction,
+  isImportSpecifier,
 } from '../node-utils';
 
 export const RULE_NAME = 'no-render-in-setup';
@@ -69,7 +73,53 @@ export default ESLintUtils.RuleCreator(getDocsUrl)({
   ],
 
   create(context, [{ renderFunctions, allowTestingFrameworkSetupHook }]) {
+    let renderImportedFromTestingLib = false;
+    let wildcardImportName: string | null = null;
+
     return {
+      // checks if import has shape:
+      // import * as dtl from '@testing-library/dom';
+      'ImportDeclaration[source.value=/testing-library/] ImportNamespaceSpecifier'(
+        node: TSESTree.ImportNamespaceSpecifier
+      ) {
+        wildcardImportName = node.local && node.local.name;
+      },
+      // checks if `render` is imported from a '@testing-library/foo'
+      'ImportDeclaration[source.value=/testing-library/]'(
+        node: TSESTree.ImportDeclaration
+      ) {
+        renderImportedFromTestingLib = node.specifiers.some(specifier => {
+          return (
+            isImportSpecifier(specifier) && specifier.local.name === 'render'
+          );
+        });
+      },
+      [`VariableDeclarator > CallExpression > Identifier[name="require"]`](
+        node: TSESTree.Identifier
+      ) {
+        if (!isCallExpression(node.parent)) return;
+        const { arguments: callExpressionArgs } = node.parent;
+        const literalNodeScreenModuleName = callExpressionArgs.find(
+          args =>
+            isLiteral(args) &&
+            typeof args.value === 'string' &&
+            RegExp(/testing-library/, 'g').test(args.value)
+        );
+        if (!literalNodeScreenModuleName) {
+          return;
+        }
+        const declaratorNode = node.parent
+          .parent as TSESTree.VariableDeclarator;
+
+        renderImportedFromTestingLib =
+          isObjectPattern(declaratorNode.id) &&
+          declaratorNode.id.properties.some(
+            property =>
+              isProperty(property) &&
+              isIdentifier(property.key) &&
+              property.key.name === 'render'
+          );
+      },
       CallExpression(node) {
         let testingFrameworkSetupHooksToFilter = TESTING_FRAMEWORK_SETUP_HOOKS;
         if (allowTestingFrameworkSetupHook.length !== 0) {
@@ -81,7 +131,15 @@ export default ESLintUtils.RuleCreator(getDocsUrl)({
           node,
           testingFrameworkSetupHooksToFilter
         );
-        if (isRenderFunction(node, renderFunctions) && beforeHook) {
+        // if `render` is imported from a @testing-library/foo or
+        // imported with a wildcard, add `render` to the list of
+        // disallowed render functions
+        const disallowedRenderFns =
+          renderImportedFromTestingLib || wildcardImportName
+            ? ['render', ...renderFunctions]
+            : renderFunctions;
+
+        if (isRenderFunction(node, disallowedRenderFns) && beforeHook) {
           context.report({
             node,
             messageId: 'noRenderInSetup',
diff --git a/tests/lib/rules/no-render-in-setup.test.ts b/tests/lib/rules/no-render-in-setup.test.ts
@@ -12,6 +12,7 @@ ruleTester.run(RULE_NAME, rule, {
   valid: [
     {
       code: `
+        import { render } from '@testing-library/foo';
         it('Test', () => {
           render(<Component/>)
         })
@@ -20,6 +21,7 @@ ruleTester.run(RULE_NAME, rule, {
     // test config options
     ...TESTING_FRAMEWORK_SETUP_HOOKS.map(setupHook => ({
       code: `
+        import { renderWithRedux } from '../test-utils';
         ${setupHook}(() => {
           renderWithRedux(<Component/>)
         })
@@ -31,19 +33,44 @@ ruleTester.run(RULE_NAME, rule, {
         },
       ],
     })),
-    // // test usage of a non-Testing Library render fn
-    // ...TESTING_FRAMEWORK_SETUP_HOOKS.map(setupHook => ({
-    //   code: `import { render } from 'imNoTestingLibrary';
-
-    //   ${setupHook}(() => {
-    //     render(<Component/>)
-    //   })`,
-    // })),
+    // test usage of a non-Testing Library render fn
+    ...TESTING_FRAMEWORK_SETUP_HOOKS.map(setupHook => ({
+      code: `
+        import { render } from 'imNoTestingLibrary';
+        ${setupHook}(() => {
+          render(<Component/>)
+        })
+      `,
+    })),
+    ...TESTING_FRAMEWORK_SETUP_HOOKS.map(allowedSetupHook => {
+      const [disallowedHook] = TESTING_FRAMEWORK_SETUP_HOOKS.filter(
+        setupHook => setupHook !== allowedSetupHook
+      );
+      return {
+        code: `
+          import utils from 'imNoTestingLibrary';
+          import { renderWithRedux } from '../test-utils';
+          ${allowedSetupHook}(() => {
+            renderWithRedux(<Component/>)
+          })
+          ${disallowedHook}(() => {
+            utils.render(<Component/>)
+          })
+        `,
+        options: [
+          {
+            allowTestingFrameworkSetupHook: allowedSetupHook,
+            renderFunctions: ['renderWithRedux'],
+          },
+        ],
+      };
+    }),
   ],
 
   invalid: [
     ...TESTING_FRAMEWORK_SETUP_HOOKS.map(setupHook => ({
       code: `
+        import { render } from '@testing-library/foo';
         ${setupHook}(() => {
           render(<Component/>)
         })
@@ -56,6 +83,7 @@ ruleTester.run(RULE_NAME, rule, {
     })),
     ...TESTING_FRAMEWORK_SETUP_HOOKS.map(setupHook => ({
       code: `
+        import { render } from '@testing-library/foo';
         ${setupHook}(function() {
           render(<Component/>)
         })
@@ -69,6 +97,7 @@ ruleTester.run(RULE_NAME, rule, {
     // custom render function
     ...TESTING_FRAMEWORK_SETUP_HOOKS.map(setupHook => ({
       code: `
+        import { renderWithRedux } from '../test-utils';
         ${setupHook}(() => {
           renderWithRedux(<Component/>)
         })
@@ -87,6 +116,7 @@ ruleTester.run(RULE_NAME, rule, {
     // call render within a wrapper function
     ...TESTING_FRAMEWORK_SETUP_HOOKS.map(setupHook => ({
       code: `
+      import { render } from '@testing-library/foo';
         ${setupHook}(() => {
           const wrapper = () => {
             render(<Component/>)
@@ -106,10 +136,11 @@ ruleTester.run(RULE_NAME, rule, {
       );
       return {
         code: `
-        ${disallowedHook}(() => {
-          render(<Component/>)
-        })
-      `,
+          import { render } from '@testing-library/foo';
+          ${disallowedHook}(() => {
+            render(<Component/>)
+          })
+        `,
         options: [
           {
             allowTestingFrameworkSetupHook: allowedSetupHook,
@@ -123,46 +154,48 @@ ruleTester.run(RULE_NAME, rule, {
       };
     }),
     ...TESTING_FRAMEWORK_SETUP_HOOKS.map(setupHook => ({
-      code: `import { render } from '@testing-library/foo';
-
-      ${setupHook}(() => {
-        render(<Component/>)
-      })`,
+      code: `
+        import * as testingLibrary from '@testing-library/foo';
+        ${setupHook}(() => {
+          testingLibrary.render(<Component/>)
+        })
+      `,
       errors: [
         {
           messageId: 'noRenderInSetup',
         },
       ],
     })),
     ...TESTING_FRAMEWORK_SETUP_HOOKS.map(setupHook => ({
-      code: `import * as testingLibrary from '@testing-library/foo';
-
-      ${setupHook}(() => {
-        testingLibrary.render(<Component/>)
-      })`,
+      code: `
+        import { render } from 'imNoTestingLibrary';
+        import * as testUtils from '../test-utils';
+        ${setupHook}(() => {
+          testUtils.renderWithRedux(<Component/>)
+        })
+        it('Test', () => {
+          render(<Component/>)
+        })
+      `,
+      options: [
+        {
+          renderFunctions: ['renderWithRedux'],
+        },
+      ],
       errors: [
         {
           messageId: 'noRenderInSetup',
         },
       ],
     })),
     ...TESTING_FRAMEWORK_SETUP_HOOKS.map(setupHook => ({
-      code: `import { render } from 'imNoTestingLibrary';
-      import * as testUtils from '../utils';
-
-      ${setupHook}(() => {
-        testUtils.renderWithRedux(<Component/>)
-      })
+      code: `
+        const { render } = require('@testing-library/foo')
 
-      it('Test', () => {
-        render(<Component/>)
-      })
+        ${setupHook}(() => {
+          render(<Component/>)
+        })
       `,
-      options: [
-        {
-          renderFunctions: ['renderWithRedux'],
-        },
-      ],
       errors: [
         {
           messageId: 'noRenderInSetup',
