Fix stateless components detection when conditionally returning JSX (fixes #486)

Author: yannickcr

lib/util/Components.js

@@ -165,7 +165,7 @@ function componentRule(rule, context) {
     /**
      * Check if the node is returning JSX
      *
-     * @param {ASTNode} node The AST node being checked (must be a ReturnStatement).
+     * @param {ASTNode} node The AST node being checked (can be a ReturnStatement or an ArrowFunctionExpression).
      * @returns {Boolean} True if the node is returning JSX, false if not
      */
     isReturningJSX: function(node) {
@@ -181,6 +181,16 @@ function componentRule(rule, context) {
           return false;
       }
 
+      var returnsConditionalJSXConsequent =
+        node[property] &&
+        node[property].type === 'ConditionalExpression' &&
+        node[property].consequent.type === 'JSXElement'
+      ;
+      var returnsConditionalJSXAlternate =
+        node[property] &&
+        node[property].type === 'ConditionalExpression' &&
+        node[property].alternate.type === 'JSXElement'
+      ;
       var returnsJSX =
         node[property] &&
         node[property].type === 'JSXElement'
@@ -192,7 +202,12 @@ function componentRule(rule, context) {
         node[property].callee.property.name === 'createElement'
       ;
 
-      return Boolean(returnsJSX || returnsReactCreateElement);
+      return Boolean(
+        returnsConditionalJSXConsequent ||
+        returnsConditionalJSXAlternate ||
+        returnsJSX ||
+        returnsReactCreateElement
+      );
     },
 
     /**

tests/lib/rules/prop-types.js

@@ -1998,6 +1998,14 @@ ruleTester.run('prop-types', rule, {
       errors: [{
         message: '\'toggle\' is missing in props validation'
       }]
+    }, {
+      code: [
+        'const MyComponent = props => props.test ? <div /> : <span />'
+      ].join('\n'),
+      parserOptions: parserOptions,
+      errors: [{
+        message: '\'test\' is missing in props validation'
+      }]
     }
   ]
 });