jsx-one-expression-per-line confusion

[lencioni]

I'm finding this documentation to be a little confusing: https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/jsx-one-expression-per-line.md

Specifically, examples in both the invalid and valid sections are actually just invalid JSX. Here's one example from both the invalid and valid sections:

<App>
  </Hello> World
</App>

<App>
  </Hello>
  World
</App>

Should this be <Hello /> instead?

Also, the examples and test cases leave a lot of things out. For instance, what about this code:

<App>Hello</App>

How will this rule treat this code? Or something a little more complex:

<App>{foo} - {bar}</App>

This seems to get autofixed in a way that removes meaningful whitespace, which seems like a bug. I thought about putting up a failing test case for this, but after looking at the documentation for the rule, I'm not really sure I understand the scope and purpose of it.

[ryansully]

For something like

<App>{foo} - {bar}</App>

I'd probably use a template literal to preserve whitespace:

<App>
  {`${foo} - ${bar}`}
</App>

Not exactly an improvement though, and makes the code harder to understand.

In other places I add {' '} if I need whitespace that won't be eaten by React, though that's more of a flaw/feature of React itself than of this ESLint plugin.

[ljharb]

I believe #1848 will cover this.

[ljharb]

Closing in favor of #1848.