fix(VDialog,VMenu): remove focus listeners on unmount

fixes #20422
vuetifyjs · Nov 3, 2024 · a72df88 · a72df88
1 parent 0e8b92b
commit a72df88
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 5 deletions.
diff --git a/packages/vuetify/src/components/VDialog/VDialog.tsx b/packages/vuetify/src/components/VDialog/VDialog.tsx
@@ -13,7 +13,7 @@ import { useProxiedModel } from '@/composables/proxiedModel'
 import { useScopeId } from '@/composables/scopeId'
 
 // Utilities
-import { mergeProps, nextTick, ref, watch } from 'vue'
+import { mergeProps, nextTick, onBeforeUnmount, ref, watch } from 'vue'
 import { focusableChildren, genericComponent, IN_BROWSER, propsFactory, useRender } from '@/util'
 
 // Types
@@ -81,6 +81,10 @@ export const VDialog = genericComponent<OverlaySlots>()({
       }
     }
 
+    onBeforeUnmount(() => {
+      document.removeEventListener('focusin', onFocusin)
+    })
+
     if (IN_BROWSER) {
       watch(() => isActive.value && props.retainFocus, val => {
         val

diff --git a/packages/vuetify/src/components/VMenu/VMenu.tsx b/packages/vuetify/src/components/VMenu/VMenu.tsx
@@ -33,6 +33,7 @@ import {
   genericComponent,
   getNextElement,
   getUid,
+  IN_BROWSER,
   isClickInsideElement,
   omit,
   propsFactory,
@@ -102,7 +103,10 @@ export const VMenu = genericComponent<OverlaySlots>()({
       },
     })
 
-    onBeforeUnmount(() => parent?.unregister())
+    onBeforeUnmount(() => {
+      parent?.unregister()
+      document.removeEventListener('focusin', onFocusIn)
+    })
     onDeactivated(() => isActive.value = false)
 
     async function onFocusIn (e: FocusEvent) {
@@ -130,12 +134,16 @@ export const VMenu = genericComponent<OverlaySlots>()({
     watch(isActive, val => {
       if (val) {
         parent?.register()
-        document.addEventListener('focusin', onFocusIn, { once: true })
+        if (IN_BROWSER) {
+          document.addEventListener('focusin', onFocusIn, { once: true })
+        }
       } else {
         parent?.unregister()
-        document.removeEventListener('focusin', onFocusIn)
+        if (IN_BROWSER) {
+          document.removeEventListener('focusin', onFocusIn)
+        }
       }
-    })
+    }, { immediate: true })
 
     function onClickOutside (e: MouseEvent) {
       parent?.closeParents(e)