Fix popovers dismiss in Chrome browsers (#42352)

* Update popover API to properly register listeners and avoid Chrome/Webkit differences in button focus

* Apply same fix to Tooltips

diff --git a/js/src/popover.js b/js/src/popover.js
index d11eaa33404e679baf32609dacab42d1d7cd001e..807e6bdb48e9f363d1c3b5f1ed3b8eef19d5c782 100644 (file)
--- a/js/src/popover.js
+++ b/js/src/popover.js
@@ -86,24 +86,19 @@ const initPopover = event => {
     return
   }
 
-  // Prevent default for click events to avoid navigation
+  // Prevent default for click events to avoid navigation (e.g. <a href="#">)
   if (event.type === 'click') {
     event.preventDefault()
   }
 
-  // Get or create instance
-  const popover = Popover.getOrCreateInstance(target)
-
-  // Trigger the appropriate action based on event type
-  if (event.type === 'click') {
-    popover.toggle()
-  } else if (event.type === 'focusin') {
-    popover._activeTrigger.focus = true
-    popover._enter()
-  }
+  // Lazily create the instance. The instance's own `_setListeners()` registers
+  // the appropriate listeners on the element for the configured triggers
+  // (click/focus/hover), so we don't toggle or call `_enter` here — doing so
+  // would duplicate handlers and leave stale state on `_activeTrigger`.
+  Popover.getOrCreateInstance(target)
 }
 
-// Support click (default), hover, and focus triggers
+// Auto-initialize popovers on first interaction for click, hover, and focus triggers
 EventHandler.on(document, EVENT_CLICK, SELECTOR_DATA_TOGGLE, initPopover)
 EventHandler.on(document, EVENT_FOCUSIN, SELECTOR_DATA_TOGGLE, initPopover)
 EventHandler.on(document, EVENT_MOUSEENTER, SELECTOR_DATA_TOGGLE, initPopover)

diff --git a/js/src/tooltip.js b/js/src/tooltip.js
index 4c3f59d8343288e675d5da18c0032ba8c1613930..bf5fadb977105dcc21f7b3f79039ef0f26a99582 100644 (file)
--- a/js/src/tooltip.js
+++ b/js/src/tooltip.js
@@ -733,16 +733,17 @@ const initTooltip = event => {
     return
   }
 
-  // Get or create instance and trigger the appropriate action
-  const tooltip = Tooltip.getOrCreateInstance(target)
-
-  // For focus events, manually trigger enter to show
-  if (event.type === 'focusin') {
-    tooltip._activeTrigger.focus = true
-    tooltip._enter()
-  }
+  // Lazily create the instance. The instance's own `_setListeners()` registers
+  // the appropriate listeners on the element for the configured triggers
+  // (hover/focus by default), so we don't mutate `_activeTrigger` or call
+  // `_enter` here — doing so would show tooltips for triggers the user didn't
+  // opt into (e.g. `focusin` firing for click-focused buttons in Chromium,
+  // even when `trigger="hover"` or `trigger="manual"`) and leave stale state
+  // on `_activeTrigger`.
+  Tooltip.getOrCreateInstance(target)
 }
 
+// Auto-initialize tooltips on first interaction for hover and focus triggers
 EventHandler.on(document, EVENT_FOCUSIN, SELECTOR_DATA_TOGGLE, initTooltip)
 EventHandler.on(document, EVENT_MOUSEENTER, SELECTOR_DATA_TOGGLE, initTooltip)