[Fix] jsx-curly-brace-presence: ignore containers with comments

Fixes #2885
jsx-eslint · Jan 13, 2021 · f0e29f9 · f0e29f9
1 parent f34ee91
commit f0e29f9
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 0 deletions.
diff --git a/docs/rules/jsx-curly-brace-presence.md b/docs/rules/jsx-curly-brace-presence.md
@@ -151,6 +151,7 @@ Examples of **correct** code for this rule, even when configured with `"never"`:
  */
 <App>{' '}</App>
 <App>{'     '}</App>
+<App>{/* comment */ <Bpp />}</App> // the comment makes the container necessary 
 ```
 
 ## When Not To Use It

diff --git a/lib/rules/jsx-curly-brace-presence.js b/lib/rules/jsx-curly-brace-presence.js
@@ -235,6 +235,11 @@ module.exports = {
       const expression = JSXExpressionNode.expression;
       const expressionType = expression.type;
 
+      // Curly braces containing comments are necessary
+      if (context.getSourceCode().getCommentsInside(JSXExpressionNode).length > 0) {
+        return;
+      }
+
       if (
         (expressionType === 'Literal' || expressionType === 'JSXText')
           && typeof expression.value === 'string'

diff --git a/tests/lib/rules/jsx-curly-brace-presence.js b/tests/lib/rules/jsx-curly-brace-presence.js
@@ -417,6 +417,28 @@ ruleTester.run('jsx-curly-brace-presence', rule, {
         };
       `,
       options: [{props: 'never', children: 'never'}]
+    },
+    {
+      code: `<App>{/* comment */}</App>`
+    },
+    {
+      code: `<App>{/* comment */ <Foo />}</App>`
+    },
+    {
+      code: `<App>{/* comment */ 'foo'}</App>`
+    },
+    {
+      code: `<App prop={/* comment */ 'foo'} />`
+    },
+    {
+      code: `
+        <App>
+          {
+            // comment
+            <Foo />
+          }
+        </App>
+      `
     }
   ],