Re: [WICG/webcomponents] Web components should be able to easily adapt to the host page while maintaining enapsulation (Issue #986)

> I suppose one viable solution might be to have slots like the above, and imperatively generate content for the slots if they are empty. I guess this could work but it feels like a hack, and is fairly weird.

This actually touches on a pet peeve (or at least concern) I have, which I wonder if it could be rectified as part of this proposal?

First, even implementing this hack would be problematic without [this issue being finally resolved](https://github.com/WICG/webcomponents/issues/809).  But even if that precondition is resolved, I agree that an element spawning its own light children seems a bit counter to how elements are supposed to behave (where even setting attributes is heavily discouraged).

Now it is possible to provide [default slot content](https://stackoverflow.com/questions/61237010/styling-default-slot-in-webcomponents).  I would have expected this to behave like an optional [JavaScript parameter](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Default_parameters) -- indistinguishable from having it passed in from the outside.  But default slot content doesn't fire the slot changed event, and doesn't automatically inherit the styling one would get if the slot content is provided externally.  It is possible to [style it](https://github.com/WICG/webcomponents/issues/631), but as far as I know we can't specify it to inherit styles from the parent Shadow DOM realm.

I would propose an attribute to make it behave like it was provided externally.

I can't think of a good attribute name for describing what I would have hoped is default behavior, but something like:

```html
<slot name=file-selector id="upload-wrapper" treatdefaultcontentlikeitwaspassedin>
 <input type="file" accept="image/*">
 <button part="button browse-button">Browse…</button>
</slot>
```

This would cause all slotchanged events to fire and assignedNodes to be set without using flatten, and inheriting styles.

Not sure if this would also resolve all use cases @LeaVerou  is thinking of, but maybe some?

-- 
Reply to this email directly or view it on GitHub:
https://github.com/WICG/webcomponents/issues/986#issuecomment-1472856004
You are receiving this because you are subscribed to this thread.

Message ID: <WICG/webcomponents/issues/986/1472856004@github.com>

Received on Thursday, 16 March 2023 22:40:05 UTC