Add no-render-return-value rule (fixes jsx-eslint#531)

Author: iamdustan

index.js

@@ -14,6 +14,7 @@ module.exports = {
     'no-deprecated': require('./lib/rules/no-deprecated'),
     'no-did-mount-set-state': require('./lib/rules/no-did-mount-set-state'),
     'no-did-update-set-state': require('./lib/rules/no-did-update-set-state'),
+    'no-render-return-value': require('./lib/rules/no-render-return-value'),
     'react-in-jsx-scope': require('./lib/rules/react-in-jsx-scope'),
     'jsx-uses-vars': require('./lib/rules/jsx-uses-vars'),
     'jsx-handler-names': require('./lib/rules/jsx-handler-names'),
@@ -67,6 +68,7 @@ module.exports = {
         'react/no-direct-mutation-state': 2,
         'react/no-is-mounted': 2,
         'react/no-unknown-property': 2,
+        'react/no-render-return-value': 2,
         'react/prop-types': 2,
         'react/react-in-jsx-scope': 2
       }

lib/rules/no-render-return-value.js

@@ -0,0 +1,62 @@
+/**
+ * @fileoverview Prevent usage of the return value of React.render
+ * @author Dustan Kasten
+ */
+'use strict';
+
+var versionUtil = require('../util/version');
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+module.exports = function(context) {
+
+  // --------------------------------------------------------------------------
+  // Public
+  // --------------------------------------------------------------------------
+
+  return {
+
+    CallExpression: function(node) {
+      var callee = node.callee;
+      var parent = node.parent;
+      if (callee.type !== 'MemberExpression') {
+        return;
+      }
+
+      var calleeObjectName = /^ReactDOM$/;
+      if (versionUtil.test(context, '15.0.0')) {
+        calleeObjectName = /^ReactDOM$/;
+      } else if (versionUtil.test(context, '0.14.0')) {
+        calleeObjectName = /^React(DOM)?$/;
+      } else if (versionUtil.test(context, '0.13.0')) {
+        calleeObjectName = /^React$/;
+      }
+
+      if (
+        callee.object.type !== 'Identifier' ||
+        !calleeObjectName.test(callee.object.name) ||
+        callee.property.name !== 'render'
+      ) {
+        return;
+      }
+
+      if (
+        parent.type === 'VariableDeclarator' ||
+        parent.type === 'Property' ||
+        parent.type === 'ReturnStatement' ||
+        parent.type === 'ArrowFunctionExpression'
+      ) {
+        context.report({
+          node: callee,
+          message: 'Do not depend on the return value from ' + callee.object.name + '.render'
+        });
+      }
+    }
+  };
+
+};
+
+module.exports.schema = [];
+

tests/lib/rules/no-render-return-value.js

@@ -0,0 +1,134 @@
+/**
+ * @fileoverview Prevent usage of setState
+ * @author Mark Dalgleish
+ */
+'use strict';
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+var rule = require('../../../lib/rules/no-render-return-value');
+var RuleTester = require('eslint').RuleTester;
+
+var parserOptions = {
+  ecmaVersion: 6,
+  ecmaFeatures: {
+    jsx: true
+  }
+};
+
+// ------------------------------------------------------------------------------
+// Tests
+// ------------------------------------------------------------------------------
+
+var ruleTester = new RuleTester();
+ruleTester.run('no-render-return-value', rule, {
+
+  valid: [{
+    code: [
+      'ReactDOM.render(<div />, document.body);'
+    ].join('\n'),
+    parserOptions: parserOptions
+  }, {
+    code: [
+      'let node;',
+      'ReactDOM.render(<div ref={ref => node = ref}/>, document.body);'
+    ].join('\n'),
+    parserOptions: parserOptions
+  }, {
+    code: 'ReactDOM.render(<div ref={ref => this.node = ref}/>, document.body);',
+    parserOptions: parserOptions,
+    settings: {
+      react: {
+        version: '0.14.0'
+      }
+    }
+  }, {
+    code: 'React.render(<div ref={ref => this.node = ref}/>, document.body);',
+    parserOptions: parserOptions,
+    settings: {
+      react: {
+        version: '0.14.0'
+      }
+    }
+  }, {
+    code: 'React.render(<div ref={ref => this.node = ref}/>, document.body);',
+    parserOptions: parserOptions,
+    settings: {
+      react: {
+        version: '0.13.0'
+      }
+    }
+  }
+  ],
+
+  invalid: [{
+    code: [
+      'var Hello = ReactDOM.render(<div />, document.body);'
+    ].join('\n'),
+    parserOptions: parserOptions,
+    errors: [{
+      message: 'Do not depend on the return value from ReactDOM.render'
+    }]
+  }, {
+    code: [
+      'var o = {',
+      '  inst: ReactDOM.render(<div />, document.body)',
+      '};'
+    ].join('\n'),
+    parserOptions: parserOptions,
+    errors: [{
+      message: 'Do not depend on the return value from ReactDOM.render'
+    }]
+  }, {
+    code: [
+      'function render () {',
+      '  return ReactDOM.render(<div />, document.body)',
+      '}'
+    ].join('\n'),
+    parserOptions: parserOptions,
+    errors: [{
+      message: 'Do not depend on the return value from ReactDOM.render'
+    }]
+  }, {
+    code: 'var render = (a, b) => ReactDOM.render(a, b)',
+    parserOptions: parserOptions,
+    errors: [{
+      message: 'Do not depend on the return value from ReactDOM.render'
+    }]
+  }, {
+    code: 'var inst = React.render(<div />, document.body);',
+    parserOptions: parserOptions,
+    settings: {
+      react: {
+        version: '0.14.0'
+      }
+    },
+    errors: [{
+      message: 'Do not depend on the return value from React.render'
+    }]
+  }, {
+    code: 'var inst = ReactDOM.render(<div />, document.body);',
+    parserOptions: parserOptions,
+    settings: {
+      react: {
+        version: '0.14.0'
+      }
+    },
+    errors: [{
+      message: 'Do not depend on the return value from ReactDOM.render'
+    }]
+  }, {
+    code: 'var inst = React.render(<div />, document.body);',
+    parserOptions: parserOptions,
+    settings: {
+      react: {
+        version: '0.13.0'
+      }
+    },
+    errors: [{
+      message: 'Do not depend on the return value from React.render'
+    }]
+  }]
+});