fix(useMagicKeys): handle undefined key in keyboard events (#5225)

LouisLau-art · LouisLau-art · LouisLau-art · web-flow · commit 65e25ab24543 · 2026-01-21T15:00:13.000Z
Co-authored-by: LouisLau-art &lt;louis.shawn@qq.com&gt;
Co-authored-by: LouisLau-art &lt;louislau.art@gmail.com&gt;
Co-authored-by: Robin &lt;robin.kehl@singular-it.de&gt;
diff --git a/packages/core/useMagicKeys/index.test.ts b/packages/core/useMagicKeys/index.test.ts
@@ -155,13 +155,30 @@ describe('useMagicKeys', () => {
     expect(alt_tab.value).toBe(false)
   })
 
-  it('should handle empty key events without errors', async () => {
+  it('should handle empty or undefined key events without errors', async () => {
     const { a } = useMagicKeys({ target })
 
+    // Test empty key
     expect(() => {
       target.dispatchEvent(new KeyboardEvent('keyup', {}))
     }).not.toThrow()
 
+    // Test empty string key
+    expect(() => {
+      target.dispatchEvent(new KeyboardEvent('keyup', { key: '' }))
+    }).not.toThrow()
+
     expect(a.value).toBe(false)
   })
+
+  it('should be robust when key is explicitly undefined', () => {
+    useMagicKeys({ target })
+
+    const event = new KeyboardEvent('keyup', {})
+    Object.defineProperty(event, 'key', { value: undefined })
+
+    expect(() => {
+      target.dispatchEvent(event)
+    }).not.toThrow()
+  })
 })
diff --git a/packages/core/useMagicKeys/index.ts b/packages/core/useMagicKeys/index.ts
@@ -140,7 +140,7 @@ export function useMagicKeys<T extends boolean = false>(options: UseMagicKeysOpt
     const code = e.code?.toLowerCase()
     const values = [code, key].filter(Boolean)
 
-    if (key === '')
+    if (!key)
       return
 
     // current set
