Bug fix in ActionBar: When collapsed the menu and tooltips aren't vis…

…ible in Firefox (primer#2478)
opf · Jan 4, 2024 · 6e7b7c2 · 6e7b7c2
1 parent 0a2c508
commit 6e7b7c2
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 1 deletion.
diff --git a/.changeset/smart-insects-cheat.md b/.changeset/smart-insects-cheat.md
@@ -0,0 +1,5 @@
+---
+"@primer/view-components": patch
+---
+
+Bug fix in ActionBar: When collapsed the menu and tooltips aren't visible in Firefox
diff --git a/app/components/primer/alpha/action_bar_element.ts b/app/components/primer/alpha/action_bar_element.ts
@@ -50,7 +50,13 @@ class ActionBarElement extends HTMLElement {
     resizeObserver.observe(this)
     instersectionObserver.observe(this)
 
-    requestAnimationFrame(() => this.update())
+    requestAnimationFrame(() => {
+      // This overflow visible is needed for browsers that don't support PopoverElement
+      // to ensure the menu and tooltips are visible when the action bar is in a collapsed state
+      // once popover is fully supported we can remove this.style.overflow = 'visible'
+      this.style.overflow = 'visible'
+      this.update()
+    })
   }
 
   disconnectedCallback() {