Bug 1539984 - pass along whether a focus change was tripped by a keypress to ensure :-moz-focusring works as designed, r=Jamie

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

--HG--
extra : moz-landing-system : lando

browser/components/customizableui/PanelMultiView.jsm

@@ -1499,7 +1499,7 @@ var PanelView = class extends AssociatedToNode {
         && walker.nextNode()) {
       this.selectedElement = walker.currentNode;
     }
-    this.focusSelectedElement();
+    this.focusSelectedElement(/* byKey */ true);
   }
 
   /**
@@ -1514,7 +1514,7 @@ var PanelView = class extends AssociatedToNode {
       this._arrowNavigableWalker : this._tabNavigableWalker;
     walker.currentNode = walker.root;
     this.selectedElement = walker.lastChild();
-    this.focusSelectedElement();
+    this.focusSelectedElement(/* byKey */ true);
   }
 
   /**
@@ -1607,7 +1607,7 @@ var PanelView = class extends AssociatedToNode {
         let isDown = (keyCode == "ArrowDown") ||
                      (keyCode == "Tab" && !event.shiftKey);
         let button = this.moveSelection(isDown, keyCode != "Tab");
-        button.focus();
+        Services.focus.setFocus(button, Services.focus.FLAG_BYKEY);
         break;
       }
       case "Home":
@@ -1670,11 +1670,15 @@ var PanelView = class extends AssociatedToNode {
 
   /**
    * Focus the last selected element in the view, if any.
+   *
+   * @param byKey {Boolean} whether focus was moved by the user pressing a key.
+   *                        Needed to ensure we show focus styles in the right cases.
    */
-  focusSelectedElement() {
+  focusSelectedElement(byKey = false) {
     let selected = this.selectedElement;
     if (selected) {
-      selected.focus();
+      let flag = byKey ? "FLAG_BYKEY" : "FLAG_BYELEMENTFOCUS";
+      Services.focus.setFocus(selected, Services.focus[flag]);
     }
   }
 

browser/themes/shared/controlcenter/panel.inc.css

@@ -370,6 +370,7 @@ description#identity-popup-content-verifier,
 .identity-popup-content-blocking-category:hover {
   border-radius: 2px;
   background-color: var(--arrowpanel-dimmed);
+  outline: none;
 }
 
 .identity-popup-content-blocking-category:hover:active {