feat: add svelte/html-self-closing

[marekvospel]

Moved to separate PR from #186

svelte/html-self-closing

A simple rule which automatically closes html tags.

<div></div>
<!-- gets fixed to -->
<div>

vue/html-self-closing also supports custom setting for svg and math elements, which I couldn't simply extract from Svelte AST, so I didn't include it. It can be simply added by checking whether element name is known svg / math element (just like it's done with void elements)

Coverage

100% test coverage.

Issues

svelte:self</svelte:self> seems to be affected by the normal option, but I think they need to share the component option or have different option.

is yet to be resolved
solved

[JounQin]

Sorry, I accidentally changed the review status. 😅

[ota-meshi]

LGTM! Thank you!

[JounQin]

This makes the template less html compliant, div is not self-closing in HTML, we should have three options: 'all' | 'html-compliant' | 'none', and 'html-compliant' should be default IMO.

Of course the options naming can be better.

[ota-meshi]

div is not self-closing in HTML
'html-compliant' should be default IMO.

I think we should make the default of prettier-plugin-svelte the default behavior rather than the HTML standard. So I think all should be the default.
prettier-plugin-svelte has long been the default style for the community.
Turn off these rules when users use plugins with prettier-plugin-svelte, but I think it makes sense to adopt the same style as prettier-plugin-svelte by default.

[ota-meshi]

we should have three options: 'all' | 'html-compliant' | 'none'

I think the current options can already do the same. Why do you think we need three options?

{
  "svelte/html-self-closing": [
    "error",
    {
      "void": "always", // or "always" or "ignore"
      "normal": "always", // or "never" or "ignore"
      "component": "always", // or "never" or "ignore"
      "svelte": "always" // or "never" or "ignore"
    }
  ]
}

• void ("always" by default)... Style of HTML void elements
• component ("always" by default)... Style of svelte components
• svelte ("always" by default)... Style of svelte special elements (<svelte:head>, <svelte:self>)
• normal ("always" by default)... Style of other elements

Every option can be set to

• "always" (<div />)
• "never" (<div></div>)
• "ignore" (either <div /> or <div></div>)

[JounQin]

@ota-meshi See also sveltejs/prettier-plugin-svelte#284

[ota-meshi]

Oh. I didn't know that.
Hmm. The maintainers don't seem to be involved in the discussion, so I'm still not sure if they're thinking of doing so by default.

[JounQin]

The linked option is not related to tag closing, it's related to whitespace and prettier-plugin-svelte already adheres to that option.

I know, I'm just saying we can have such single option, maybe.

[marekvospel]

I know, I'm just saying we can have such single option, maybe.

That's a good idea, but I'd also keep the current configuration in overrides section, because there could be someone who only wants self closing on tags in specific category, and it would be waste to just throw away the option to set that.

[ota-meshi]

@marekvospel Do you currently have time to work on this PR?

I think the new single option is that we can add features later, so if you don't have time now, after merging this PR, we can work on a new PR when you/we have time.

[marekvospel]

@ota-meshi no, I'll have time in 2 weeks or later. I'll create a new PR when I have time

[ota-meshi]

Okay! I will merge this PR. Thank you for the great job!