Skip to content

Commit

Permalink
Add indentation rule for closing tag of multi-line jsx
Browse files Browse the repository at this point in the history
  • Loading branch information
Ross Solomon committed May 20, 2017
1 parent a8d4c9b commit b863f9f
Show file tree
Hide file tree
Showing 3 changed files with 100 additions and 0 deletions.
1 change: 1 addition & 0 deletions index.js
Expand Up @@ -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'),
Expand Down
43 changes: 43 additions & 0 deletions 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.'
});
}
};
}
};
56 changes: 56 additions & 0 deletions 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
}]
});

0 comments on commit b863f9f

Please sign in to comment.