-
Notifications
You must be signed in to change notification settings - Fork 264
Add platform-provided mixins explainer #1208
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
Add platform-provided mixins explainer #1208
Conversation
|
|
||
| **Pros:** | ||
| - Familiar JavaScript pattern. | ||
| - Prototype-based composition. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Another pro to this approach is that it allows for child classes to easily extend from mixins. e.g.
class CustomSubmitButton extends HTMLSubmitButtonMixin(HTMLElement) { ... }
class ExtraCustomSubmitButton extends CustomSubmitButton {...}
Is this possible with the current mixin proposal?
|
|
||
| **Cons:** | ||
| - Interoperability issues across browsers. | ||
| - Limited Shadow DOM support. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Maybe rephrase this as "Limited Shadow DOM support - only certain elements can be shadow hosts" and link to https://developer.mozilla.org/en-US/docs/Web/API/Element/attachShadow#elements_you_can_attach_a_shadow_to
|
|
||
| Custom element authors can't access platform behaviors that are built into native HTML elements. This forces them to either: | ||
|
|
||
| 1. Use customized built-ins (`is/extends` syntax), which have Shadow DOM limitations and [can't use the ElementInternals API](https://github.com/whatwg/html/issues/5166). |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
|
|
||
| ### Goals | ||
|
|
||
| - Establish an extensible framework for custom elements to adopt platform behaviors. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
"platform behaviors" is a bit vague, maybe say "platform behaviors for built in elements"
| **Cons:** | ||
| - Doesn't currently address form submission behavior. | ||
| - Scoped to specific attributes rather than general behaviors. | ||
|
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Does it make sense to list "Extend Markup Like Customizable Select"? Or is that too different of a problem? The dealbreaking con with this approach is that it won't work for all types (or any types beyond select?).
https://developer.mozilla.org/en-US/docs/Learn_web_development/Extensions/Forms/Customizable_select
V1 includes:
attachInternals()and avoid dynamic changes at runtime.ElementInternalsto query behaviors.