-
-
Notifications
You must be signed in to change notification settings - Fork 4.3k
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
feat: Allow use of ElementInternals with Web Components #8473
feat: Allow use of ElementInternals with Web Components #8473
Conversation
@tronicboy1 is attempting to deploy a commit to the Svelte Team on Vercel. A member of the Team first needs to authorize it. |
Thank you! I'm wondering if #4534 is a more general solution to this, implementing the |
Thanks for the reply and review! If my understanding is correct, If that is the case then unfortunately we could not use that as a solution. The reason why is that accessing an instance would be after the constructor ( The static property for ElementInternals needs to be set before being registered with |
The static property yes, but not |
@dummdidumm Are you suggesting that we drop the helper function in this or and just have users do something like |
Yes that's my thinking - though I wouldn't want you to change this now. The whole web component story is in the middle of a rework now, and |
@dummdidumm I am really happy that we may be able to include this in version 4!! 🥰 Let me know if there is anything I can help with. |
This should help everyone who has special needs and use cases around custom elements. Since Svelte components are wrapped and only run on connectedCallback, it makes sense to expose the custom element class for modification before that. - fixes #8954 - use extend to attach the function manually and save possible values to a prop - closes #8473 / closes #4168 - use extend to set the proper static attribute and then call attachInternals in the constructor closes #8472 - use extend to attach anything custom you need closes #3091 - pass `this` to a prop of your choice and use it inside your component
This should help everyone who has special needs and use cases around custom elements. Since Svelte components are wrapped and only run on connectedCallback, it makes sense to expose the custom element class for modification before that. - fixes #8954 / closes #8955 - use extend to attach the function manually and save possible values to a prop - closes #8473 / closes #4168 - use extend to set the proper static attribute and then call attachInternals in the constructor - closes #8472 - use extend to attach anything custom you need - closes #3091 - pass `this` to a prop of your choice and use it inside your component - add some doc for #8987
First time contributing! Please excuse me if I'm doing something wrong.
Problem
You cannot add ElementInternals to a Svelte Web Component because we cannot add the static property
formAssociated
in the constructor.Solution
I added an option to the
<svelte:options>
tag to add the formAssociated property to a Web Component's construction.I also added a function to attach the internals to the component and then return them for use.
Before submitting the PR, please make sure you do the following
feat:
,fix:
,chore:
, ordocs:
.Tests
npm test
and lint the project withnpm run lint