fix(menu): prevents recursion and fixes Firefox keyboard nav

adobe · Jan 16, 2025 · 97bfa81 · 97bfa81
1 parent 7ce405c
commit 97bfa81
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 12 deletions.
diff --git a/packages/menu/src/Menu.ts b/packages/menu/src/Menu.ts
@@ -356,7 +356,6 @@ export class Menu extends SizedMixin(SpectrumElement, { noDefaultSize: true }) {
             return;
         }
         this.focusMenuItemByOffset(0);
-        super.focus({ preventScroll });
         this.rovingTabindexController.focus({ preventScroll });
         const selectedItem = this.selectedItems[0];
         if (selectedItem && !preventScroll) {
@@ -428,6 +427,7 @@ export class Menu extends SizedMixin(SpectrumElement, { noDefaultSize: true }) {
     }
 
     public handleFocusin(event: FocusEvent): void {
+        // ignore if a child element has a different root menu
         if (
             this.childItems.some(
                 (childItem) => childItem.menuData.focusRoot !== this
@@ -438,9 +438,12 @@ export class Menu extends SizedMixin(SpectrumElement, { noDefaultSize: true }) {
         const activeElement = (this.getRootNode() as Document).activeElement as
             | MenuItem
             | Menu;
+
+        // selected child items root menu
         const selectionRoot =
             this.childItems[this.focusedItemIndex]?.menuData.selectionRoot ||
             this;
+
         if (activeElement !== selectionRoot || event.target !== this) {
             selectionRoot.focus({ preventScroll: true });
             if (activeElement && this.focusedItemIndex === 0) {
@@ -450,25 +453,15 @@ export class Menu extends SizedMixin(SpectrumElement, { noDefaultSize: true }) {
                 this.focusMenuItemByOffset(Math.max(offset, 0));
             }
         }
-        this.startListeningToKeyboard();
-    }
-
-    public startListeningToKeyboard(): void {
-        //this.addEventListener('keydown', this.handleKeydown);
     }
 
     public handleBlur(event: FocusEvent): void {
         if (elementIsOrContains(this, event.relatedTarget as Node)) {
             return;
         }
-        this.stopListeningToKeyboard();
         this.childItems.forEach((child) => (child.focused = false));
     }
 
-    public stopListeningToKeyboard(): void {
-        //this.removeEventListener('keydown', this.handleKeydown);
-    }
-
     private descendentOverlays = new Map<Overlay, Overlay>();
 
     protected handleDescendentOverlayOpened(event: Event): void {

diff --git a/tools/reactive-controllers/src/FocusGroup.ts b/tools/reactive-controllers/src/FocusGroup.ts
@@ -189,7 +189,9 @@ export class FocusGroupController<T extends HTMLElement>
             focusElement = elements[this.currentIndex];
         }
         if (focusElement && this.isFocusableElement(focusElement)) {
-            elements[this.prevIndex]?.setAttribute('tabindex', '-1');
+            if (elements[this.prevIndex] !== focusElement) {
+                elements[this.prevIndex]?.setAttribute('tabindex', '-1');
+            }
             focusElement.tabIndex = 0;
             focusElement.focus(options);
         }