Add indentation rule for closing tag of multi-line jsx

[rsolomon]

For issue #1206:

This rule validates that the closing tag for a multi-line jsx component matches the indentation of the opening tag.

[ljharb]

It'd be great if we could ship this rule such that it's autofixable :-)

[ljharb]

These tests don't need an ecmaVersion specified, nor rest/spread enabled

[rsolomon]

Oops! Will fix.

[rsolomon]

@ljharb I think I've addressed your concerns. The one situation this doesn't fix is the following:

<App
  foo="bar">baz</App>

It will fix it to:

<App
  foo="bar">baz
</App>

When ideally it would be fixed to:

<App
  foo="bar">
  baz
</App>

I opted not to handle it in this rule because I imagine multiline children location should be handled in a separate rule entirely (maybe it already is?)

[ljharb]

I agree with you that it should be handled in a separate rule.

[ljharb]

Looks great! Could we also add some tests for the autofixing?

[rsolomon]

Pardon my ignorance (this is the first eslint rule I've written), but isn't that what the output attributes of the invalid tests are for?

[ljharb]

whoops, you're right :-)

Thanks!

[HHogg]

@rsolomon Would this rule also cover the situation below?

// Considered a warning 
<App>
  { condition && <Component>
    ...
  </Component> }
</App>

// Not considered a warning 
<App>
  { condition && (
    <Component>
      ...
    </Component>    
  ) }
</App>