[FEATURE] A rule to forbid empty content in tags

[jpradelle]

Is your feature request related to a problem? Please describe.
With web components you can define a tag and define content in a slot, with default content in slot. If you put empty content in slot (spaces or line return) when using your component, you will override default slot content with this empty content, which is usually unwanted.
Here is an interactive sample: link

Additional context
I think it would be great to have a rule that forbids any empty content in tags. (Forbid to have only spaces or line returns as content)

HTML comments can be allowed if not surrounded by spaces like that

  <sample-component><!-- ok
  --></sample-component>

But this will break default slot (edge case ...)

  <sample-component>
    <!-- not ok  -->
  </sample-component>

In lit inside template sting, this syntax should be allowed by the rule

  <sample-component>
    ${/* any JS code */}
  </sample-component>

I think, as soon as there is something else that a comment inside tag then this is OK to have spaces or line return.
And maybe to simplify even if content is only HTML comment this could be OK to have spaces around, this is a very edge case.

Thanks.

[yeonjuan]

Hi @jpradelle Thanks for the suggestion! . It would be nice to be able to specify particular tags (or entire custom elements) using the regex option.

[jpradelle]

With a regex you can catch all web components with ".-." as specification says they must contain a dash in the name, so it does the job.

I think for regular tags I would use self-closing tags (which is not allowed for web-components 😢), but for consistency in case not using self-closing, I think I would apply this rule too. But that's more a personal choice, regex option is a nice way to configure it.