Bug 1692666 - Move 'Search... for...' to a dedicated section. r=Gijs

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

accessible/tests/browser/mac/browser_app.js

@@ -219,16 +219,16 @@ add_task(async () => {
 
       menu = await getMacAccessible(menu);
       let menuChildren = menu.getAttributeValue("AXChildren");
-      const expectedChildCount = 14 + +hasContainers + +hasInspectA11y;
+      const expectedChildCount = 13 + +hasContainers + +hasInspectA11y;
       is(
         menuChildren.length,
         expectedChildCount,
         `Context menu on link contains ${expectedChildCount} items.`
       );
-      // items at indicies 4, 9, 11 and 13 are the splitters when containers exist
+      // items at indicies 4, 10, and 12 are the splitters when containers exist
       // everything else should be a menu item, otherwise indicies of splitters are
-      // 3, 8, 10, and 12
-      const splitterIndicies = hasContainers ? [4, 9, 11, 13] : [3, 8, 10, 12];
+      // 3, 9, and 11
+      const splitterIndicies = hasContainers ? [4, 10, 12] : [3, 9, 11];
       for (let i = 0; i < menuChildren.length; i++) {
         if (splitterIndicies.includes(i)) {
           is(

browser/base/content/browser-context.inc

@@ -270,6 +270,15 @@
       <menuitem id="context-selectall"
                 data-l10n-id="text-action-select-all"
                 command="cmd_selectAll"/>
+      <menuseparator id="context-sep-sendlinktodevice" class="sync-ui-item"
+                hidden="true"/>
+      <menu id="context-sendlinktodevice"
+            class="sync-ui-item"
+            data-l10n-id="main-context-menu-link-send-to-device"
+            hidden="true">
+        <menupopup id="context-sendlinktodevice-popup"
+                   onpopupshowing="gSync.populateSendTabToDevicesMenu(event.target, gContextMenu.linkURL, gContextMenu.linkTextStr);"/>
+      </menu>
       <menuseparator id="context-sep-selectall"/>
       <menuitem id="context-keywordfield"
                 data-l10n-id="main-context-menu-keyword"
@@ -280,15 +289,7 @@
       <menuitem id="context-searchselect-private"
                 oncommand="BrowserSearch.loadSearchFromContext(this.searchTerms, true, this.principal, this.csp, event);"
                 onclick="checkForMiddleClick(this, event);"/>
-      <menuseparator id="context-sep-sendlinktodevice" class="sync-ui-item"
-                     hidden="true"/>
-      <menu id="context-sendlinktodevice"
-            class="sync-ui-item"
-            data-l10n-id="main-context-menu-link-send-to-device"
-            hidden="true">
-        <menupopup id="context-sendlinktodevice-popup"
-                   onpopupshowing="gSync.populateSendTabToDevicesMenu(event.target, gContextMenu.linkURL, gContextMenu.linkTextStr);"/>
-      </menu>
+
       <menuseparator id="frame-sep"/>
       <menu id="frame" data-l10n-id="main-context-menu-frame">
         <menupopup>

browser/base/content/nsContextMenu.js

@@ -798,6 +798,13 @@ class nsContextMenu {
 
     // Copy link location depends on whether we're on a non-mailto link.
     this.showItem("context-copylink", this.onLink && !this.onMailtoLink);
+    let copyLinkSeparator = document.getElementById("context-sep-copylink");
+    // Show "Copy Link" and "Copy" with no divider, and "copy link" and "Send link to Device" with no divider between.
+    // Other cases will show a divider.
+    copyLinkSeparator.toggleAttribute(
+      "ensureHidden",
+      this.onLink && !this.onMailtoLink && !this.onImage
+    );
 
     this.showItem("context-copyvideourl", this.onVideo);
     this.showItem("context-copyaudiourl", this.onAudio);
@@ -1047,6 +1054,7 @@ class nsContextMenu {
 
   // Iterate over the visible items on the menu and its submenus and
   // hide any duplicated separators next to each other.
+  // The attribute "ensureHidden" will override this process and keep a particular separator hidden in special cases.
   showHideSeparators(aPopup) {
     let lastVisibleSeparator = null;
     let count = 0;
@@ -1058,7 +1066,10 @@ class nsContextMenu {
       }
 
       if (menuItem.localName == "menuseparator") {
-        if (!count) {
+        // Individual separators can have the `ensureHidden` attribute added to avoid them
+        // becoming visible. We also set `count` to 0 below because otherwise the
+        // next separator would be made visible, with the same visual effect.
+        if (!count || menuItem.hasAttribute("ensureHidden")) {
           menuItem.hidden = true;
         } else {
           menuItem.hidden = false;
@@ -2104,6 +2115,14 @@ class nsContextMenu {
 
     menuItem.hidden = !showSearchSelect;
     menuItemPrivate.hidden = !showPrivateSearchSelect;
+    let frameSeparator = document.getElementById("frame-sep");
+
+    // Add a divider between "Search X for Y" and "This Frame", and between "Search X for Y" and "Check Spelling",
+    // but no divider in other cases.
+    frameSeparator.toggleAttribute(
+      "ensureHidden",
+      !showSearchSelect && this.inFrame
+    );
     // If we're not showing the menu items, we can skip formatting the labels.
     if (!showSearchSelect) {
       return;

browser/base/content/test/contextMenu/browser_contextmenu.js

@@ -68,18 +68,18 @@ add_task(async function test_xul_text_link_label() {
     ...(hasPocket ? ["context-savelinktopocket", true] : []),
     "context-copylink",
     true,
+    "context-sendlinktodevice",
+    true,
+    // We need a blank entry here because the sendlinktodevice submenu is
+    // dynamically generated with no ids.
+    [],
+    null,
     "---",
     null,
     "context-searchselect",
     true,
     "context-searchselect-private",
     true,
-    "---",
-    null,
-    "context-sendlinktodevice",
-    true,
-    [],
-    null,
   ]);
 
   // Clean up so won't affect HTML element test cases.
@@ -193,18 +193,16 @@ add_task(async function test_link() {
     ...(hasPocket ? ["context-savelinktopocket", true] : []),
     "context-copylink",
     true,
+    "context-sendlinktodevice",
+    true,
+    [],
+    null,
     "---",
     null,
     "context-searchselect",
     true,
     "context-searchselect-private",
     true,
-    "---",
-    null,
-    "context-sendlinktodevice",
-    true,
-    [],
-    null,
   ]);
 });
 
@@ -231,18 +229,16 @@ add_task(async function test_link_in_shadow_dom() {
       ...(hasPocket ? ["context-savelinktopocket", true] : []),
       "context-copylink",
       true,
+      "context-sendlinktodevice",
+      true,
+      [],
+      null,
       "---",
       null,
       "context-searchselect",
       true,
       "context-searchselect-private",
       true,
-      "---",
-      null,
-      "context-sendlinktodevice",
-      true,
-      [],
-      null,
     ],
     {
       offsetX: 6,
@@ -1559,18 +1555,18 @@ add_task(async function test_select_text_link() {
       true,
       "---",
       null,
-      "context-searchselect",
-      true,
-      "context-searchselect-private",
-      true,
-      "---",
-      null,
       "context-sendlinktodevice",
       true,
       [],
       null,
       "---",
       null,
+      "context-searchselect",
+      true,
+      "context-searchselect-private",
+      true,
+      "---",
+      null,
       "context-print-selection",
       true,
       "---",
@@ -1840,18 +1836,16 @@ add_task(async function test_svg_link() {
     ...(hasPocket ? ["context-savelinktopocket", true] : []),
     "context-copylink",
     true,
+    "context-sendlinktodevice",
+    true,
+    [],
+    null,
     "---",
     null,
     "context-searchselect",
     true,
     "context-searchselect-private",
     true,
-    "---",
-    null,
-    "context-sendlinktodevice",
-    true,
-    [],
-    null,
   ]);
 
   await test_contextmenu("#svg-with-link2 > a", [
@@ -1874,18 +1868,16 @@ add_task(async function test_svg_link() {
     ...(hasPocket ? ["context-savelinktopocket", true] : []),
     "context-copylink",
     true,
+    "context-sendlinktodevice",
+    true,
+    [],
+    null,
     "---",
     null,
     "context-searchselect",
     true,
     "context-searchselect-private",
     true,
-    "---",
-    null,
-    "context-sendlinktodevice",
-    true,
-    [],
-    null,
   ]);
 
   await test_contextmenu("#svg-with-link3 > a", [
@@ -1908,18 +1900,16 @@ add_task(async function test_svg_link() {
     ...(hasPocket ? ["context-savelinktopocket", true] : []),
     "context-copylink",
     true,
+    "context-sendlinktodevice",
+    true,
+    [],
+    null,
     "---",
     null,
     "context-searchselect",
     true,
     "context-searchselect-private",
     true,
-    "---",
-    null,
-    "context-sendlinktodevice",
-    true,
-    [],
-    null,
   ]);
 });
 
@@ -1944,18 +1934,16 @@ add_task(async function test_svg_relative_link() {
     ...(hasPocket ? ["context-savelinktopocket", true] : []),
     "context-copylink",
     true,
+    "context-sendlinktodevice",
+    true,
+    [],
+    null,
     "---",
     null,
     "context-searchselect",
     true,
     "context-searchselect-private",
     true,
-    "---",
-    null,
-    "context-sendlinktodevice",
-    true,
-    [],
-    null,
   ]);
 
   await test_contextmenu("#svg-with-relative-link2 > a", [
@@ -1978,18 +1966,16 @@ add_task(async function test_svg_relative_link() {
     ...(hasPocket ? ["context-savelinktopocket", true] : []),
     "context-copylink",
     true,
+    "context-sendlinktodevice",
+    true,
+    [],
+    null,
     "---",
     null,
     "context-searchselect",
     true,
     "context-searchselect-private",
     true,
-    "---",
-    null,
-    "context-sendlinktodevice",
-    true,
-    [],
-    null,
   ]);
 
   await test_contextmenu("#svg-with-relative-link3 > a", [
@@ -2012,18 +1998,16 @@ add_task(async function test_svg_relative_link() {
     ...(hasPocket ? ["context-savelinktopocket", true] : []),
     "context-copylink",
     true,
+    "context-sendlinktodevice",
+    true,
+    [],
+    null,
     "---",
     null,
     "context-searchselect",
     true,
     "context-searchselect-private",
     true,
-    "---",
-    null,
-    "context-sendlinktodevice",
-    true,
-    [],
-    null,
   ]);
 });
 
@@ -2095,18 +2079,16 @@ add_task(async function test_background_image() {
     true,
     "context-copylink",
     true,
+    "context-sendlinktodevice",
+    false,
+    [],
+    null,
     "---",
     null,
     "context-searchselect",
     true,
     "context-searchselect-private",
     true,
-    "---",
-    null,
-    "context-sendlinktodevice",
-    false,
-    [],
-    null,
   ]);
 
   // Don't show image related context menu commands when there is a selection