Eslint-plugin-react: Incorrect indent error in multiline array expression

Created on 11 Oct 2016  Â·  7Comments  Â·  Source: yannickcr/eslint-plugin-react

After upgrade to 6.4.1 following code causes indent error:

const myFunction = () => (
  [
    <Tag
      {...properties}
    />,
    <Tag
      {...properties}
    />,
    <Tag
      {...properties}
    />,
  ]
)

error:

6:5   error  Expected indentation of 2 space characters but found 4    react/jsx-indent 
9:5   error  Expected indentation of 2 space characters but found 4    react/jsx-indent 

E.g. the error refers to second and third instance of the tag Tag in array.

Another case with the same problem:

              {condition && [
                  <Tag key="a" onClick={() => {
                    // some code
                  }} />,
                  <Tag key="b" onClick={() => {
                    // some code
                  }} />,
                ]
              }

error:

5:19  error  Expected indentation of 16 space characters but found 18  react/jsx-indent

E.g. the error refers to second instance of the tag Tag in array.

bug

All 7 comments

The first case is a bug, but the second is correct - the line the starting [ is on determines the indentation for the rest. In other words, it wants:

              {condition && [
                <Tag key="a" onClick={() => {
                  // some code
                }} />,
                <Tag key="b" onClick={() => {
                  // some code
                }} />,
              ]}

@ljharb In that case, I would expect two errors - one for line 2 and one for line 5. At least, when I donwgrade to 6.3.0 and intentionally indent it wrong, I get one error for each wrongly indented tag.

Yes, good point - it is warning, but not in the right places.

I confirm.
2016-10-12 11-14-12

@bigslycat on 6.4.1?

@ljharb oh, sry. =) I check it now — on 6.4.1 it was fixed.

I'm on version 7.5.1 and this is still an issue.

Was this page helpful?
0 / 5 - 0 ratings