Trigger tooltip option on pointer up (#333)

src/UI/controllers/HTMLTooltipUIController.js

@@ -45,6 +45,7 @@ export class HTMLTooltipUIController extends UIController {
         this._options = options
         this._htmlTooltipOptions = Object.assign({}, defaultOptions, htmlTooltipOptions)
         window.addEventListener('pointerdown', this, true)
+        window.addEventListener('pointerup', this, true)
     }
 
     _activeInput;
@@ -57,6 +58,7 @@ export class HTMLTooltipUIController extends UIController {
     destroy () {
         this.removeTooltip()
         window.removeEventListener('pointerdown', this, true)
+        window.removeEventListener('pointerup', this, true)
     }
 
     /**
@@ -197,6 +199,10 @@ export class HTMLTooltipUIController extends UIController {
             this._pointerDownListener(event)
             break
         }
+        case 'pointerup': {
+            this._pointerUpListener(event)
+            break
+        }
         }
     }
 
@@ -206,6 +212,24 @@ export class HTMLTooltipUIController extends UIController {
         // Ignore events on the Dax icon, we handle those elsewhere
         if (isEventWithinDax(e, e.target)) return
 
+        // @ts-ignore
+        if (e.target.nodeName === 'DDG-AUTOFILL') {
+            e.preventDefault()
+            e.stopImmediatePropagation()
+            // Ignore pointer down events, we'll handle them on pointer up
+        } else {
+            this.removeTooltip().catch(e => {
+                console.error('error removing tooltip', e)
+            })
+        }
+    }
+
+    // Global listener for event delegation
+    _pointerUpListener (e) {
+        if (!e.isTrusted) return
+        // Ignore events on the Dax icon, we handle those elsewhere
+        if (isEventWithinDax(e, e.target)) return
+
         // @ts-ignore
         if (e.target.nodeName === 'DDG-AUTOFILL') {
             e.preventDefault()
@@ -215,15 +239,7 @@ export class HTMLTooltipUIController extends UIController {
             if (!isMainMouseButton) return
 
             const activeTooltip = this.getActiveTooltip()
-            if (!activeTooltip) {
-                console.warn('Could not get activeTooltip')
-            } else {
-                activeTooltip.dispatchClick()
-            }
-        } else {
-            this.removeTooltip().catch(e => {
-                console.error('error removing tooltip', e)
-            })
+            activeTooltip?.dispatchClick()
         }
     }