Eslint-plugin-react: react/jsx-indent not working when using string literal as a child

[dnalborczyk]

eslint 3.19.0, eslint-plugin-react 6.10.3

setting:

rules
  react/jsx-indent: [ error, 2 ]

minimal test using a string literal which causes no error:

(
  <div>
  1
  <div>Car</div>
  </div>
)

expected this to be correct:

(
  <div>
    1
    <div>Car</div>
  </div>
)

though the error is correctly thrown when you are using an expression:

(
  <div>
  {`1`}
  <div>Car</div>
  </div>
)

22:3  error  Expected indentation of 4 space characters but found 2  react/jsx-indent
23:3  error  Expected indentation of 4 space characters but found 2  react/jsx-indent

[noah-potter]

There is a test that enforces this behavior: https://github.com/yannickcr/eslint-plugin-react/blob/d672588cc39334e215ff5993f859f159fc977d57/tests/lib/rules/jsx-indent.js#L198
Is this an actual bug or is there a reason this behavior is desired?

[ljharb]

That test was removed here: https://github.com/yannickcr/eslint-plugin-react/commit/6e5f688065aa218d71742dc4b31929c16ab1078d#diff-93c6a0eb3f976d39af0b0a8843ddba24L215

and then restored here: https://github.com/yannickcr/eslint-plugin-react/commit/e9fb52d332e15686865952371c333b19af13eede#diff-93c6a0eb3f976d39af0b0a8843ddba24R215

Intentional or not, this feels like a flaw in the rule - literals should have their indentation enforced just like anything else.

[noah-potter]

@ljharb Great. I'll look into fixing this

[march08]

hey guys, has this been resolved?

[ljharb]

It's still open, so I don't think so.

[alexzherdev]

According to discussion in https://github.com/yannickcr/eslint-plugin-react/issues/1662#issuecomment-360964138 this can get tricky with elements like pre. Looks like these two are duplicates.

[damianobarbati]

Any solution for this?