From 3d55f46d893562a1b6c66da6dacd25f455918b54 Mon Sep 17 00:00:00 2001
From: Thorsten Luenborg <t.luenborg@googlemail.com>
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 777f9677d04..fe33dc3c153 100644
--- a/packages/runtime-dom/__tests__/customElement.spec.ts
+++ b/packages/runtime-dom/__tests__/customElement.spec.ts
@@ -218,7 +218,10 @@ describe('defineCustomElement', () => {
         emit('created')
         return () =>
           h('div', {
-            onClick: () => emit('my-click', 1)
+            onClick: () => {
+              emit('my-click', 1)
+              emit('myClick', 1) // validate hypenization
+            }
           })
       }
     })
@@ -238,10 +241,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 059fcac16f1..0b7d376f61d 100644
--- a/packages/runtime-dom/src/apiCustomElement.ts
+++ b/packages/runtime-dom/src/apiCustomElement.ts
@@ -340,7 +340,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
             })
           )