Allows slots to ignore surrounding whitespace

[knowler]

Problem

Given this DSD markup, the default content of the slot will never show up because the there is whitespace before and after the <template> element:

<my-element>
  <template shadowrootmode=open>
    <slot>Fallback</slot>
  </template>
</my-element>

In order to get around this one needs to write their markup without any whitespace:

<my-element><template shadowrootmode=open>
  <slot>Fallback</slot>
</template></my-element>

In some cases, some have opted to note this with a comment:

<my-element><!-- no whitepsace 
--><template shadowrootmode=open>
     <slot>Fallback</slot>
   </template><!-- no whitespace 
--></my-element>

While this is an easy fix, it’s not always apparent and in some cases the formatting makes the markup harder to read.

An idea for a solution

An attribute for the <slot> element to indicate that surrounding whitespace should be ignored might be one solution for this:

<my-element>
  <template shadowrootmode=open>
    <slot trimwhitespace>Fallback</slot>
  </template>
</my-element>

(Not a great name, I know.)

This could generally improve the developer experience of writing Web Components, though it still does require knowledge that whitespace is slotted.

I acknowledge that this issue becomes less of a problem once we get declarative custom elements, since authors don’t need to write templates for every instance of those elements.