Bug 1942176 - Handle context menu key for tab group labels, r=tabbrowser-reviewers,jswinarton

Differential Revision: https://phabricator.services.mozilla.com/D234668

Author: daogottwald

browser/components/tabbrowser/content/tabs.js

@@ -72,6 +72,7 @@
       this.addEventListener("mouseleave", this);
       this.addEventListener("focusin", this);
       this.addEventListener("focusout", this);
+      this.addEventListener("contextmenu", this);
     }
 
     init() {
@@ -1486,6 +1487,23 @@
         ?.removeAttribute("rolluponmousewheel");
     }
 
+    on_contextmenu(event) {
+      // When pressing the context menu key (as opposed to right-clicking)
+      // while a tab group label has aria focus (as opposed to DOM focus),
+      // open the tab group context menu as if the label had DOM focus.
+      // The button property is used to differentiate between key and mouse.
+      if (
+        event.button == 0 &&
+        this.ariaFocusedItem &&
+        isTabGroupLabel(this.ariaFocusedItem)
+      ) {
+        gBrowser.tabGroupMenu.openEditModal(
+          this.ariaFocusedItem.closest("tab-group")
+        );
+        event.preventDefault();
+      }
+    }
+
     get emptyTabTitle() {
       // Normal tab title is used also in the permanent private browsing mode.
       const l10nId =

browser/components/tabbrowser/test/browser/tabs/browser_tab_groups_keyboard_focus.js

@@ -133,6 +133,32 @@ add_task(async function test_TabGroupKeyboardFocus() {
   await EventUtils.synthesizeKey("KEY_Enter");
   Assert.ok(tabGroup.collapsed, "Tab group should be collapsed once again");
 
+  let editor = document.getElementById("tab-group-editor");
+  let panelShown = BrowserTestUtils.waitForPopupEvent(editor.panel, "shown");
+  //XXX Should simulate a context menu event, but this doesn't seem to work:
+  //await EventUtils.synthesizeKey("VK_CONTEXT_MENU");
+  gBrowser.tabContainer.on_contextmenu({ button: 0, preventDefault: () => {} });
+  info("Waiting for the context menu key to open the group context menu");
+  await panelShown;
+  is(
+    editor.panel.state,
+    "open",
+    "Tab group context menu should be open after hitting context menu key"
+  );
+  is(
+    gBrowser.tabContainer.ariaFocusedItem,
+    tabGroup.labelElement,
+    "Keyboard focus should remain on tab group label while group context menu is open"
+  );
+  let panelHidden = BrowserTestUtils.waitForPopupEvent(editor.panel, "hidden");
+  EventUtils.synthesizeKey("VK_ESCAPE");
+  await panelHidden;
+  is(
+    gBrowser.tabContainer.ariaFocusedItem,
+    tabGroup.labelElement,
+    "Keyboard focus should remain on tab group label after closing the group menu context menu"
+  );
+
   info("Validate that keyboard focus skips over tabs in collapsed tab groups");
   await synthesizeKeyToChangeKeyboardFocus(tab4, "KEY_ArrowRight");
   is(