From a77c0d10d36dec966155074816fac4bb161f1681 Mon Sep 17 00:00:00 2001
From: hasparus <hasparus@gmail.com>
Date: Thu, 6 Aug 2020 19:57:09 +0200
Subject: [PATCH] [Fix] `jsx-no-useless-fragment`: accept fragments with call
 expressions

---
 lib/rules/jsx-no-useless-fragment.js       | 26 +++++++++++++++++-----
 tests/lib/rules/jsx-no-useless-fragment.js | 10 +++++++++
 2 files changed, 30 insertions(+), 6 deletions(-)

diff --git a/lib/rules/jsx-no-useless-fragment.js b/lib/rules/jsx-no-useless-fragment.js
index b1309e2347..52c920cbe3 100644
--- a/lib/rules/jsx-no-useless-fragment.js
+++ b/lib/rules/jsx-no-useless-fragment.js
@@ -66,6 +66,17 @@ function isKeyedElement(node) {
     && node.openingElement.attributes.some(jsxUtil.isJSXAttributeKey);
 }
 
+/**
+ * @param {ASTNode} node
+ * @returns {boolean}
+ */
+function containsCallExpression(node) {
+  return node
+    && node.type === 'JSXExpressionContainer'
+    && node.expression
+    && node.expression.type === 'CallExpression';
+}
+
 module.exports = {
   meta: {
     type: 'suggestion',
@@ -103,15 +114,18 @@ module.exports = {
      * @returns {boolean}
      */
     function hasLessThanTwoChildren(node) {
-      if (!node || !node.children || node.children.length < 2) {
+      if (!node || !node.children) {
         return true;
       }
 
-      return (
-        node.children.length
-        - (+isPaddingSpaces(node.children[0]))
-        - (+isPaddingSpaces(node.children[node.children.length - 1]))
-      ) < 2;
+      /** @type {ASTNode[]} */
+      const nonPaddingChildren = node.children.filter(
+        (child) => !isPaddingSpaces(child)
+      );
+
+      if (nonPaddingChildren.length < 2) {
+        return !containsCallExpression(nonPaddingChildren[0]);
+      }
     }
 
     /**
diff --git a/tests/lib/rules/jsx-no-useless-fragment.js b/tests/lib/rules/jsx-no-useless-fragment.js
index 9d6337cd7f..ca44b4f30a 100644
--- a/tests/lib/rules/jsx-no-useless-fragment.js
+++ b/tests/lib/rules/jsx-no-useless-fragment.js
@@ -63,6 +63,10 @@ ruleTester.run('jsx-no-useless-fragment', rule, {
     {
       code: '<Fooo content={<>eeee ee eeeeeee eeeeeeee</>} />',
       parser: parsers.BABEL_ESLINT
+    },
+    {
+      code: '<>{foos.map(foo => foo)}</>',
+      parser: parsers.BABEL_ESLINT
     }
   ],
   invalid: [
@@ -72,6 +76,12 @@ ruleTester.run('jsx-no-useless-fragment', rule, {
       errors: [{messageId: 'NeedsMoreChidren', type: 'JSXFragment'}],
       parser: parsers.BABEL_ESLINT
     },
+    {
+      code: '<>{}</>',
+      output: null,
+      errors: [{messageId: 'NeedsMoreChidren', type: 'JSXFragment'}],
+      parser: parsers.BABEL_ESLINT
+    },
     {
       code: '<p>moo<>foo</></p>',
       output: '<p>moofoo</p>',