Bug 1340464 - PART 1: wrap init process into bootstrap function;r=Honza
authorFred Lin <gasolin@mozilla.com>
Wed, 22 Feb 2017 13:26:19 +0800
changeset 374522 44fc24be2928d4975a054db66281689a1e47ee83
parent 374521 2e877886c769b49574a6af5ceeac16ccbc50d4cb
child 374523 9703c14de85386497b3af5c514b48768b3a8e5c4
push id10863
push userjlorenzo@mozilla.com
push dateMon, 06 Mar 2017 23:02:23 +0000
treeherdermozilla-aurora@0931190cd725 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersHonza
bugs1340464
milestone54.0a1
Bug 1340464 - PART 1: wrap init process into bootstrap function;r=Honza MozReview-Commit-ID: 53z2XDkEiVv
devtools/client/netmonitor/components/network-monitor.js
devtools/client/netmonitor/netmonitor-controller.js
devtools/client/netmonitor/netmonitor.js
devtools/client/netmonitor/panel.js
--- a/devtools/client/netmonitor/components/network-monitor.js
+++ b/devtools/client/netmonitor/components/network-monitor.js
@@ -7,28 +7,28 @@
 const {
   createFactory,
   DOM,
   PropTypes,
 } = require("devtools/client/shared/vendor/react");
 const { connect } = require("devtools/client/shared/vendor/react-redux");
 
 // Components
-const MonitoPanel = createFactory(require("./monitor-panel"));
+const MonitorPanel = createFactory(require("./monitor-panel"));
 const StatisticsPanel = createFactory(require("./statistics-panel"));
 
 const { div } = DOM;
 
 /*
  * Network monitor component
  */
 function NetworkMonitor({ statisticsOpen }) {
   return (
     div({ className: "network-monitor" },
-      !statisticsOpen ? MonitoPanel() : StatisticsPanel()
+      !statisticsOpen ? MonitorPanel() : StatisticsPanel()
     )
   );
 }
 
 NetworkMonitor.displayName = "NetworkMonitor";
 
 NetworkMonitor.propTypes = {
   statisticsOpen: PropTypes.bool.isRequired,
--- a/devtools/client/netmonitor/netmonitor-controller.js
+++ b/devtools/client/netmonitor/netmonitor-controller.js
@@ -1,15 +1,14 @@
 /* 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 { TimelineFront } = require("devtools/shared/fronts/timeline");
 const { CurlUtils } = require("devtools/client/shared/curl");
 const { ACTIVITY_TYPE, EVENTS } = require("./constants");
 const { configureStore } = require("./store");
 const Actions = require("./actions/index");
 const {
   fetchHeaders,
   formDataURI,
@@ -77,29 +76,28 @@ var NetMonitorController = {
       return this._connection;
     }
     this._connection = new Promise(async (resolve) => {
       // Some actors like AddonActor or RootActor for chrome debugging
       // aren't actual tabs.
       if (this._target.isTabActor) {
         this.tabClient = this._target.activeTab;
       }
+      this.webConsoleClient = this._target.activeConsole;
 
       let connectTimeline = () => {
         // Don't start up waiting for timeline markers if the server isn't
         // recent enough to emit the markers we're interested in.
         if (this._target.getTrait("documentLoadingMarkers")) {
           this.timelineFront = new TimelineFront(this._target.client,
             this._target.form);
           return this.timelineFront.start({ withDocLoadingEvents: true });
         }
         return undefined;
       };
-
-      this.webConsoleClient = this._target.activeConsole;
       await connectTimeline();
 
       this.TargetEventsHandler.connect();
       this.NetworkEventsHandler.connect();
 
       window.emit(EVENTS.CONNECTED);
 
       resolve();
--- a/devtools/client/netmonitor/netmonitor.js
+++ b/devtools/client/netmonitor/netmonitor.js
@@ -1,53 +1,52 @@
 /* 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/. */
 
+/* exported Netmonitor */
+
 "use strict";
 
 const { BrowserLoader } = Components.utils.import("resource://devtools/client/shared/browser-loader.js", {});
 
-function Netmonitor(toolbox) {
-  const require = window.windowRequire = BrowserLoader({
-    baseURI: "resource://devtools/client/netmonitor/",
-    window,
-    commonLibRequire: toolbox.browserRequire,
-  }).require;
+var Netmonitor = {
+  bootstrap: ({ tabTarget, toolbox }) => {
+    const require = window.windowRequire = BrowserLoader({
+      baseURI: "resource://devtools/client/netmonitor/",
+      window,
+      commonLibRequire: toolbox.browserRequire,
+    }).require;
 
-  // Inject EventEmitter into netmonitor window.
-  const EventEmitter = require("devtools/shared/event-emitter");
-  EventEmitter.decorate(window);
-
-  window.NetMonitorController = require("./netmonitor-controller").NetMonitorController;
-  window.NetMonitorController._toolbox = toolbox;
-  window.NetMonitorController._target = toolbox.target;
-}
-
-Netmonitor.prototype = {
-  init() {
-    const require = window.windowRequire;
+    const EventEmitter = require("devtools/shared/event-emitter");
     const { createFactory } = require("devtools/client/shared/vendor/react");
     const { render } = require("devtools/client/shared/vendor/react-dom");
     const Provider = createFactory(require("devtools/client/shared/vendor/react-redux").Provider);
 
     // Components
     const NetworkMonitor = createFactory(require("./components/network-monitor"));
 
-    this.networkMonitor = document.querySelector(".root");
+    // Inject EventEmitter into netmonitor window.
+    EventEmitter.decorate(window);
+
+    window.NetMonitorController = require("./netmonitor-controller").NetMonitorController;
+    window.NetMonitorController._toolbox = toolbox;
+    window.NetMonitorController._target = tabTarget;
+
+    this.root = document.querySelector(".root");
 
     render(Provider(
       { store: window.gStore },
-      NetworkMonitor({ toolbox: window.NetMonitorController._toolbox }),
-    ), this.networkMonitor);
+      NetworkMonitor(),
+    ), this.root);
 
     return window.NetMonitorController.startupNetMonitor();
   },
 
-  destroy() {
+  destroy: () => {
     const require = window.windowRequire;
     const { unmountComponentAtNode } = require("devtools/client/shared/vendor/react-dom");
 
-    unmountComponentAtNode(this.networkMonitor);
+    unmountComponentAtNode(this.root);
 
     return window.NetMonitorController.shutdownNetMonitor();
   }
 };
--- a/devtools/client/netmonitor/panel.js
+++ b/devtools/client/netmonitor/panel.js
@@ -1,32 +1,33 @@
 /* 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";
 
 function NetMonitorPanel(iframeWindow, toolbox) {
   this.panelWin = iframeWindow;
-  this.panelDoc = iframeWindow.document;
   this.toolbox = toolbox;
-  this.netmonitor = new iframeWindow.Netmonitor(toolbox);
 }
 
 NetMonitorPanel.prototype = {
   async open() {
     if (!this.toolbox.target.isRemote) {
       await this.toolbox.target.makeRemote();
     }
-    await this.netmonitor.init();
+    await this.panelWin.Netmonitor.bootstrap({
+      tabTarget: this.toolbox.target,
+      toolbox: this.toolbox,
+    });
     this.emit("ready");
     this.isReady = true;
     return this;
   },
 
   async destroy() {
-    await this.netmonitor.destroy();
+    await this.panelWin.Netmonitor.destroy();
     this.emit("destroyed");
     return this;
   },
 };
 
 exports.NetMonitorPanel = NetMonitorPanel;