Handle scrolling on mobile in lib/d-tooltip

discourse · Aug 15, 2023 · fb4aabe · fb4aabe
1 parent 5a4af05
commit fb4aabe
Showing 1 changed file with 13 additions and 0 deletions.
diff --git a/app/assets/javascripts/discourse/app/lib/d-tooltip.js b/app/assets/javascripts/discourse/app/lib/d-tooltip.js
@@ -1,16 +1,29 @@
 import tippy from "tippy.js";
+import { bind } from "discourse-common/utils/decorators";
+import discourseDebounce from "discourse-common/lib/debounce";
 
 export class DTooltip {
   #tippyInstance;
 
   constructor(target, content) {
     this.#tippyInstance = this.#initTippy(target, content);
+    if (this.#hasTouchCapabilities()) {
+      window.addEventListener("scroll", this.onScroll);
+    }
   }
 
   destroy() {
+    if (this.#hasTouchCapabilities()) {
+      window.removeEventListener("scroll", this.onScroll);
+    }
     this.#tippyInstance.destroy();
   }
 
+  @bind
+  onScroll() {
+    discourseDebounce(() => this.#tippyInstance.hide(), 10);
+  }
+
   #initTippy(target, content) {
     return tippy(target, {
       interactive: false,