From 2133162169f538996c4a03155465e98dda4065fb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=94=B3=E5=90=9B=E5=81=A5?= <40288193@qq.com>
Date: Thu, 4 Jan 2024 09:22:19 +0800
Subject: [PATCH] fix(popper): add stopPropagation for wheel event (#1245)

---
 packages/renderless/src/common/deps/popper.ts | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/packages/renderless/src/common/deps/popper.ts b/packages/renderless/src/common/deps/popper.ts
index 4c023f63e..13c5e4f2c 100644
--- a/packages/renderless/src/common/deps/popper.ts
+++ b/packages/renderless/src/common/deps/popper.ts
@@ -238,6 +238,9 @@ const getOffsetRect = (el: HTMLElement) => {
   return elementRect
 }
 
+const stopFn = (ev: Event) => {
+  ev.stopPropagation()
+}
 interface PopperOptions {
   arrowOffset: number
   arrowElement: string
@@ -366,6 +369,8 @@ class Popper {
   update() {
     let data = { instance: this, styles: {} } as unknown as UpdateData
 
+    this.stopEventBubble() // 每次更新都检查
+
     this.popperOuterSize = null as unknown as { width: number; height: number }
     data.placement = data._originalPlacement = this._options.placement
     data.offsets = this._getRefPopOffsets(this._popper, this._reference, data.placement)
@@ -377,6 +382,14 @@ class Popper {
     typeof this.state.updateCallback === 'function' && this.state.updateCallback(data)
   }
 
+  // 阻止popper的mousewheel等事件冒泡。 通过 onxxx 绑定，是为了避免重复绑定事件
+  stopEventBubble() {
+    if (!this._popper) return
+
+    if (!this._popper.onmousewheel) this._popper.onmousewheel = stopFn
+    if (!this._popper.onwheel) this._popper.onwheel = stopFn
+  }
+
   /** 按顺序执行Modifiers， 如果传入终点modifier,则执行到指定位置 */
   runModifiers(data: UpdateData, modifiers: Function[], ends?: Function) {
     let modifiersToRun = modifiers.slice()
@@ -385,7 +398,7 @@ class Popper {
     if (ends !== undefined) {
       modifiersToRun = this._options.modifierFns.slice(
         0,
-        _options.modifierFns.findIndex((m) => m == ends)
+        _options.modifierFns.findIndex((m) => m === ends)
       )
     }