Bug 1405585 - Add telemetry to track inspector refresh time when reload a page. r=jdescottes datareview=francois draft
authorAlexandre Poirot <poirot.alex@gmail.com>
Wed, 18 Oct 2017 14:41:07 -0700
changeset 686813 a9bf021d4ec66f40bfc28d30aa6281c12bd38d74
parent 686801 0d1e55d87931fe70ec1d007e886bcd58015ff770
child 686814 3cdc5c0317067f1a3a090e2e30b51acee184f437
push id86300
push userbmo:poirot.alex@gmail.com
push dateThu, 26 Oct 2017 13:00:03 +0000
reviewersjdescottes
bugs1405585
milestone58.0a1
Bug 1405585 - Add telemetry to track inspector refresh time when reload a page. r=jdescottes datareview=francois MozReview-Commit-ID: BetryDSSRC2
devtools/client/framework/toolbox.js
devtools/client/inspector/inspector.js
toolkit/components/telemetry/Histograms.json
--- a/devtools/client/framework/toolbox.js
+++ b/devtools/client/framework/toolbox.js
@@ -109,16 +109,17 @@ function Toolbox(target, selectedTool, h
   this._styleSheets = null;
 
   // Map of frames (id => frame-info) and currently selected frame id.
   this.frameMap = new Map();
   this.selectedFrameId = null;
 
   this._toolRegistered = this._toolRegistered.bind(this);
   this._toolUnregistered = this._toolUnregistered.bind(this);
+  this._onWillNavigate = this._onWillNavigate.bind(this);
   this._refreshHostTitle = this._refreshHostTitle.bind(this);
   this._toggleNoAutohide = this._toggleNoAutohide.bind(this);
   this.showFramesMenu = this.showFramesMenu.bind(this);
   this.handleKeyDownOnFramesButton = this.handleKeyDownOnFramesButton.bind(this);
   this.showFramesMenuOnKeyDown = this.showFramesMenuOnKeyDown.bind(this);
   this._updateFrames = this._updateFrames.bind(this);
   this._splitConsoleOnKeypress = this._splitConsoleOnKeypress.bind(this);
   this.destroy = this.destroy.bind(this);
@@ -158,16 +159,17 @@ function Toolbox(target, selectedTool, h
 
   this._hostType = hostType;
 
   this._isOpenDeferred = defer();
   this.isOpen = this._isOpenDeferred.promise;
 
   EventEmitter.decorate(this);
 
+  this._target.on("will-navigate", this._onWillNavigate);
   this._target.on("navigate", this._refreshHostTitle);
   this._target.on("frame-update", this._updateFrames);
   this._target.on("inspect-object", this._onInspectObject);
 
   this.on("host-changed", this._refreshHostTitle);
   this.on("select", this._refreshHostTitle);
 
   this.on("ready", this._showDevEditionPromo);
@@ -1978,16 +1980,40 @@ Toolbox.prototype = {
    */
   raise: function () {
     this.postMessage({
       name: "raise-host"
     });
   },
 
   /**
+   * Fired when user just started navigating away to another web page.
+   */
+  async _onWillNavigate() {
+    let toolId = this.currentToolId;
+    // For now, only inspector fires "reloaded" event
+    if (toolId != "inspector") {
+      return;
+    }
+
+    let start = this.win.performance.now();
+    let panel = this.getPanel(toolId);
+    // Ignore the timing if the panel is still loading
+    if (!panel) {
+      return;
+    }
+    await panel.once("reloaded");
+    let delay = this.win.performance.now() - start;
+
+    let telemetryKey = "DEVTOOLS_TOOLBOX_PAGE_RELOAD_DELAY_MS";
+    let histogram = Services.telemetry.getKeyedHistogramById(telemetryKey);
+    histogram.add(toolId, delay);
+  },
+
+  /**
    * Refresh the host's title.
    */
   _refreshHostTitle: function () {
     let title;
     if (this.target.name && this.target.name != this.target.url) {
       const url = this.target.isWebExtension ?
                   this.target.getExtensionPathName(this.target.url) : this.target.url;
       title = L10N.getFormatStr("toolbox.titleTemplate2", this.target.name,
@@ -2550,16 +2576,17 @@ Toolbox.prototype = {
       return this._destroyer;
     }
     let deferred = defer();
     this._destroyer = deferred.promise;
 
     this.emit("destroy");
 
     this._target.off("inspect-object", this._onInspectObject);
+    this._target.off("will-navigate", this._onWillNavigate);
     this._target.off("navigate", this._refreshHostTitle);
     this._target.off("frame-update", this._updateFrames);
     this.off("select", this._refreshHostTitle);
     this.off("host-changed", this._refreshHostTitle);
     this.off("ready", this._showDevEditionPromo);
 
     gDevTools.off("tool-registered", this._toolRegistered);
     gDevTools.off("tool-unregistered", this._toolUnregistered);
--- a/devtools/client/inspector/inspector.js
+++ b/devtools/client/inspector/inspector.js
@@ -878,25 +878,33 @@ Inspector.prototype = {
    * view is initialized. Expands the current selected node and restores the saved
    * highlighter state.
    */
   onMarkupLoaded: Task.async(function* () {
     if (!this.markup) {
       return;
     }
 
-    this.markup.expandNode(this.selection.nodeFront);
+    let onExpand = this.markup.expandNode(this.selection.nodeFront);
 
     // Restore the highlighter states prior to emitting "new-root".
     yield Promise.all([
       this.highlighters.restoreGridState(),
       this.highlighters.restoreShapeState()
     ]);
 
     this.emit("new-root");
+
+    // Wait for full expand of the selected node in order to ensure
+    // the markup view is fully emitted before firing 'reloaded'.
+    // 'reloaded' is used to know when the panel is fully updated
+    // after a page reload.
+    yield onExpand;
+
+    this.emit("reloaded");
   }),
 
   _selectionCssSelector: null,
 
   /**
    * Set the currently selected node unique css selector.
    * Will store the current target url along with it to allow pre-selection at
    * reload
--- a/toolkit/components/telemetry/Histograms.json
+++ b/toolkit/components/telemetry/Histograms.json
@@ -8430,16 +8430,27 @@
     "bug_numbers": [1405584],
     "expires_in_version": "62",
     "kind": "exponential",
     "high": 60000,
     "n_buckets": 100,
     "keyed": true,
     "description": "Time taken (in ms) to open all but first DevTools toolbox. This is keyed by tool ID being opened [inspector, webconsole, jsdebugger, styleeditor, shadereditor, canvasdebugger, performance, memory, netmonitor, storage, webaudioeditor, scratchpad, dom]."
   },
+  "DEVTOOLS_TOOLBOX_PAGE_RELOAD_DELAY_MS": {
+    "record_in_processes": ["main"],
+    "alert_emails": ["dev-developer-tools@lists.mozilla.org", "hkirschner@mozilla.com"],
+    "bug_numbers": [1405585],
+    "expires_in_version": "62",
+    "kind": "exponential",
+    "high": 120000,
+    "n_buckets": 100,
+    "keyed": true,
+    "description": "Time taken (in ms) to update DevTools panel when reloading a page. This is keyed by tool ID being currently opened [inspector, webconsole, jsdebugger, styleeditor, shadereditor, canvasdebugger, performance, memory, netmonitor, storage, webaudioeditor, scratchpad, dom]."
+  },
   "DEVTOOLS_DEBUGGER_DISPLAY_SOURCE_LOCAL_MS": {
     "record_in_processes": ["main", "content"],
     "expires_in_version": "never",
     "kind": "exponential",
     "high": 10000,
     "n_buckets": 1000,
     "description": "The time (in milliseconds) that it took to display a selected source to the user."
   },