Bdbch/6446 cleanup bubble menu resize (#6496)

* unregister window resize handler when bubble menu is destroyed

* added changeset

* added docs comment

Author: bdbch

.changeset/great-terms-jam.md

@@ -0,0 +1,8 @@
+---
+'@tiptap/extension-bubble-menu': patch
+'@tiptap/react': patch
+'@tiptap/vue-2': patch
+'@tiptap/vue-3': patch
+---
+
+Fixed a bug where the global resize handler of the BubbleMenu plugin would not be unregistered on destroy

packages/extension-bubble-menu/src/bubble-menu-plugin.ts

@@ -254,15 +254,7 @@ export class BubbleMenuView implements PluginView {
     this.view.dom.addEventListener('dragstart', this.dragstartHandler)
     this.editor.on('focus', this.focusHandler)
     this.editor.on('blur', this.blurHandler)
-    window.addEventListener('resize', () => {
-      if (this.resizeDebounceTimer) {
-        clearTimeout(this.resizeDebounceTimer)
-      }
-
-      this.resizeDebounceTimer = window.setTimeout(() => {
-        this.updatePosition()
-      }, this.resizeDelay)
-    })
+    window.addEventListener('resize', this.resizeHandler)
 
     this.update(view, view.state)
 
@@ -279,6 +271,21 @@ export class BubbleMenuView implements PluginView {
     this.hide()
   }
 
+  /**
+   * Handles the window resize event to update the position of the bubble menu.
+   * It uses a debounce mechanism to prevent excessive updates.
+   * The delay is defined by the `resizeDelay` property.
+   */
+  resizeHandler = () => {
+    if (this.resizeDebounceTimer) {
+      clearTimeout(this.resizeDebounceTimer)
+    }
+
+    this.resizeDebounceTimer = window.setTimeout(() => {
+      this.updatePosition()
+    }, this.resizeDelay)
+  }
+
   focusHandler = () => {
     // we use `setTimeout` to make sure `selection` is already updated
     setTimeout(() => this.update(this.editor.view))
@@ -464,6 +471,7 @@ export class BubbleMenuView implements PluginView {
     this.hide()
     this.element.removeEventListener('mousedown', this.mousedownHandler, { capture: true })
     this.view.dom.removeEventListener('dragstart', this.dragstartHandler)
+    window.removeEventListener('resize', this.resizeHandler)
     this.editor.off('focus', this.focusHandler)
     this.editor.off('blur', this.blurHandler)