Fix jsx-indent for arrays in jsx (fixes #947)

Author: Yannick Croissant

lib/rules/jsx-indent.js

@@ -226,13 +226,16 @@ module.exports = {
         }
         // Use the parent in a list or an array
         if (prevToken.type === 'JSXText' || prevToken.type === 'Punctuator' && prevToken.value === ',') {
-          prevToken = sourceCode.getNodeByRangeIndex(prevToken.start).parent;
+          prevToken = sourceCode.getNodeByRangeIndex(prevToken.start);
+          prevToken = prevToken.type === 'Literal' ? prevToken.parent : prevToken;
         // Use the first non-punctuator token in a conditional expression
         } else if (prevToken.type === 'Punctuator' && prevToken.value === ':') {
           do {
             prevToken = sourceCode.getTokenBefore(prevToken);
           } while (prevToken.type === 'Punctuator');
         }
+        prevToken = prevToken.type === 'JSXExpressionContainer' ? prevToken.expression : prevToken;
+
         var parentElementIndent = getNodeIndent(prevToken);
         var indent = (
           prevToken.loc.start.line === node.loc.start.line ||

tests/lib/rules/jsx-indent.js

@@ -187,6 +187,30 @@ ruleTester.run('jsx-indent', rule, {
     ].join('\n'),
     parserOptions: parserOptions,
     options: [2]
+  }, {
+    code: [
+      '<div>',
+      '    {',
+      '        [',
+      '            <Foo />,',
+      '            <Bar />',
+      '        ]',
+      '    }',
+      '</div>'
+    ].join('\n'),
+    parserOptions: parserOptions
+  }, {
+    code: [
+      '<div>',
+      '    {foo &&',
+      '        [',
+      '            <Foo />,',
+      '            <Bar />',
+      '        ]',
+      '    }',
+      '</div>'
+    ].join('\n'),
+    parserOptions: parserOptions
   }, {
     // Literals indentation is not touched
     code: [
@@ -626,6 +650,56 @@ ruleTester.run('jsx-indent', rule, {
     errors: [
       {message: 'Expected indentation of 2 space characters but found 0.'}
     ]
+  }, {
+    code: [
+      '<div>',
+      '    {',
+      '        [',
+      '            <Foo />,',
+      '        <Bar />',
+      '        ]',
+      '    }',
+      '</div>'
+    ].join('\n'),
+    output: [
+      '<div>',
+      '    {',
+      '        [',
+      '            <Foo />,',
+      '            <Bar />',
+      '        ]',
+      '    }',
+      '</div>'
+    ].join('\n'),
+    parserOptions: parserOptions,
+    errors: [
+      {message: 'Expected indentation of 12 space characters but found 8.'}
+    ]
+  }, {
+    code: [
+      '<div>',
+      '    {foo &&',
+      '        [',
+      '            <Foo />,',
+      '        <Bar />',
+      '        ]',
+      '    }',
+      '</div>'
+    ].join('\n'),
+    output: [
+      '<div>',
+      '    {foo &&',
+      '        [',
+      '            <Foo />,',
+      '            <Bar />',
+      '        ]',
+      '    }',
+      '</div>'
+    ].join('\n'),
+    parserOptions: parserOptions,
+    errors: [
+      {message: 'Expected indentation of 12 space characters but found 8.'}
+    ]
   }, {
     // Multiline ternary
     // (colon at the end of the first expression)