From 3670f0f5255c323c4c5ae9b8e3bdfcbb8b50128d Mon Sep 17 00:00:00 2001 From: Thorsten Luenborg Date: Tue, 8 Feb 2022 18:08:49 +0100 Subject: [PATCH] fix(runtime-core): custom-element: ensure event names are hyphenated --- packages/runtime-dom/__tests__/customElement.spec.ts | 10 ++++++++-- packages/runtime-dom/src/apiCustomElement.ts | 2 +- 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/packages/runtime-dom/__tests__/customElement.spec.ts b/packages/runtime-dom/__tests__/customElement.spec.ts index dd087ad279d..6f8fd5012d1 100644 --- a/packages/runtime-dom/__tests__/customElement.spec.ts +++ b/packages/runtime-dom/__tests__/customElement.spec.ts @@ -232,7 +232,10 @@ describe('defineCustomElement', () => { emit('created') return () => h('div', { - onClick: () => emit('my-click', 1) + onClick: () => { + emit('my-click', 1) + emit('myClick', 1) // validate hypenization + } }) } }) @@ -252,10 +255,13 @@ describe('defineCustomElement', () => { const spy = jest.fn() e.addEventListener('my-click', spy) e.shadowRoot!.childNodes[0].dispatchEvent(new CustomEvent('click')) - expect(spy).toHaveBeenCalled() + expect(spy).toHaveBeenCalledTimes(2) expect(spy.mock.calls[0][0]).toMatchObject({ detail: [1] }) + expect(spy.mock.calls[1][0]).toMatchObject({ + detail: [1] + }) }) }) diff --git a/packages/runtime-dom/src/apiCustomElement.ts b/packages/runtime-dom/src/apiCustomElement.ts index 5108e3bdfbe..4a542c9ee27 100644 --- a/packages/runtime-dom/src/apiCustomElement.ts +++ b/packages/runtime-dom/src/apiCustomElement.ts @@ -354,7 +354,7 @@ export class VueElement extends BaseClass { // intercept emit instance.emit = (event: string, ...args: any[]) => { this.dispatchEvent( - new CustomEvent(event, { + new CustomEvent(hyphenate(event), { detail: args }) )