Skip to content
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

Vue does not perform 100% anymore at Web Components test #1708

Closed
cimchd opened this issue May 10, 2022 · 4 comments
Closed

Vue does not perform 100% anymore at Web Components test #1708

cimchd opened this issue May 10, 2022 · 4 comments

Comments

@cimchd
Copy link

cimchd commented May 10, 2022

On this page: https://vuejs.org/guide/extras/web-components.html#using-custom-elements-in-vue it is said that vue performs 100% at Custom Elements Everywhere test.
It seems that the test has changed now. 3 tests failed. Until vue comes back to 100% this line should probably be updated or removed.

@leopiccionia

This comment was marked as off-topic.

@skirtles-code
Copy link
Contributor

Related: #1553

@leopiccionia

This comment was marked as off-topic.

@LinusBorg
Copy link
Member

@skirtles-code I think I'd be in favor of reflecting this current state of affairs in the docs, given that the workaround that I proposed to them is still in concideration but seems to be stuck.

We could reflect the actual current score in the docs and add a small section explaining the workarounds:

  1. adding the listeners for camelCase, PascalCase and CASPScase events imperatively with a template ref
  2. adding the listeners for camelCase, PascalCase and CASPScase events decaratively with a small custom directive:
app.directive('event', {
  beforeMount((el, { arg, value }) => {
    el.addEventListener(arg, value)
  }),
  unmounted((el, { arg, value }) => {
    el.removeEventListener(arg, value)
  })
}
<my-custom-el v-event:PascalCase="handleEvent">

That would of course also only work in build-time compilation as string compilation at runtime would lowercase the arg before the compiler processes it.

Thoughts?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants