Add indentation rule for closing tag of multi-line jsx

Author: Ross Solomon

index.js

@@ -41,6 +41,7 @@ var allRules = {
   'jsx-indent-props': require('./lib/rules/jsx-indent-props'),
   'jsx-indent': require('./lib/rules/jsx-indent'),
   'jsx-closing-bracket-location': require('./lib/rules/jsx-closing-bracket-location'),
+  'jsx-closing-tag-location': require('./lib/rules/jsx-closing-tag-location'),
   'jsx-space-before-closing': require('./lib/rules/jsx-space-before-closing'),
   'no-direct-mutation-state': require('./lib/rules/no-direct-mutation-state'),
   'forbid-component-props': require('./lib/rules/forbid-component-props'),

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

@@ -0,0 +1,43 @@
+/**
+ * @fileoverview Validate closing tag location in JSX
+ * @author Ross Solomon
+ */
+'use strict';
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+module.exports = {
+  meta: {
+    docs: {
+      description: 'Validate closing tag location in JSX',
+      category: 'Stylistic Issues',
+      recommended: false
+    }
+  },
+
+  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;
+        }
+
+        if (opening.loc.start.column === node.loc.start.column) {
+          return;
+        }
+
+        context.report({
+          node: node,
+          loc: node.loc,
+          message: 'Expected closing tag to match indentation of opening.'
+        });
+      }
+    };
+  }
+};

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

@@ -0,0 +1,56 @@
+/**
+ * @fileoverview Validate closing tag location in JSX
+ * @author Ross Solomon
+ */
+'use strict';
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const rule = require('../../../lib/rules/jsx-closing-tag-location');
+const {RuleTester} = require('eslint');
+const parserOptions = {
+  ecmaVersion: 8,
+  sourceType: 'module',
+  ecmaFeatures: {
+    experimentalObjectRestSpread: true,
+    jsx: true
+  }
+};
+
+const MESSAGE_MATCH_INDENTATION = [{message: 'Expected closing tag to match indentation of opening.'}];
+
+// ------------------------------------------------------------------------------
+// Tests
+// ------------------------------------------------------------------------------
+
+const ruleTester = new RuleTester({parserOptions});
+ruleTester.run('jsx-closing-tag-location', rule, {
+  valid: [{
+    code: [
+      '<App>',
+      '  foo',
+      '</App>'
+    ].join('\n')
+  }, {
+    code: [
+      '<App>foo</App>'
+    ].join('\n')
+  }],
+
+  invalid: [{
+    code: [
+      '<App>',
+      '  foo',
+      '  </App>'
+    ].join('\n'),
+    errors: MESSAGE_MATCH_INDENTATION
+  }, {
+    code: [
+      '<App>',
+      '  foo</App>'
+    ].join('\n'),
+    errors: MESSAGE_MATCH_INDENTATION
+  }]
+});