Bug 1463128 - Refactor WebConsole and BrowserConsole to ES6 classes; r=bgrins.
authorNicolas Chevobbe <nchevobbe@mozilla.com>
Wed, 27 Feb 2019 10:05:51 +0000
changeset 519304 18f8a63e155a42914c3854a4ab85289c8051e2a3
parent 519303 4fdad5fe0c2f2d68977af7d866df10b17f622154
child 519305 441b5e03251699acc13c2a57a66e100d2ac66cd5
push id10862
push userffxbld-merge
push dateMon, 11 Mar 2019 13:01:11 +0000
treeherdermozilla-beta@a2e7f5c935da [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersbgrins
bugs1463128
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 1463128 - Refactor WebConsole and BrowserConsole to ES6 classes; r=bgrins. Doing this allows us to use native `extends` instead of the custom one. Differential Revision: https://phabricator.services.mozilla.com/D20679
devtools/client/webconsole/browser-console.js
devtools/client/webconsole/webconsole.js
--- a/devtools/client/webconsole/browser-console.js
+++ b/devtools/client/webconsole/browser-console.js
@@ -1,61 +1,59 @@
 /* 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 Services = require("Services");
-loader.lazyRequireGetter(this, "extend", "devtools/shared/extend", true);
+var WebConsole = require("devtools/client/webconsole/webconsole");
+
 loader.lazyRequireGetter(this, "Telemetry", "devtools/client/shared/telemetry");
-loader.lazyRequireGetter(this, "WebConsole", "devtools/client/webconsole/webconsole");
 
 /**
  * A BrowserConsole instance is an interactive console initialized *per target*
  * that displays console log data as well as provides an interactive terminal to
  * manipulate the target's document content.
  *
  * This object only wraps the iframe that holds the Browser Console UI. This is
  * meant to be an integration point between the Firefox UI and the Browser Console
  * UI and features.
  *
  * This object extends the WebConsole object located in webconsole.js
- *
- * @constructor
- * @param object target
- *        The target that the browser console will connect to.
- * @param nsIDOMWindow iframeWindow
- *        The window where the browser console UI is already loaded.
- * @param nsIDOMWindow chromeWindow
- *        The window of the browser console owner.
- * @param object hudService
- *        The parent HUD Service
  */
-function BrowserConsole(target, iframeWindow, chromeWindow, hudService) {
-  WebConsole.call(this, target, iframeWindow, chromeWindow, hudService);
-  this._telemetry = new Telemetry();
-}
+class BrowserConsole extends WebConsole {
+  /*
+  * @constructor
+  * @param object target
+  *        The target that the browser console will connect to.
+  * @param nsIDOMWindow iframeWindow
+  *        The window where the browser console UI is already loaded.
+  * @param nsIDOMWindow chromeWindow
+  *        The window of the browser console owner.
+  * @param object hudService
+  *        The parent HUD Service
+  */
+  constructor(target, iframeWindow, chromeWindow, hudService) {
+    super(target, iframeWindow, chromeWindow, hudService, true);
 
-BrowserConsole.prototype = extend(WebConsole.prototype, {
-  _browserConsole: true,
-  _bcInit: null,
-  _bcDestroyer: null,
-
-  $init: WebConsole.prototype.init,
+    this._telemetry = new Telemetry();
+    this._bcInitializer = null;
+    this._bcDestroyer = null;
+  }
 
   /**
    * Initialize the Browser Console instance.
    *
    * @return object
    *         A promise for the initialization.
    */
   init() {
-    if (this._bcInit) {
-      return this._bcInit;
+    if (this._bcInitializer) {
+      return this._bcInitializer;
     }
 
     // Only add the shutdown observer if we've opened a Browser Console window.
     ShutdownObserver.init(this.hudService);
 
     const window = this.iframeWindow;
 
     // Make sure that the closing of the Browser Console window destroys this
@@ -63,21 +61,19 @@ BrowserConsole.prototype = extend(WebCon
     window.addEventListener("unload", () => {
       this.destroy();
     }, {once: true});
 
     // browserconsole is not connected with a toolbox so we pass -1 as the
     // toolbox session id.
     this._telemetry.toolOpened("browserconsole", -1, this);
 
-    this._bcInit = this.$init();
-    return this._bcInit;
-  },
-
-  $destroy: WebConsole.prototype.destroy,
+    this._bcInitializer = super.init();
+    return this._bcInitializer;
+  }
 
   /**
    * Destroy the object.
    *
    * @return object
    *         A promise object that is resolved once the Browser Console is closed.
    */
   destroy() {
@@ -85,25 +81,25 @@ BrowserConsole.prototype = extend(WebCon
       return this._bcDestroyer;
     }
 
     this._bcDestroyer = (async () => {
       // browserconsole is not connected with a toolbox so we pass -1 as the
       // toolbox session id.
       this._telemetry.toolClosed("browserconsole", -1, this);
 
-      await this.$destroy();
+      await super.destroy();
       await this.target.destroy();
       this.hudService._browserConsoleID = null;
       this.chromeWindow.close();
     })();
 
     return this._bcDestroyer;
-  },
-});
+  }
+}
 
 /**
  * The ShutdownObserver listens for app shutdown and saves the current state
  * of the Browser Console for session restore.
  */
 var ShutdownObserver = {
   _initialized: false,
 
--- a/devtools/client/webconsole/webconsole.js
+++ b/devtools/client/webconsole/webconsole.js
@@ -16,138 +16,133 @@ var gHudId = 0;
 /**
  * A WebConsole instance is an interactive console initialized *per target*
  * that displays console log data as well as provides an interactive terminal to
  * manipulate the target's document content.
  *
  * This object only wraps the iframe that holds the Web Console UI. This is
  * meant to be an integration point between the Firefox UI and the Web Console
  * UI and features.
- *
- * @constructor
- * @param object target
- *        The target that the web console will connect to.
- * @param nsIDOMWindow iframeWindow
- *        The window where the web console UI is already loaded.
- * @param nsIDOMWindow chromeWindow
- *        The window of the web console owner.
- * @param object hudService
- *        The parent HUD Service
  */
-function WebConsole(target, iframeWindow, chromeWindow, hudService) {
-  this.iframeWindow = iframeWindow;
-  this.chromeWindow = chromeWindow;
-  this.hudId = "hud_" + ++gHudId;
-  this.target = target;
-  this.browserWindow = this.chromeWindow.top;
-  this.hudService = hudService;
+class WebConsole {
+  /*
+  * @constructor
+  * @param object target
+  *        The target that the web console will connect to.
+  * @param nsIDOMWindow iframeWindow
+  *        The window where the web console UI is already loaded.
+  * @param nsIDOMWindow chromeWindow
+  *        The window of the web console owner.
+  * @param object hudService
+  *        The parent HUD Service
+  * @param bool isBrowserConsole
+  */
+  constructor(target, iframeWindow, chromeWindow, hudService, isBrowserConsole = false) {
+    this.iframeWindow = iframeWindow;
+    this.chromeWindow = chromeWindow;
+    this.hudId = "hud_" + ++gHudId;
+    this.target = target;
+    this.browserWindow = this.chromeWindow.top;
+    this.hudService = hudService;
+    this._browserConsole = isBrowserConsole;
 
-  const element = this.browserWindow.document.documentElement;
-  if (element.getAttribute("windowtype") != gDevTools.chromeWindowType) {
-    this.browserWindow = this.hudService.currentContext();
+    const element = this.browserWindow.document.documentElement;
+    if (element.getAttribute("windowtype") != gDevTools.chromeWindowType) {
+      this.browserWindow = this.hudService.currentContext();
+    }
+    this.ui = new WebConsoleUI(this);
+    this._destroyer = null;
   }
-  this.ui = new WebConsoleUI(this);
-}
-
-WebConsole.prototype = {
-  iframeWindow: null,
-  chromeWindow: null,
-  browserWindow: null,
-  hudId: null,
-  target: null,
-  ui: null,
-  _browserConsole: false,
-  _destroyer: null,
 
   /**
    * Getter for a function to to listen for every request that completes. Used
    * by unit tests. The callback takes one argument: the HTTP activity object as
    * received from the remote Web Console.
    *
    * @type function
    */
   get lastFinishedRequestCallback() {
     return this.hudService.lastFinishedRequest.callback;
-  },
+  }
 
   /**
    * Getter for the window that can provide various utilities that the web
    * console makes use of, like opening links, managing popups, etc.  In
    * most cases, this will be |this.browserWindow|, but in some uses (such as
    * the Browser Toolbox), there is no browser window, so an alternative window
    * hosts the utilities there.
    * @type nsIDOMWindow
    */
   get chromeUtilsWindow() {
     if (this.browserWindow) {
       return this.browserWindow;
     }
     return this.chromeWindow.top;
-  },
+  }
 
   /**
    * Getter for the output element that holds messages we display.
    * @type Element
    */
   get outputNode() {
     return this.ui ? this.ui.outputNode : null;
-  },
+  }
 
   get gViewSourceUtils() {
     return this.chromeUtilsWindow.gViewSourceUtils;
-  },
+  }
 
   /**
    * Initialize the Web Console instance.
    *
    * @return object
    *         A promise for the initialization.
    */
   init() {
     return this.ui.init().then(() => this);
-  },
+  }
 
   /**
    * The JSTerm object that manages the console's input.
    * @see webconsole.js::JSTerm
    * @type object
    */
   get jsterm() {
     return this.ui ? this.ui.jsterm : null;
-  },
+  }
 
   /**
    * Alias for the WebConsoleUI.setFilterState() method.
    * @see webconsole.js::WebConsoleUI.setFilterState()
    */
   setFilterState() {
     this.ui && this.ui.setFilterState.apply(this.ui, arguments);
-  },
+  }
 
   /**
    * Open a link in a new tab.
    *
    * @param string link
    *        The URL you want to open in a new tab.
    */
   openLink(link, e) {
     openDocLink(link);
-  },
+  }
 
   /**
    * Open a link in Firefox's view source.
    *
    * @param string sourceURL
    *        The URL of the file.
    * @param integer sourceLine
    *        The line number which should be highlighted.
    */
   viewSource(sourceURL, sourceLine) {
     this.gViewSourceUtils.viewSource({ URL: sourceURL, lineNumber: sourceLine || 0 });
-  },
+  }
 
   /**
    * Tries to open a Stylesheet file related to the web page for the web console
    * instance in the Style Editor. If the file is not found, it is opened in
    * source view instead.
    *
    * Manually handle the case where toolbox does not exist (Browser Console).
    *
@@ -158,17 +153,17 @@ WebConsole.prototype = {
    */
   viewSourceInStyleEditor(sourceURL, sourceLine) {
     const toolbox = gDevTools.getToolbox(this.target);
     if (!toolbox) {
       this.viewSource(sourceURL, sourceLine);
       return;
     }
     toolbox.viewSourceInStyleEditor(sourceURL, sourceLine);
-  },
+  }
 
   /**
    * Tries to open a JavaScript file related to the web page for the web console
    * instance in the Script Debugger. If the file is not found, it is opened in
    * source view instead.
    *
    * Manually handle the case where toolbox does not exist (Browser Console).
    *
@@ -181,28 +176,28 @@ WebConsole.prototype = {
     const toolbox = gDevTools.getToolbox(this.target);
     if (!toolbox) {
       this.viewSource(sourceURL, sourceLine);
       return;
     }
     toolbox.viewSourceInDebugger(sourceURL, sourceLine).then(() => {
       this.ui.emit("source-in-debugger-opened");
     });
-  },
+  }
 
   /**
    * Tries to open a JavaScript file related to the web page for the web console
    * instance in the corresponding Scratchpad.
    *
    * @param string sourceURL
    *        The URL of the file which corresponds to a Scratchpad id.
    */
   viewSourceInScratchpad(sourceURL, sourceLine) {
     viewSource.viewSourceInScratchpad(sourceURL, sourceLine);
-  },
+  }
 
   /**
    * Retrieve information about the JavaScript debugger's stackframes list. This
    * is used to allow the Web Console to evaluate code in the selected
    * stackframe.
    *
    * @return object|null
    *         An object which holds:
@@ -219,17 +214,17 @@ WebConsole.prototype = {
     }
     const panel = toolbox.getPanel("jsdebugger");
 
     if (!panel) {
       return null;
     }
 
     return panel.getFrames();
-  },
+  }
 
   /**
    * Given an expression, returns an object containing a new expression, mapped by the
    * parser worker to provide additional feature for the user (top-level await,
    * original languages mapping, …).
    *
    * @param {String} expression: The input to maybe map.
    * @returns {Object|null}
@@ -256,34 +251,34 @@ WebConsole.prototype = {
       const shouldMapBindings = false;
       const shouldMapAwait = true;
       const res = this.parserService.mapExpression(
         expression, null, null, shouldMapBindings, shouldMapAwait);
       return res;
     }
 
     return null;
-  },
+  }
 
   /**
    * A common access point for the client-side parser service that any panel can use.
    */
   get parserService() {
     if (this._parserService) {
       return this._parserService;
     }
 
     this._parserService =
       require("devtools/client/debugger/new/src/workers/parser/index");
 
     this._parserService.start(
       "resource://devtools/client/debugger/new/dist/parser-worker.js",
       this.chromeUtilsWindow);
     return this._parserService;
-  },
+  }
 
   /**
    * Retrieves the current selection from the Inspector, if such a selection
    * exists. This is used to pass the ID of the selected actor to the Web
    * Console server for the $0 helper.
    *
    * @return object|null
    *         A Selection referring to the currently selected node in the
@@ -296,17 +291,17 @@ WebConsole.prototype = {
     if (!toolbox) {
       return null;
     }
     const panel = toolbox.getPanel("inspector");
     if (!panel || !panel.selection) {
       return null;
     }
     return panel.selection;
-  },
+  }
 
   /**
    * Destroy the object. Call this method to avoid memory leaks when the Web
    * Console is closed.
    *
    * @return object
    *         A promise object that is resolved once the Web Console is closed.
    */
@@ -335,12 +330,12 @@ WebConsole.prototype = {
         this._parserService = null;
       }
 
       const id = Utils.supportsString(this.hudId);
       Services.obs.notifyObservers(id, "web-console-destroyed");
     })();
 
     return this._destroyer;
-  },
-};
+  }
+}
 
 module.exports = WebConsole;