Fix ES5 components detection from nested functions (fixes #287)

Author: yannickcr

lib/util/Components.js

@@ -179,11 +179,14 @@ function componentRule(rule, context) {
      */
     getParentES5Component: function() {
       var scope = context.getScope();
-      var node = scope.block && scope.block.parent && scope.block.parent.parent;
-      if (!node || !context.react.isES5Component(node)) {
-        return null;
+      while (scope) {
+        var node = scope.block && scope.block.parent && scope.block.parent.parent;
+        if (node && context.react.isES5Component(node)) {
+          return node;
+        }
+        scope = scope.upper;
       }
-      return node;
+      return null;
     },
 
     /**

tests/lib/rules/no-multi-comp.js

@@ -11,6 +11,8 @@
 var rule = require('../../../lib/rules/no-multi-comp');
 var RuleTester = require('eslint').RuleTester;
 
+require('babel-eslint');
+
 // ------------------------------------------------------------------------------
 // Tests
 // ------------------------------------------------------------------------------
@@ -42,6 +44,24 @@ ruleTester.run('no-multi-comp', rule, {
       classes: true,
       jsx: true
     }
+  }, {
+    code: [
+      'var Heading = React.createClass({',
+      '  render: function() {',
+      '    return (',
+      '      <div>',
+      '        {this.props.buttons.map(function(button, index) {',
+      '          return <Button {...button} key={index}/>;',
+      '        })}',
+      '      </div>',
+      '    );',
+      '  }',
+      '});'
+    ].join('\r'),
+    ecmaFeatures: {
+      classes: true,
+      jsx: true
+    }
   }],
 
   invalid: [{