Bug fix for false positives with no-multi-comp

Previously, when createElement was destructured from React, it would cause any function defined in the file to be flagged as a React Component. This change makes it such that the function must call createElement to be considered a component. Fixes jsx-eslint#1088
benstepp · Feb 23, 2017 · 14a212d · 14a212d
1 parent 8148833
commit 14a212d
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 5 deletions.
diff --git a/lib/util/Components.js b/lib/util/Components.js
@@ -237,14 +237,25 @@ function componentRule(rule, context) {
      * @returns {Boolean} True if React.createElement called
      */
     isReactCreateElement: function(node) {
-      return (
+      var calledOnReact = (
         node &&
         node.callee &&
         node.callee.object &&
         node.callee.object.name === 'React' &&
         node.callee.property &&
         node.callee.property.name === 'createElement'
       );
+
+      var calledDirectly = (
+        node &&
+        node.callee &&
+        node.callee.name === 'createElement'
+      );
+
+      if (this.hasDestructuredReactCreateElement()) {
+        return calledDirectly || calledOnReact;
+      }
+      return calledOnReact;
     },
 
     /**
@@ -290,10 +301,7 @@ function componentRule(rule, context) {
         node[property] &&
         node[property].type === 'JSXElement'
       ;
-      var returnsReactCreateElement =
-        this.hasDestructuredReactCreateElement() ||
-        this.isReactCreateElement(node[property])
-      ;
+      var returnsReactCreateElement = this.isReactCreateElement(node[property]);
 
       return Boolean(
         returnsConditionalJSX ||

diff --git a/tests/lib/rules/no-multi-comp.js b/tests/lib/rules/no-multi-comp.js
@@ -89,6 +89,21 @@ ruleTester.run('no-multi-comp', rule, {
     options: [{
       ignoreStateless: true
     }]
+  }, {
+    // multiple non-components
+    code: [
+      'import React, { createElement } from "react"',
+      'const helperFoo = () => {',
+      '  return true;',
+      '};',
+      'function helperBar() {',
+      '  return false;',
+      '};',
+      'function RealComponent() {',
+      '  return createElement("img");',
+      '};'
+    ].join('\n'),
+    parser: 'babel-eslint'
   }],
 
   invalid: [{