Bug 1382601 - update inspector to use new event emitter. r=pbro
authoryulia <ystartsev@mozilla.com>
Fri, 16 Mar 2018 14:27:46 +0100
changeset 409004 c37ee39efce7a318de366e9c2736ca4951e091cd
parent 409003 9f37df3c62e1c821d646cde969a278357741ba2b
child 409005 b0b5718ec0708b8c843b6d444f9857d2a0fb7621
push id33671
push usercsabou@mozilla.com
push dateTue, 20 Mar 2018 22:23:32 +0000
treeherdermozilla-central@e2e874ceae78 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerspbro
bugs1382601
milestone61.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 1382601 - update inspector to use new event emitter. r=pbro MozReview-Commit-ID: 8hGCpkC1eHz
devtools/client/inspector/boxmodel/test/head.js
devtools/client/inspector/breadcrumbs.js
devtools/client/inspector/inspector-search.js
devtools/client/inspector/inspector.js
devtools/client/inspector/markup/markup.js
devtools/client/inspector/markup/test/browser_markup_accessibility_navigation.js
devtools/client/inspector/markup/test/browser_markup_mutation_01.js
devtools/client/inspector/markup/views/element-editor.js
devtools/client/inspector/rules/test/head.js
devtools/client/inspector/rules/views/class-list-previewer.js
devtools/client/inspector/shared/dom-node-preview.js
devtools/client/inspector/shared/highlighters-overlay.js
devtools/client/inspector/toolsidebar.js
--- a/devtools/client/inspector/boxmodel/test/head.js
+++ b/devtools/client/inspector/boxmodel/test/head.js
@@ -51,17 +51,17 @@ function isNodeVisible(node) {
  * @param  {InspectorPanel} inspector
  *         The instance of InspectorPanel currently loaded in the toolbox.
  * @param  {Boolean} waitForSelectionUpdate
  *         Should the boxmodel-view-updated event come from a new selection.
  * @return {Promise} a promise
  */
 function waitForUpdate(inspector, waitForSelectionUpdate) {
   return new Promise(resolve => {
-    inspector.on("boxmodel-view-updated", function onUpdate(e, reasons) {
+    inspector.on("boxmodel-view-updated", function onUpdate(reasons) {
       // Wait for another update event if we are waiting for a selection related event.
       if (waitForSelectionUpdate && !reasons.includes("new-selection")) {
         return;
       }
 
       inspector.off("boxmodel-view-updated", onUpdate);
       resolve();
     });
--- a/devtools/client/inspector/breadcrumbs.js
+++ b/devtools/client/inspector/breadcrumbs.js
@@ -10,17 +10,17 @@ const promise = require("promise");
 
 const {ELLIPSIS} = require("devtools/shared/l10n");
 
 const MAX_LABEL_LENGTH = 40;
 
 const NS_XHTML = "http://www.w3.org/1999/xhtml";
 const SCROLL_REPEAT_MS = 100;
 
-const EventEmitter = require("devtools/shared/old-event-emitter");
+const EventEmitter = require("devtools/shared/event-emitter");
 const KeyShortcuts = require("devtools/client/shared/key-shortcuts");
 
 // Some margin may be required for visible element detection.
 const SCROLL_MARGIN = 1;
 
 /**
  * Component to replicate functionality of XUL arrowscrollbox
  * for breadcrumbs
@@ -396,21 +396,22 @@ HTMLBreadcrumbs.prototype = {
 
     // Last selected node in nodeHierarchy.
     this.currentIndex = -1;
 
     // Used to build a unique breadcrumb button Id.
     this.breadcrumbsWidgetItemId = 0;
 
     this.update = this.update.bind(this);
+    this.updateWithMutations = this.updateWithMutations.bind(this);
     this.updateSelectors = this.updateSelectors.bind(this);
     this.selection.on("new-node-front", this.update);
     this.selection.on("pseudoclass", this.updateSelectors);
     this.selection.on("attribute-changed", this.updateSelectors);
-    this.inspector.on("markupmutation", this.update);
+    this.inspector.on("markupmutation", this.updateWithMutations);
     this.update();
   },
 
   /**
 
    * Build a string that represents the node: tagName#id.class1.class2.
    * @param {NodeFront} node The node to pretty-print
    * @return {String}
@@ -607,17 +608,17 @@ HTMLBreadcrumbs.prototype = {
 
   /**
    * Remove nodes and clean up.
    */
   destroy: function() {
     this.selection.off("new-node-front", this.update);
     this.selection.off("pseudoclass", this.updateSelectors);
     this.selection.off("attribute-changed", this.updateSelectors);
-    this.inspector.off("markupmutation", this.update);
+    this.inspector.off("markupmutation", this.updateWithMutations);
 
     this.container.removeEventListener("click", this, true);
     this.container.removeEventListener("mouseover", this, true);
     this.container.removeEventListener("mouseout", this, true);
     this.container.removeEventListener("focus", this, true);
     this.shortcuts.destroy();
 
     this.empty();
@@ -825,16 +826,26 @@ HTMLBreadcrumbs.prototype = {
     }
 
     // Catch all return in case the mutations array was empty, or in case none
     // of the changes iterated above were interesting.
     return false;
   },
 
   /**
+   * Update the breadcrumbs display when a new node is selected and there are
+   * mutations.
+   * @param {Array} mutations An array of mutations in case this was called as
+   * the "markupmutation" event listener.
+   */
+  updateWithMutations(mutations) {
+    return this.update("markupmutation", mutations);
+  },
+
+  /**
    * Update the breadcrumbs display when a new node is selected.
    * @param {String} reason The reason for the update, if any.
    * @param {Array} mutations An array of mutations in case this was called as
    * the "markupmutation" event listener.
    */
   update: function(reason, mutations) {
     if (this.isDestroyed) {
       return;
--- a/devtools/client/inspector/inspector-search.js
+++ b/devtools/client/inspector/inspector-search.js
@@ -3,17 +3,17 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 "use strict";
 
 const promise = require("promise");
 const {Task} = require("devtools/shared/task");
 const {KeyCodes} = require("devtools/client/shared/keycodes");
 
-const EventEmitter = require("devtools/shared/old-event-emitter");
+const EventEmitter = require("devtools/shared/event-emitter");
 const AutocompletePopup = require("devtools/client/shared/autocomplete-popup");
 const Services = require("Services");
 
 // Maximum number of selector suggestions shown in the panel.
 const MAX_SUGGESTIONS = 15;
 
 /**
  * Converts any input field into a document search box.
--- a/devtools/client/inspector/inspector.js
+++ b/devtools/client/inspector/inspector.js
@@ -5,17 +5,17 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 /* global window, BrowserLoader */
 
 "use strict";
 
 const Services = require("Services");
 const promise = require("promise");
-const EventEmitter = require("devtools/shared/old-event-emitter");
+const EventEmitter = require("devtools/shared/event-emitter");
 const {executeSoon} = require("devtools/shared/DevToolsUtils");
 const {Task} = require("devtools/shared/task");
 const {PrefObserver} = require("devtools/client/shared/prefs");
 const Telemetry = require("devtools/client/shared/telemetry");
 const HighlightersOverlay = require("devtools/client/inspector/shared/highlighters-overlay");
 const ReflowTracker = require("devtools/client/inspector/shared/reflow-tracker");
 const Store = require("devtools/client/inspector/store");
 
@@ -118,16 +118,17 @@ function Inspector(toolbox) {
 
   this.nodeMenuTriggerInfo = null;
 
   this._handleRejectionIfNotDestroyed = this._handleRejectionIfNotDestroyed.bind(this);
   this._onContextMenu = this._onContextMenu.bind(this);
   this._onBeforeNavigate = this._onBeforeNavigate.bind(this);
   this._onMarkupFrameLoad = this._onMarkupFrameLoad.bind(this);
   this._updateSearchResultsLabel = this._updateSearchResultsLabel.bind(this);
+  this._clearSearchResultsLabel = this._clearSearchResultsLabel.bind(this);
 
   this.onDetached = this.onDetached.bind(this);
   this.onMarkupLoaded = this.onMarkupLoaded.bind(this);
   this.onNewSelection = this.onNewSelection.bind(this);
   this.onNewRoot = this.onNewRoot.bind(this);
   this.onPanelWindowResize = this.onPanelWindowResize.bind(this);
   this.onShowBoxModelHighlighterForNode =
     this.onShowBoxModelHighlighterForNode.bind(this);
@@ -378,17 +379,17 @@ Inspector.prototype = {
    * Hooks the searchbar to show result and auto completion suggestions.
    */
   setupSearchBox: function() {
     this.searchBox = this.panelDoc.getElementById("inspector-searchbox");
     this.searchClearButton = this.panelDoc.getElementById("inspector-searchinput-clear");
     this.searchResultsLabel = this.panelDoc.getElementById("inspector-searchlabel");
 
     this.search = new InspectorSearch(this, this.searchBox, this.searchClearButton);
-    this.search.on("search-cleared", this._updateSearchResultsLabel);
+    this.search.on("search-cleared", this._clearSearchResultsLabel);
     this.search.on("search-result", this._updateSearchResultsLabel);
 
     let shortcuts = new KeyShortcuts({
       window: this.panelDoc.defaultView,
     });
     let key = INSPECTOR_L10N.getStr("inspector.searchHTML.key");
     shortcuts.on(key, event => {
       // Prevent overriding same shortcut from the computed/rule views
@@ -400,19 +401,23 @@ Inspector.prototype = {
       this.searchBox.focus();
     });
   },
 
   get searchSuggestions() {
     return this.search.autocompleter;
   },
 
-  _updateSearchResultsLabel: function(event, result) {
+  _clearSearchResultsLabel: function(result) {
+    return this._updateSearchResultsLabel(result, true);
+  },
+
+  _updateSearchResultsLabel: function(result, clear = false) {
     let str = "";
-    if (event !== "search-cleared") {
+    if (!clear) {
       if (result) {
         str = INSPECTOR_L10N.getFormatStr(
           "inspector.searchResultsCount2", result.resultsIndex + 1, result.resultsLength);
       } else {
         str = INSPECTOR_L10N.getStr("inspector.searchResultsNone");
       }
     }
 
@@ -554,17 +559,17 @@ Inspector.prototype = {
     Services.prefs.setIntPref("devtools.toolsidebar-width.inspector.splitsidebar",
       this.sidebarSplitBox.state.width);
   },
 
   onSidebarResized: function(width, height) {
     this.toolbox.emit("inspector-sidebar-resized", { width, height });
   },
 
-  onSidebarSelect: function(event, toolId) {
+  onSidebarSelect: function(toolId) {
     // Save the currently selected sidebar panel
     Services.prefs.setCharPref("devtools.inspector.activeSidebar", toolId);
 
     // Then forces the panel creation by calling getPanel
     // (This allows lazy loading the panels only once we select them)
     this.getPanel(toolId);
 
     this.toolbox.emit("inspector-sidebar-select", toolId);
--- a/devtools/client/inspector/markup/markup.js
+++ b/devtools/client/inspector/markup/markup.js
@@ -1278,17 +1278,17 @@ MarkupView.prototype = {
     this.cancelReselectOnRemoved();
 
     // Get the removedNode index in its parent node to reselect the right node.
     let isHTMLTag = removedNode.tagName.toLowerCase() === "html";
     let oldContainer = this.getContainer(removedNode);
     let parentContainer = this.getContainer(removedNode.parentNode());
     let childIndex = parentContainer.getChildContainers().indexOf(oldContainer);
 
-    let onMutations = this._removedNodeObserver = (e, mutations) => {
+    let onMutations = this._removedNodeObserver = mutations => {
       let isNodeRemovalMutation = false;
       for (let mutation of mutations) {
         let containsRemovedNode = mutation.removed &&
                                   mutation.removed.some(n => n === removedNode);
         if (mutation.type === "childList" &&
             (containsRemovedNode || isHTMLTag)) {
           isNodeRemovalMutation = true;
           break;
--- a/devtools/client/inspector/markup/test/browser_markup_accessibility_navigation.js
+++ b/devtools/client/inspector/markup/test/browser_markup_accessibility_navigation.js
@@ -267,11 +267,11 @@ add_task(function* () {
   for (let testData of TESTS) {
     yield runAccessibilityNavigationTest(inspector, elms, testData);
   }
 
   elms = null;
 });
 
 // Record all containers that are created dynamically into elms object.
-function memorizeContainer(event, container) {
+function memorizeContainer(container) {
   elms[`container-${containerID++}`] = container;
 }
--- a/devtools/client/inspector/markup/test/browser_markup_mutation_01.js
+++ b/devtools/client/inspector/markup/test/browser_markup_mutation_01.js
@@ -314,17 +314,17 @@ add_task(function* () {
     numMutations = numMutations || 1;
 
     info("Executing the test markup mutation");
 
     // If a test expects more than one mutation it may come through in a single
     // event or possibly in multiples.
     let seenMutations = 0;
     let promise = new Promise(resolve => {
-      inspector.on("markupmutation", function onmutation(e, mutations) {
+      inspector.on("markupmutation", function onmutation(mutations) {
         seenMutations += mutations.length;
         info("Receieved " + seenMutations +
              " mutations, expecting at least " + numMutations);
         if (seenMutations >= numMutations) {
           inspector.off("markupmutation", onmutation);
           resolve();
         }
       });
--- a/devtools/client/inspector/markup/views/element-editor.js
+++ b/devtools/client/inspector/markup/views/element-editor.js
@@ -542,17 +542,17 @@ ElementEditor.prototype = {
     }
 
     let container = this.markup.getContainer(this.node);
 
     let activeAttrs = [...this.attrList.childNodes]
       .filter(el => el.style.display != "none");
     let attributeIndex = activeAttrs.indexOf(attrNode);
 
-    let onMutations = this._editedAttributeObserver = (e, mutations) => {
+    let onMutations = this._editedAttributeObserver = mutations => {
       let isDeletedAttribute = false;
       let isNewAttribute = false;
 
       for (let mutation of mutations) {
         let inContainer =
           this.markup.getContainer(mutation.target) === container;
         if (!inContainer) {
           continue;
--- a/devtools/client/inspector/rules/test/head.js
+++ b/devtools/client/inspector/rules/test/head.js
@@ -473,17 +473,17 @@ function* sendKeysAndWaitForFocus(view, 
 
 /**
  * Wait for a markupmutation event on the inspector that is for a style modification.
  * @param {InspectorPanel} inspector
  * @return {Promise}
  */
 function waitForStyleModification(inspector) {
   return new Promise(function(resolve) {
-    function checkForStyleModification(name, mutations) {
+    function checkForStyleModification(mutations) {
       for (let mutation of mutations) {
         if (mutation.type === "attributes" && mutation.attributeName === "style") {
           inspector.off("markupmutation", checkForStyleModification);
           resolve();
           return;
         }
       }
     }
--- a/devtools/client/inspector/rules/views/class-list-previewer.js
+++ b/devtools/client/inspector/rules/views/class-list-previewer.js
@@ -164,17 +164,17 @@ ClassListPreviewerModel.prototype = {
     };
 
     // Apply the change to the node.
     let mod = this.currentNode.startModifyingAttributes();
     mod.setAttribute("class", this.currentClassesPreview);
     return mod.apply();
   },
 
-  onMutations(e, mutations) {
+  onMutations(mutations) {
     for (let {type, target, attributeName} of mutations) {
       // Only care if this mutation is for the class attribute.
       if (type !== "attributes" || attributeName !== "class") {
         continue;
       }
 
       let isMutationForOurChange = this.lastStateChange &&
                                    target === this.lastStateChange.node &&
--- a/devtools/client/inspector/shared/dom-node-preview.js
+++ b/devtools/client/inspector/shared/dom-node-preview.js
@@ -256,17 +256,17 @@ DomNodePreview.prototype = {
   },
 
   onHighlighterLocked: function(domNodePreview) {
     if (domNodePreview !== this) {
       this.highlightNodeEl.classList.remove("selected");
     }
   },
 
-  onMarkupMutations: function(e, mutations) {
+  onMarkupMutations: function(mutations) {
     if (!this.nodeFront) {
       return;
     }
 
     for (let {target} of mutations) {
       if (target === this.nodeFront) {
         // Re-render with the same nodeFront to update the output.
         this.render(this.nodeFront);
--- a/devtools/client/inspector/shared/highlighters-overlay.js
+++ b/devtools/client/inspector/shared/highlighters-overlay.js
@@ -856,17 +856,17 @@ class HighlightersOverlay {
     this._lastHovered = null;
     this._hideHoveredHighlighter();
   }
 
   /**
    * Handler function for "markupmutation" events. Hides the flexbox/grid/shapes
    * highlighter if the flexbox/grid/shapes container is no longer in the DOM tree.
    */
-  async onMarkupMutation(evt, mutations) {
+  async onMarkupMutation(mutations) {
     let hasInterestingMutation = mutations.some(mut => mut.type === "childList");
     if (!hasInterestingMutation) {
       // Bail out if the mutations did not remove nodes, or if no grid highlighter is
       // displayed.
       return;
     }
 
     this._hideHighlighterIfDeadNode(this.flexboxHighlighterShown,
--- a/devtools/client/inspector/toolsidebar.js
+++ b/devtools/client/inspector/toolsidebar.js
@@ -1,17 +1,17 @@
 /* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
 /* vim: set ft=javascript ts=2 et sw=2 tw=80: */
 /* 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";
 
-var EventEmitter = require("devtools/shared/old-event-emitter");
+var EventEmitter = require("devtools/shared/event-emitter");
 var Telemetry = require("devtools/client/shared/telemetry");
 var { Task } = require("devtools/shared/task");
 
 /**
  * This object represents replacement for ToolSidebar
  * implemented in devtools/client/framework/sidebar.js module
  *
  * This new component is part of devtools.html aimed at