Merge pull request #483 from shioju/autofix-jsx-indent-props

Add auto fix for jsx-indent-props

Author: yannickcr

README.md

@@ -102,7 +102,7 @@ The plugin has a [recommended configuration](#user-content-recommended-configura
 * [jsx-curly-spacing](docs/rules/jsx-curly-spacing.md): Enforce or disallow spaces inside of curly braces in JSX attributes (fixable)
 * [jsx-equals-spacing](docs/rules/jsx-equals-spacing.md): Enforce or disallow spaces around equal signs in JSX attributes
 * [jsx-handler-names](docs/rules/jsx-handler-names.md): Enforce event handler naming conventions in JSX
-* [jsx-indent-props](docs/rules/jsx-indent-props.md): Validate props indentation in JSX
+* [jsx-indent-props](docs/rules/jsx-indent-props.md): Validate props indentation in JSX (fixable)
 * [jsx-indent](docs/rules/jsx-indent.md): Validate JSX indentation
 * [jsx-key](docs/rules/jsx-key.md): Validate JSX has key prop when in array or iterator
 * [jsx-max-props-per-line](docs/rules/jsx-max-props-per-line.md): Limit maximum of props on a single line in JSX

docs/rules/jsx-indent-props.md

@@ -2,6 +2,8 @@
 
 This option validates a specific indentation style for props.
 
+**Fixable:** This rule is automatically fixable using the `--fix` flag on the command line.
+
 ## Rule Details
 
 This rule is aimed to enforce consistent indentation style. The default style is `4 spaces`.

lib/rules/jsx-indent-props.js

@@ -78,7 +78,11 @@ module.exports = function(context) {
       context.report({
         node: node,
         message: MESSAGE,
-        data: msgContext
+        data: msgContext,
+        fix: function(fixer) {
+          return fixer.replaceTextRange([node.start - node.loc.start.column, node.start],
+            Array(needed + 1).join(indentType === 'space' ? ' ' : '\t'));
+        }
       });
     }
   }

tests/lib/rules/jsx-indent-props.js

@@ -70,6 +70,11 @@ ruleTester.run('jsx-indent-props', rule, {
       '  foo',
       '/>'
     ].join('\n'),
+    output: [
+      '<App',
+      '    foo',
+      '/>'
+    ].join('\n'),
     parserOptions: parserOptions,
     errors: [{message: 'Expected indentation of 4 space characters but found 2.'}]
   }, {
@@ -78,6 +83,11 @@ ruleTester.run('jsx-indent-props', rule, {
       '    foo',
       '/>'
     ].join('\n'),
+    output: [
+      '<App',
+      '  foo',
+      '/>'
+    ].join('\n'),
     options: [2],
     parserOptions: parserOptions,
     errors: [{message: 'Expected indentation of 2 space characters but found 4.'}]
@@ -87,8 +97,27 @@ ruleTester.run('jsx-indent-props', rule, {
       '    foo',
       '/>'
     ].join('\n'),
+    output: [
+      '<App',
+      '\tfoo',
+      '/>'
+    ].join('\n'),
     options: ['tab'],
     parserOptions: parserOptions,
     errors: [{message: 'Expected indentation of 1 tab character but found 0.'}]
+  }, {
+    code: [
+      '<App',
+      '\t\t\tfoo',
+      '/>'
+    ].join('\n'),
+    output: [
+      '<App',
+      '\tfoo',
+      '/>'
+    ].join('\n'),
+    options: ['tab'],
+    parserOptions: parserOptions,
+    errors: [{message: 'Expected indentation of 1 tab character but found 3.'}]
   }]
 });