Bug 1525569 - Fix sidebar nav with keyboard in about:addons r=jaws
authorMark Striemer <mstriemer@mozilla.com>
Thu, 07 Feb 2019 00:43:22 +0000
changeset 457638 c508599012ee655cccbab36e57eacbf20778965c
parent 457637 466f9c24e749d7b3701b60c5ed424e586634a718
child 457639 906716408541ba236fa539a03a2a665feae537eb
push id35516
push userrmaries@mozilla.com
push dateFri, 08 Feb 2019 04:23:26 +0000
treeherdermozilla-central@d599d1a73a3a [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersjaws
bugs1525569
milestone67.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1525569 - Fix sidebar nav with keyboard in about:addons r=jaws Previously the new views root node would be focused when the view changed, this made it so that if you wanted to switch by more than one item up or down you'd need to tab back to the sidebar each time you changed the view. Differential Revision: https://phabricator.services.mozilla.com/D18895
toolkit/mozapps/extensions/content/extensions.js
toolkit/themes/shared/extensions/extensions.inc.css
--- a/toolkit/mozapps/extensions/content/extensions.js
+++ b/toolkit/mozapps/extensions/content/extensions.js
@@ -154,16 +154,24 @@ function initialize(event) {
       let mainWindow = getMainWindow();
       if ("switchToTabHavingURI" in mainWindow) {
         mainWindow.switchToTabHavingURI("about:preferences", true, {
           triggeringPrincipal: Services.scriptSecurityManager.getSystemPrincipal(),
         });
       }
     });
 
+  let categories = document.getElementById("categories");
+  document.addEventListener("keydown", () => {
+    categories.setAttribute("keyboard-navigation", "true");
+  });
+  categories.addEventListener("mousedown", () => {
+    categories.removeAttribute("keyboard-navigation");
+  });
+
   gViewController.initialize();
   gCategories.initialize();
   gHeader.initialize();
   gEventManager.initialize();
   Services.obs.addObserver(sendEMPong, "EM-ping");
   Services.obs.notifyObservers(window, "EM-loaded");
 
   if (!XPINSTALL_ENABLED) {
@@ -855,17 +863,16 @@ var gViewController = {
 
     gCategories.select(aViewId, aPreviousView);
 
     this.currentViewId = aViewId;
     this.currentViewObj = viewObj;
 
     this.displayedView = this.currentViewObj;
     this.currentViewObj.node.setAttribute("loading", "true");
-    this.currentViewObj.node.focus();
 
     let headingName = document.getElementById("heading-name");
     try {
       headingName.textContent = gStrings.ext.GetStringFromName(`listHeading.${view.param}`);
       setSearchLabel(view.param);
     } catch (e) {
       // In tests we sometimes render this view with a type we don't support, that's fine.
       headingName.textContent = "";
--- a/toolkit/themes/shared/extensions/extensions.inc.css
+++ b/toolkit/themes/shared/extensions/extensions.inc.css
@@ -150,16 +150,21 @@
 
 button.warning {
   list-style-image: url("chrome://mozapps/skin/extensions/alerticon-warning.svg");
 }
 
 
 /*** category selector ***/
 
+#categories {
+  /* Make room for outlines */
+  padding: 1px;
+}
+
 #categories > .category[disabled] {
   overflow: hidden;
   height: 0;
   min-height: 0;
   opacity: 0;
   transition-property: min-height, opacity;
   transition-duration: 1s, 0.8s;
   -moz-user-input: none; /* Prevents list item selection during animation. */