Filter out items that aren't visible

primer · Oct 18, 2023 · 23c5ef3 · 23c5ef3
1 parent 61c294f
commit 23c5ef3
Showing 1 changed file with 8 additions and 1 deletion.
diff --git a/app/components/primer/alpha/action_bar_element.ts b/app/components/primer/alpha/action_bar_element.ts
@@ -86,11 +86,18 @@ class ActionBarElement extends HTMLElement {
       bindKeys: FocusKeys.ArrowHorizontal | FocusKeys.HomeAndEnd,
       focusOutBehavior: 'wrap',
       focusableElementFilter: element => {
-        return !element.closest('.ActionBar-item[hidden]') && !element.closest('li.ActionListItem')
+        return this.#isVisible(element)
       }
     })
   }
 
+  #isVisible(element: HTMLElement): boolean {
+    // Safari doesn't support `checkVisibility` yet.
+    if (typeof element.checkVisibility === 'function') return element.checkVisibility()
+
+    return Boolean(element.offsetParent || element.offsetWidth || element.offsetHeight)
+  }
+
   #itemGap(): number {
     return parseInt(window.getComputedStyle(this.itemContainer)?.columnGap, 10) || 0
   }