-
-
Notifications
You must be signed in to change notification settings - Fork 1.7k
refactor: Upgrade to vue 3's native web component support #11475
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: master
Are you sure you want to change the base?
refactor: Upgrade to vue 3's native web component support #11475
Conversation
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.
Pull Request Overview
This PR refactors the web component creation logic to use Vue 3's native defineCustomElement API, replacing the third-party vue-web-component-wrapper dependency. This change enables better Vue 3 support, including the composition API and compatibility with third-party Vue 3 components.
Key changes:
- Replaced
vue-web-component-wrapperwith Vue 3's built-indefineCustomElement - Migrated plugin configuration to use the native
configureAppcallback - Added custom element registration guard to prevent duplicate registrations
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
Please add a demo video showing the library explorer and work merge UI running with this new setup. GitHub accepts mp4 uploads to issues. |
|
I'm not sure how to access the MergeUI component through the development site, some guidance there would be appreciated (dev/serve mode doesn't use wc's). Here is the explorer in the meantime. explorer.mov |
|
@b3nten, thanks for your work on this. Your bring up some good points regarding the the parent issue #11442 , as the CSS not being sent over the wire makes the performance concerns minimal. But I agree with you, dropping the third party dep for the built-in Vue 3 WC implementation is worth while. @RayBB @mekarpeles should be able to help highlight areas for testing and point to information on how to get your local env set up for this testing. |
Closes #11442
While not technically a fix for the issue, it seems like duplicated style tags in the DOM is the intended behaviour for Vue's web component support. In practice I don't believe it's an issue, as the performance impact of the duplicated tags seems minimal. And since this is the "blessed" approach chosen by the Vue maintainers they clearly don't think it's a concern either.
This PR removes a third party dependency in favour of native Vue 3's WC implementation, and brings support for Vue 3, which should enable use of the composition API and interop with third party Vue 3 components.
Stakeholders
@lokesh @RayBB