jsx-closing-tag-location: support shorthand fragments

Author: alexzherdev

lib/rules/jsx-closing-tag-location.js

@@ -22,45 +22,48 @@ module.exports = {
   },
 
   create: function(context) {
-    return {
-      JSXClosingElement: function(node) {
-        if (!node.parent) {
-          return;
-        }
-
-        const opening = node.parent.openingElement;
-        if (opening.loc.start.line === node.loc.start.line) {
-          return;
-        }
+    function handleClosingElement(node) {
+      if (!node.parent) {
+        return;
+      }
 
-        if (opening.loc.start.column === node.loc.start.column) {
-          return;
-        }
+      const opening = node.parent.openingElement || node.parent.openingFragment;
+      if (opening.loc.start.line === node.loc.start.line) {
+        return;
+      }
 
-        let message;
-        if (!astUtil.isNodeFirstInLine(context, node)) {
-          message = 'Closing tag of a multiline JSX expression must be on its own line.';
-        } else {
-          message = 'Expected closing tag to match indentation of opening.';
-        }
+      if (opening.loc.start.column === node.loc.start.column) {
+        return;
+      }
 
-        context.report({
-          node: node,
-          loc: node.loc,
-          message,
-          fix: function(fixer) {
-            const indent = Array(opening.loc.start.column + 1).join(' ');
-            if (astUtil.isNodeFirstInLine(context, node)) {
-              return fixer.replaceTextRange(
-                [node.range[0] - node.loc.start.column, node.range[0]],
-                indent
-              );
-            }
+      let message;
+      if (!astUtil.isNodeFirstInLine(context, node)) {
+        message = 'Closing tag of a multiline JSX expression must be on its own line.';
+      } else {
+        message = 'Expected closing tag to match indentation of opening.';
+      }
 
-            return fixer.insertTextBefore(node, `\n${indent}`);
+      context.report({
+        node: node,
+        loc: node.loc,
+        message,
+        fix: function(fixer) {
+          const indent = Array(opening.loc.start.column + 1).join(' ');
+          if (astUtil.isNodeFirstInLine(context, node)) {
+            return fixer.replaceTextRange(
+              [node.range[0] - node.loc.start.column, node.range[0]],
+              indent
+            );
           }
-        });
-      }
+
+          return fixer.insertTextBefore(node, `\n${indent}`);
+        }
+      });
+    }
+
+    return {
+      JSXClosingElement: handleClosingElement,
+      JSXClosingFragment: handleClosingElement
     };
   }
 };

tests/lib/rules/jsx-closing-tag-location.js

@@ -36,6 +36,18 @@ ruleTester.run('jsx-closing-tag-location', rule, {
     code: `
       <App>foo</App>
     `
+  }, {
+    code: `
+      <>
+        foo
+      </>
+    `,
+    parser: 'babel-eslint'
+  }, {
+    code: `
+      <>foo</>
+    `,
+    parser: 'babel-eslint'
   }],
 
   invalid: [{
@@ -61,5 +73,30 @@ ruleTester.run('jsx-closing-tag-location', rule, {
       </App>
     `,
     errors: MESSAGE_OWN_LINE
+  }, {
+    code: `
+      <>
+        foo
+        </>
+    `,
+    parser: 'babel-eslint',
+    output: `
+      <>
+        foo
+      </>
+    `,
+    errors: MESSAGE_MATCH_INDENTATION
+  }, {
+    code: `
+      <>
+        foo</>
+    `,
+    parser: 'babel-eslint',
+    output: `
+      <>
+        foo
+      </>
+    `,
+    errors: MESSAGE_OWN_LINE
   }]
 });