[Fix] Detect JSX returned by sequential expression

Resolves #2800. Implements `isReturnsSequentialJSX()` and uses it in `isReturningJSX()` (in conjunction with `isReturnsConditionalJSX()` and `isReturnsLogicalJSX()`).
jsx-eslint · Sep 20, 2020 · dec2975 · dec2975
1 parent 153eac8
commit dec2975
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 0 deletions.
diff --git a/lib/util/Components.js b/lib/util/Components.js
@@ -71,6 +71,12 @@ function isReturnsLogicalJSX(node, property, strict) {
     : (returnsLogicalJSXLeft || returnsLogicalJSXRight);
 }
 
+function isReturnsSequentialJSX(node, property) {
+  return node[property]
+    && node[property].type === 'SequenceExpression'
+    && jsxUtil.isJSX(node[property].expressions[node[property].expressions.length - 1]);
+}
+
 const Lists = new WeakMap();
 
 /**
@@ -457,13 +463,15 @@ function componentRule(rule, context) {
 
       const returnsConditionalJSX = isReturnsConditionalJSX(node, property, strict);
       const returnsLogicalJSX = isReturnsLogicalJSX(node, property, strict);
+      const returnsSequentialJSX = isReturnsSequentialJSX(node, property);
 
       const returnsJSX = node[property] && jsxUtil.isJSX(node[property]);
       const returnsPragmaCreateElement = this.isCreateElement(node[property]);
 
       return !!(
         returnsConditionalJSX
         || returnsLogicalJSX
+        || returnsSequentialJSX
         || returnsJSX
         || returnsPragmaCreateElement
       );

diff --git a/tests/lib/rules/prop-types.js b/tests/lib/rules/prop-types.js
@@ -2501,6 +2501,20 @@ ruleTester.run('prop-types', rule, {
       export default function() {}
       `
     },
+    {
+      code: `
+        function Component(props) {
+          return 0,
+          <div>
+            Hello, { props.name }!
+          </div>
+        }
+
+        Component.propTypes = {
+          name: PropTypes.string.isRequired
+        }
+      `
+    },
     parsers.TS([
       {
         code: `
@@ -5591,6 +5605,19 @@ ruleTester.run('prop-types', rule, {
         message: '\'foo.baz\' is missing in props validation'
       }]
     },
+    {
+      code: `
+        function Component(props) {
+          return 0,
+          <div>
+            Hello, { props.name }!
+          </div>
+        }
+      `,
+      errors: [{
+        message: '\'name\' is missing in props validation'
+      }]
+    },
     parsers.TS([
       {
         code: `