Bug 1482454 - enabled accessibility panel by default. r=gl, ochameau
authorYura Zenevich <yura.zenevich@gmail.com>
Mon, 27 Aug 2018 10:51:29 -0400
changeset 434363 a0c3d80c5d2215dedb1c8b68021410a614c217aa
parent 434362 1b09c0419d137d79d316597078f7b106e21f3caa
child 434364 ba0eb91bd672e5aee2328ccbee725c48ef0c212b
push id107342
push useryura.zenevich@gmail.com
push dateSat, 01 Sep 2018 00:30:26 +0000
treeherdermozilla-inbound@a0c3d80c5d22 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersgl, ochameau
bugs1482454
milestone63.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 1482454 - enabled accessibility panel by default. r=gl, ochameau MozReview-Commit-ID: 38cNU1Raz8T
devtools/client/accessibility/accessibility-startup.js
devtools/client/accessibility/panel.js
devtools/client/framework/test/browser_toolbox_toolbar_reorder_by_dnd.js
devtools/client/framework/test/browser_toolbox_toolbar_reorder_with_extension.js
devtools/client/framework/toolbox-process-window.js
devtools/client/inspector/inspector.js
devtools/client/netmonitor/test/head.js
devtools/client/preferences/devtools-client.js
--- a/devtools/client/accessibility/accessibility-startup.js
+++ b/devtools/client/accessibility/accessibility-startup.js
@@ -1,29 +1,28 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 "use strict";
 
 const Services = require("Services");
-const { AccessibilityFront } = require("devtools/shared/fronts/accessibility");
 
 // @remove after release 63 (See Bug 1482461)
 const PROMOTE_COUNT_PREF = "devtools.promote.accessibility";
 
 /**
  * Component responsible for all accessibility panel startup steps before the panel is
  * actually opened.
  */
 class AccessibilityStartup {
   constructor(toolbox) {
     this.toolbox = toolbox;
 
-    this._updateAccessibilityState = this._updateAccessibilityState.bind(this);
+    this._updateToolHighlight = this._updateToolHighlight.bind(this);
 
     // Creates accessibility front.
     this.initAccessibility();
   }
 
   get target() {
     return this.toolbox.target;
   }
@@ -36,41 +35,40 @@ class AccessibilityStartup {
   }
 
   get walker() {
     return this._walker;
   }
 
   /**
    * Fully initialize accessibility front. Also add listeners for accessibility
-   * service lifecycle events that affect picker state and the state of the tool tab
-   * highlight.
+   * service lifecycle events that affect the state of the tool tab highlight.
    * @return {Promise}
    *         A promise for when accessibility front is fully initialized.
    */
   initAccessibility() {
     if (!this._initAccessibility) {
       this._initAccessibility = (async function() {
-        this._accessibility = new AccessibilityFront(this.target.client,
-                                                     this.target.form);
+        this._accessibility = this.target.getFront("accessibility");
         // We must call a method on an accessibility front here (such as getWalker), in
         // oreder to be able to check actor's backward compatibility via actorHasMethod.
         // See targe.js@getActorDescription for more information.
         this._walker = await this._accessibility.getWalker();
         // Only works with FF61+ targets
         this._supportsLatestAccessibility =
           await this.target.actorHasMethod("accessibility", "enable");
 
         if (this._supportsLatestAccessibility) {
           await this._accessibility.bootstrap();
         }
 
-        this._updateAccessibilityState();
-        this._accessibility.on("init", this._updateAccessibilityState);
-        this._accessibility.on("shutdown", this._updateAccessibilityState);
+        this._updateToolHighlight();
+
+        this._accessibility.on("init", this._updateToolHighlight);
+        this._accessibility.on("shutdown", this._updateToolHighlight);
       }.bind(this))();
     }
 
     return this._initAccessibility;
   }
 
   /**
    * Destroy accessibility front. Also remove listeners for accessibility service
@@ -87,53 +85,35 @@ class AccessibilityStartup {
       if (!this._accessibility) {
         return;
       }
 
       // Ensure that the accessibility isn't still being initiated, otherwise race
       // conditions in the initialization process can throw errors.
       await this._initAccessibility;
 
-      this._accessibility.off("init", this._updateAccessibilityState);
-      this._accessibility.off("shutdown", this._updateAccessibilityState);
+      this._accessibility.off("init", this._updateToolHighlight);
+      this._accessibility.off("shutdown", this._updateToolHighlight);
 
       await this._walker.destroy();
-      await this._accessibility.destroy();
       this._accessibility = null;
       this._walker = null;
     }.bind(this))();
     return this._destroyingAccessibility;
   }
 
   /**
-   * Update states of the accessibility picker and accessibility tab highlight.
-   * @return {[type]} [description]
-   */
-  _updateAccessibilityState() {
-    this._updateAccessibilityToolHighlight();
-    this._updatePickerButton();
-  }
-
-  /**
-   * Update picker button state and ensure toolbar is re-rendered correctly.
-   */
-  _updatePickerButton() {
-    this.toolbox.updatePickerButton();
-    // Calling setToolboxButtons to make sure toolbar is re-rendered correctly.
-    this.toolbox.component.setToolboxButtons(this.toolbox.toolbarButtons);
-  }
-
-  /**
    * Set the state of the accessibility tab highlight depending on whether the
    * accessibility service is initialized or shutdown.
    */
-  _updateAccessibilityToolHighlight() {
-    if (this._accessibility.enabled) {
+  async _updateToolHighlight() {
+    const isHighlighted = await this.toolbox.isToolHighlighted("accessibility");
+    if (this._accessibility.enabled && !isHighlighted) {
       this.toolbox.highlightTool("accessibility");
-    } else {
+    } else if (!this._accessibility.enabled && isHighlighted) {
       this.toolbox.unhighlightTool("accessibility");
     }
   }
 
   // @remove after release 63 (See Bug 1482461)
   updatePanelPromoteCount() {
     Services.prefs.setIntPref(PROMOTE_COUNT_PREF, 0);
   }
--- a/devtools/client/accessibility/panel.js
+++ b/devtools/client/accessibility/panel.js
@@ -34,17 +34,17 @@ function AccessibilityPanel(iframeWindow
 
   this.onTabNavigated = this.onTabNavigated.bind(this);
   this.onPanelVisibilityChange = this.onPanelVisibilityChange.bind(this);
   this.onNewAccessibleFrontSelected =
     this.onNewAccessibleFrontSelected.bind(this);
   this.onAccessibilityInspectorUpdated =
     this.onAccessibilityInspectorUpdated.bind(this);
   this.updateA11YServiceDurationTimer = this.updateA11YServiceDurationTimer.bind(this);
-  this.updatePickerButton = this.updatePickerButton.bind(this);
+  this.forceUpdatePickerButton = this.forceUpdatePickerButton.bind(this);
 
   EventEmitter.decorate(this);
 }
 
 AccessibilityPanel.prototype = {
   /**
    * Open is effectively an asynchronous constructor.
    */
@@ -87,16 +87,19 @@ AccessibilityPanel.prototype = {
     }
 
     this.startup.updatePanelPromoteCount();
 
     this.updateA11YServiceDurationTimer();
     this.front.on("init", this.updateA11YServiceDurationTimer);
     this.front.on("shutdown", this.updateA11YServiceDurationTimer);
 
+    this.front.on("init", this.forceUpdatePickerButton);
+    this.front.on("shutdown", this.forceUpdatePickerButton);
+
     this.isReady = true;
     this.emit("ready");
     resolver(this);
     return this._opening;
   },
 
   onNewAccessibleFrontSelected(selected) {
     this.emit("new-accessible-front-selected", selected);
@@ -176,16 +179,27 @@ AccessibilityPanel.prototype = {
 
     this.panelWin.dispatchEvent(event);
   },
 
   updatePickerButton() {
     this.picker && this.picker.updateButton();
   },
 
+  forceUpdatePickerButton() {
+    // Only update picker button when the panel is selected.
+    if (!this.isVisible) {
+      return;
+    }
+
+    this.updatePickerButton();
+    // Calling setToolboxButtons to make sure toolbar is forced to re-render.
+    this._toolbox.component.setToolboxButtons(this._toolbox.toolbarButtons);
+  },
+
   togglePicker(focus) {
     this.picker && this.picker.toggle();
   },
 
   cancelPicker() {
     this.picker && this.picker.cancel();
   },
 
@@ -236,16 +250,19 @@ AccessibilityPanel.prototype = {
       this.onAccessibilityInspectorUpdated);
 
     this.picker.release();
     this.picker = null;
 
     if (this.front) {
       this.front.off("init", this.updateA11YServiceDurationTimer);
       this.front.off("shutdown", this.updateA11YServiceDurationTimer);
+
+      this.front.off("init", this.forceUpdatePickerButton);
+      this.front.off("shutdown", this.forceUpdatePickerButton);
     }
 
     this._telemetry = null;
     this.panelWin.gToolbox = null;
     this.panelWin.gTelemetry = null;
 
     this.emit("destroyed");
 
--- a/devtools/client/framework/test/browser_toolbox_toolbar_reorder_by_dnd.js
+++ b/devtools/client/framework/test/browser_toolbox_toolbar_reorder_by_dnd.js
@@ -21,57 +21,58 @@
 //   * performance
 //   * memory
 //   * netmonitor
 //   * storage
 
 const { Toolbox } = require("devtools/client/framework/toolbox");
 
 const TEST_STARTING_ORDER = ["inspector", "webconsole", "jsdebugger", "styleeditor",
-                             "performance", "memory", "netmonitor", "storage"];
+                             "performance", "memory", "netmonitor", "storage",
+                             "accessibility"];
 const TEST_DATA = [
   {
     description: "DragAndDrop the target component to back",
     dragTarget: "webconsole",
     dropTarget: "jsdebugger",
     expectedOrder: ["inspector", "jsdebugger", "webconsole", "styleeditor",
-                    "performance", "memory", "netmonitor", "storage"],
+                    "performance", "memory", "netmonitor", "storage", "accessibility"],
   },
   {
     description: "DragAndDrop the target component to front",
     dragTarget: "webconsole",
     dropTarget: "inspector",
     expectedOrder: ["webconsole", "inspector", "jsdebugger", "styleeditor",
-                    "performance", "memory", "netmonitor", "storage"],
+                    "performance", "memory", "netmonitor", "storage", "accessibility"],
   },
   {
     description: "DragAndDrop the target component over the starting of the tab",
     dragTarget: "netmonitor",
     passedTargets: ["memory", "performance", "styleeditor",
                     "jsdebugger", "webconsole", "inspector"],
     dropTarget: "#toolbox-buttons-start",
     expectedOrder: ["netmonitor", "inspector", "webconsole", "jsdebugger",
-                    "styleeditor", "performance", "memory", "storage"],
+                    "styleeditor", "performance", "memory", "storage", "accessibility"],
   },
   {
     description: "DragAndDrop the target component over the ending of the tab",
     dragTarget: "webconsole",
     passedTargets: ["jsdebugger", "styleeditor", "performance",
                     "memory", "netmonitor", "storage"],
     dropTarget: "#toolbox-buttons-end",
     expectedOrder: ["inspector", "jsdebugger", "styleeditor", "performance",
-                    "memory", "netmonitor", "storage", "webconsole", ],
+                    "memory", "netmonitor", "storage", "webconsole", "accessibility"],
   },
   {
     description: "Mouse was out from the document while dragging",
     dragTarget: "webconsole",
     passedTargets: ["inspector"],
     dropTarget: null,
     expectedOrder: ["webconsole", "inspector", "jsdebugger", "styleeditor",
-                    "performance", "memory", "netmonitor", "storage"],
+                    "performance", "memory", "netmonitor", "storage", "accessibility"],
   },
 ];
 
 add_task(async function() {
   const tab = await addTab("about:blank");
   const toolbox = await openToolboxForTab(tab, "inspector", Toolbox.HostType.BOTTOM);
 
   const originalPreference = Services.prefs.getCharPref("devtools.toolbox.tabsOrder");
@@ -94,13 +95,14 @@ add_task(async function() {
 
   info("Test with overflowing tabs");
   prepareToolTabReorderTest(toolbox, TEST_STARTING_ORDER);
   await resizeWindow(toolbox, 800);
   await toolbox.selectTool("storage");
   const dragTarget = "storage";
   const dropTarget = "inspector";
   const expectedOrder = ["storage", "inspector", "webconsole", "jsdebugger",
-                         "styleeditor", "performance", "memory", "netmonitor"];
+                         "styleeditor", "performance", "memory", "netmonitor",
+                         "accessibility"];
   await dndToolTab(toolbox, dragTarget, dropTarget);
   assertToolTabSelected(toolbox, dragTarget);
   assertToolTabPreferenceOrder(expectedOrder);
 });
--- a/devtools/client/framework/test/browser_toolbox_toolbar_reorder_with_extension.js
+++ b/devtools/client/framework/test/browser_toolbox_toolbar_reorder_with_extension.js
@@ -7,17 +7,18 @@
 
 // Test for reordering with an extension installed.
 
 const { Toolbox } = require("devtools/client/framework/toolbox");
 
 const EXTENSION = "@reorder.test";
 
 const TEST_STARTING_ORDER = ["inspector", "webconsole", "jsdebugger", "styleeditor",
-                             "performance", "memory", "netmonitor", "storage", EXTENSION];
+                             "performance", "memory", "netmonitor", "storage",
+                             "accessibility", EXTENSION];
 
 add_task(async function() {
   const extension = ExtensionTestUtils.loadExtension({
     manifest: {
       devtools_page: "extension.html",
       applications: {
         gecko: { id: EXTENSION },
       },
@@ -55,34 +56,35 @@ add_task(async function() {
     Services.prefs.setCharPref("devtools.toolbox.tabsOrder", originalPreference);
     win.resizeTo(originalWindowWidth, originalWindowHeight);
   });
 
   info("Test for DragAndDrop the extension tab");
   let dragTarget = EXTENSION;
   let dropTarget = "webconsole";
   let expectedOrder = ["inspector", EXTENSION, "webconsole", "jsdebugger", "styleeditor",
-                       "performance", "memory", "netmonitor", "storage"];
+                       "performance", "memory", "netmonitor", "storage", "accessibility"];
   prepareToolTabReorderTest(toolbox, TEST_STARTING_ORDER);
   await dndToolTab(toolbox, dragTarget, dropTarget);
   assertToolTabOrder(toolbox, expectedOrder);
   assertToolTabSelected(toolbox, dragTarget);
   assertToolTabPreferenceOrder(expectedOrder);
 
   info("Test the case of that the extension tab is overflowed");
   prepareToolTabReorderTest(toolbox, TEST_STARTING_ORDER);
   await resizeWindow(toolbox, 800);
   await toolbox.selectTool("storage");
   dragTarget = "storage";
   dropTarget = "inspector";
-  expectedOrder = ["storage", "inspector", "webconsole", "jsdebugger",
-                   "styleeditor", "performance", "memory", "netmonitor", EXTENSION];
+  expectedOrder = ["storage", "inspector", "webconsole", "jsdebugger", "styleeditor",
+                   "performance", "memory", "netmonitor", "accessibility", EXTENSION];
   await dndToolTab(toolbox, dragTarget, dropTarget);
   assertToolTabPreferenceOrder(expectedOrder);
 
   info("Test for saving the preference updated after destroying");
   await extension.unload();
   const target = gDevTools.getTargetForTab(tab);
   await gDevTools.closeToolbox(target);
   await target.destroy();
   assertToolTabPreferenceOrder(["storage", "inspector", "webconsole", "jsdebugger",
-                                "styleeditor", "performance", "memory", "netmonitor"]);
+                                "styleeditor", "performance", "memory", "netmonitor",
+                                "accessibility"]);
 });
--- a/devtools/client/framework/toolbox-process-window.js
+++ b/devtools/client/framework/toolbox-process-window.js
@@ -99,17 +99,16 @@ function setPrefDefaults() {
   Services.prefs.setBoolPref("browser.dom.window.dump.enabled", true);
   Services.prefs.setBoolPref("devtools.command-button-noautohide.enabled", true);
   // Bug 1225160 - Using source maps with browser debugging can lead to a crash
   Services.prefs.setBoolPref("devtools.debugger.source-maps-enabled", false);
   Services.prefs.setBoolPref("devtools.debugger.new-debugger-frontend", true);
   Services.prefs.setBoolPref("devtools.preference.new-panel-enabled", false);
   Services.prefs.setBoolPref("layout.css.emulate-moz-box-with-flex", false);
 
-  Services.prefs.setBoolPref("devtools.accessibility.enabled", true);
   Services.prefs.setBoolPref("devtools.performance.enabled", false);
 }
 
 window.addEventListener("load", async function() {
   const cmdClose = document.getElementById("toolbox-cmd-close");
   cmdClose.addEventListener("command", onCloseCommand);
   setPrefDefaults();
   // Reveal status message if connecting is slow or if an error occurs.
--- a/devtools/client/inspector/inspector.js
+++ b/devtools/client/inspector/inspector.js
@@ -1700,17 +1700,23 @@ Inspector.prototype = {
     }
 
     const showA11YPropsItem = new MenuItem({
       id: "node-menu-showaccessibilityproperties",
       label: INSPECTOR_L10N.getStr("inspectorShowAccessibilityProperties.label"),
       click: () => this.showAccessibilityProperties(),
       disabled: true
     });
-    this._updateA11YMenuItem(showA11YPropsItem);
+    // Only attempt to determine if a11y props menu item needs to be enabled iff
+    // AccessibilityFront is enabled.
+    const accessibilityFront = this.target.getFront("accessibility");
+    if (accessibilityFront.enabled) {
+      this._updateA11YMenuItem(showA11YPropsItem);
+    }
+
     menu.append(showA11YPropsItem);
   },
 
   _updateA11YMenuItem: async function(menuItem) {
     const hasMethod = await this.target.actorHasMethod("domwalker",
                                                        "hasAccessibilityProperties");
     if (!hasMethod) {
       return;
--- a/devtools/client/netmonitor/test/head.js
+++ b/devtools/client/netmonitor/test/head.js
@@ -349,19 +349,18 @@ function teardown(monitor) {
   info("Destroying the specified network monitor.");
 
   return (async function() {
     const tab = monitor.toolbox.target.tab;
 
     await waitForAllNetworkUpdateEvents();
     info("All pending requests finished.");
 
-    const onDestroyed = monitor.once("destroyed");
+    await monitor.toolbox.destroy();
     await removeTab(tab);
-    await onDestroyed;
   })();
 }
 
 function waitForNetworkEvents(monitor, getRequests) {
   return new Promise((resolve) => {
     const panel = monitor.panelWin;
     const { getNetworkRequest } = panel.connector;
     let networkEvent = 0;
--- a/devtools/client/preferences/devtools-client.js
+++ b/devtools/client/preferences/devtools-client.js
@@ -223,18 +223,18 @@ pref("devtools.canvasdebugger.enabled", 
 pref("devtools.webaudioeditor.enabled", false);
 
 // Enable Scratchpad
 pref("devtools.scratchpad.enabled", false);
 
 // Make sure the DOM panel is hidden by default
 pref("devtools.dom.enabled", false);
 
-// Make sure the Accessibility panel is hidden by default
-pref("devtools.accessibility.enabled", false);
+// Enable the Accessibility panel.
+pref("devtools.accessibility.enabled", true);
 // Counter to promote the Accessibility panel.
 // @remove after release 63 (See Bug 1482461)
 pref("devtools.promote.accessibility", 1);
 
 // Web Audio Editor Inspector Width should be a preference
 pref("devtools.webaudioeditor.inspectorWidth", 300);
 
 // Web console filters