Bug 1344155 - Remove toolbox in netmonitor r=Honza

MozReview-Commit-ID: BM0RoiuRaPh

--HG--
extra : rebase_source : 81933234fd44c7940133540b25e5c8682a1c168d

devtools/client/inspector/toolsidebar.js

@@ -76,7 +76,6 @@ ToolSidebar.prototype = {
       "devtools/client/shared/components/tabs/tabbar"));
 
     let sidebar = Tabbar({
-      toolbox: this._toolPanel._toolbox,
       showAllTabsMenu: true,
       onSelect: this.handleSelectionChange.bind(this),
     });

devtools/client/netmonitor/components/monitor-panel.js

@@ -82,11 +82,13 @@ const MonitorPanel = createClass({
 
   componentWillUnmount() {
     MediaQueryList.removeListener(this.onLayoutChange);
-    let { clientWidth, clientHeight } = findDOMNode(this.refs.networkDetailsPanel) || {};
+
+    let { clientWidth, clientHeight } = findDOMNode(this.refs.endPanel) || {};
 
     if (this.state.isVerticalSpliter && clientWidth) {
       Prefs.networkDetailsWidth = clientWidth;
-    } else if (clientHeight) {
+    }
+    if (!this.state.isVerticalSpliter && clientHeight) {
       Prefs.networkDetailsHeight = clientHeight;
     }
   },
@@ -110,11 +112,7 @@ const MonitorPanel = createClass({
           maxSize: "80%",
           splitterSize: "1px",
           startPanel: RequestList({ isEmpty }),
-          endPanel: networkDetailsOpen ?
-            NetworkDetailsPanel({
-              ref: "networkDetailsPanel",
-              toolbox: window.NetMonitorController._toolbox,
-            }) : null,
+          endPanel: networkDetailsOpen && NetworkDetailsPanel({ ref: "endPanel" }),
           endPanelControl: true,
           vert: this.state.isVerticalSpliter,
         }),

devtools/client/netmonitor/components/request-list-content.js

@@ -55,10 +55,7 @@ const RequestListContent = createClass({
       cloneSelectedRequest: () => dispatch(Actions.cloneSelectedRequest()),
       openStatistics: (open) => dispatch(Actions.openStatistics(open)),
     });
-    this.tooltip = new HTMLTooltip(
-      window.NetMonitorController._toolbox.doc,
-      { type: "arrow" }
-     );
+    this.tooltip = new HTMLTooltip(window.parent.document, { type: "arrow" });
   },
 
   componentDidMount() {

devtools/client/netmonitor/components/toolbar.js

@@ -121,7 +121,7 @@ const Toolbar = createClass({
             title: TOOLBAR_CLEAR,
             onClick: clearRequests,
           }),
-          div({ id: "requests-list-filter-buttons" }, buttons),
+          div({ className: "requests-list-filter-buttons" }, buttons),
         ),
         span({ className: "devtools-toolbar-group" },
           button({

devtools/client/netmonitor/netmonitor-controller.js

@@ -7,7 +7,6 @@
 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,
@@ -22,7 +21,7 @@ const {
   getDisplayedRequestById,
 } = require("./selectors/index");
 
-const gStore = window.gStore = configureStore();
+const gStore = window.gStore;
 
 /**
  * Object defining the network monitor controller components.
@@ -312,7 +311,7 @@ var NetMonitorController = {
    * Open a given source in Debugger
    */
   viewSourceInDebugger(sourceURL, sourceLine) {
-    return this._toolbox.viewSourceInDebugger(sourceURL, sourceLine);
+    return this.toolbox.viewSourceInDebugger(sourceURL, sourceLine);
   },
 
   /**
@@ -829,6 +828,7 @@ NetworkEventsHandler.prototype = {
  * Preliminary setup for the NetMonitorController object.
  */
 NetMonitorController.NetworkEventsHandler = new NetworkEventsHandler();
+window.NetMonitorController = NetMonitorController;
 window.gNetwork = NetMonitorController.NetworkEventsHandler;
 
 exports.NetMonitorController = NetMonitorController;

devtools/client/netmonitor/netmonitor.js

@@ -20,6 +20,12 @@ var Netmonitor = {
     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);
+    const { configureStore } = require("./store");
+    const store = window.gStore = configureStore();
+    const { NetMonitorController } = require("./netmonitor-controller");
+    NetMonitorController.toolbox = toolbox;
+    NetMonitorController._target = toolbox.target;
+    this.NetMonitorController = NetMonitorController;
 
     // Components
     const NetworkMonitor = createFactory(require("./components/network-monitor"));
@@ -27,18 +33,11 @@ var Netmonitor = {
     // 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(),
-    ), this.root);
+    render(Provider({ store }, NetworkMonitor()), this.root);
 
-    return window.NetMonitorController.startupNetMonitor();
+    return NetMonitorController.startupNetMonitor();
   },
 
   destroy: () => {
@@ -47,6 +46,6 @@ var Netmonitor = {
 
     unmountComponentAtNode(this.root);
 
-    return window.NetMonitorController.shutdownNetMonitor();
+    return this.NetMonitorController.shutdownNetMonitor();
   }
 };

devtools/client/netmonitor/reducers/timing-markers.js

@@ -5,9 +5,11 @@
 "use strict";
 
 const I = require("devtools/client/shared/vendor/immutable");
-const { ADD_TIMING_MARKER,
-        CLEAR_TIMING_MARKERS,
-        CLEAR_REQUESTS } = require("../constants");
+const {
+  ADD_TIMING_MARKER,
+  CLEAR_TIMING_MARKERS,
+  CLEAR_REQUESTS,
+} = require("../constants");
 
 const TimingMarkers = I.Record({
   firstDocumentDOMContentLoadedTimestamp: -1,
@@ -15,14 +17,14 @@ const TimingMarkers = I.Record({
 });
 
 function addTimingMarker(state, action) {
-  if (action.marker.name == "document::DOMContentLoaded" &&
-      state.firstDocumentDOMContentLoadedTimestamp == -1) {
+  if (action.marker.name === "document::DOMContentLoaded" &&
+      state.firstDocumentDOMContentLoadedTimestamp === -1) {
     return state.set("firstDocumentDOMContentLoadedTimestamp",
                      action.marker.unixTime / 1000);
   }
 
-  if (action.marker.name == "document::Load" &&
-      state.firstDocumentLoadTimestamp == -1) {
+  if (action.marker.name === "document::Load" &&
+      state.firstDocumentLoadTimestamp === -1) {
     return state.set("firstDocumentLoadTimestamp",
                      action.marker.unixTime / 1000);
   }

devtools/client/netmonitor/request-list-context-menu.js

@@ -179,7 +179,7 @@ RequestListContextMenu.prototype = {
       click: () => this.openStatistics(true)
     }));
 
-    menu.popup(screenX, screenY, window.NetMonitorController._toolbox);
+    menu.popup(screenX, screenY, { doc: window.parent.document });
     return menu;
   },
 

devtools/client/netmonitor/shared/components/network-details-panel.js

@@ -27,7 +27,6 @@ function NetworkDetailsPanel({
   cloneSelectedRequest,
   request,
   selectTab,
-  toolbox,
 }) {
   if (!request) {
     return null;
@@ -40,7 +39,6 @@ function NetworkDetailsPanel({
           activeTabId,
           request,
           selectTab,
-          toolbox,
         }) :
         CustomRequestPanel({
           cloneSelectedRequest,
@@ -58,7 +56,6 @@ NetworkDetailsPanel.propTypes = {
   open: PropTypes.bool,
   request: PropTypes.object,
   selectTab: PropTypes.func.isRequired,
-  toolbox: PropTypes.object.isRequired,
 };
 
 module.exports = connect(

devtools/client/netmonitor/shared/components/tabbox-panel.js

@@ -42,7 +42,6 @@ function TabboxPanel({
   cloneSelectedRequest,
   request,
   selectTab,
-  toolbox,
 }) {
   if (!request) {
     return null;
@@ -54,7 +53,6 @@ function TabboxPanel({
       onSelect: selectTab,
       renderOnlySelected: true,
       showAllTabsMenu: true,
-      toolbox,
     },
       TabPanel({
         id: "headers",
@@ -111,7 +109,6 @@ TabboxPanel.propTypes = {
   cloneSelectedRequest: PropTypes.func.isRequired,
   request: PropTypes.object,
   selectTab: PropTypes.func.isRequired,
-  toolbox: PropTypes.object.isRequired,
 };
 
 module.exports = connect(

devtools/client/netmonitor/test/browser_net_copy_as_curl.js

@@ -55,9 +55,7 @@ add_task(function* () {
     document.querySelectorAll(".request-list-item")[0]);
 
   yield waitForClipboardPromise(function setup() {
-    // Context menu is appending in XUL document, we must select it from
-    // toolbox.doc
-    monitor.toolbox.doc
+    monitor.panelWin.parent.document
       .querySelector("#request-list-context-copy-as-curl").click();
   }, function validate(result) {
     if (typeof result !== "string") {

devtools/client/netmonitor/test/browser_net_copy_headers.js

@@ -41,9 +41,7 @@ add_task(function* () {
   ].join("\n");
 
   yield waitForClipboardPromise(function setup() {
-    // Context menu is appending in XUL document, we must select it from
-    // toolbox.doc
-    monitor.toolbox.doc
+    monitor.panelWin.parent.document
       .querySelector("#request-list-context-copy-request-headers").click();
   }, function validate(result) {
     // Sometimes, a "Cookie" header is left over from other tests. Remove it:
@@ -66,9 +64,7 @@ add_task(function* () {
     document.querySelectorAll(".request-list-item")[0]);
 
   yield waitForClipboardPromise(function setup() {
-    // Context menu is appending in XUL document, we must select it from
-    // _oolbox.doc
-    monitor.toolbox.doc
+    monitor.panelWin.parent.document
       .querySelector("#response-list-context-copy-response-headers").click();
   }, function validate(result) {
     // Fake the "Last-Modified" and "Date" headers because they will vary:

devtools/client/netmonitor/test/browser_net_copy_image_as_data_uri.js

@@ -25,9 +25,7 @@ add_task(function* () {
     document.querySelectorAll(".request-list-item")[5]);
 
   yield waitForClipboardPromise(function setup() {
-    // Context menu is appending in XUL document, we must select it from
-    // toolbox.doc
-    monitor.toolbox.doc
+    monitor.panelWin.parent.document
       .querySelector("#request-list-context-copy-image-as-data-uri").click();
   }, TEST_IMAGE_DATA_URI);
 

devtools/client/netmonitor/test/browser_net_copy_params.js

@@ -62,7 +62,7 @@ add_task(function* () {
       document.querySelectorAll(".request-list-item")[index]);
     EventUtils.sendMouseEvent({ type: "contextmenu" },
       document.querySelectorAll(".request-list-item")[index]);
-    let copyUrlParamsNode = monitor.toolbox.doc
+    let copyUrlParamsNode = monitor.panelWin.parent.document
       .querySelector("#request-list-context-copy-url-params");
     is(!!copyUrlParamsNode, !hidden,
       "The \"Copy URL Parameters\" context menu item should" + (hidden ? " " : " not ") +
@@ -75,7 +75,7 @@ add_task(function* () {
     EventUtils.sendMouseEvent({ type: "contextmenu" },
       document.querySelectorAll(".request-list-item")[index]);
     yield waitForClipboardPromise(function setup() {
-      monitor.toolbox.doc
+      monitor.panelWin.parent.document
         .querySelector("#request-list-context-copy-url-params").click();
     }, queryString);
     ok(true, "The url query string copied from the selected item is correct.");
@@ -86,7 +86,7 @@ add_task(function* () {
       document.querySelectorAll(".request-list-item")[index]);
     EventUtils.sendMouseEvent({ type: "contextmenu" },
       document.querySelectorAll(".request-list-item")[index]);
-    let copyPostDataNode = monitor.toolbox.doc
+    let copyPostDataNode = monitor.panelWin.parent.document
       .querySelector("#request-list-context-copy-post-data");
     is(!!copyPostDataNode, !hidden,
       "The \"Copy POST Data\" context menu item should" + (hidden ? " " : " not ") +
@@ -99,7 +99,7 @@ add_task(function* () {
     EventUtils.sendMouseEvent({ type: "contextmenu" },
       document.querySelectorAll(".request-list-item")[index]);
     yield waitForClipboardPromise(function setup() {
-      monitor.toolbox.doc
+      monitor.panelWin.parent.document
         .querySelector("#request-list-context-copy-post-data").click();
     }, postData);
     ok(true, "The post data string copied from the selected item is correct.");

devtools/client/netmonitor/test/browser_net_copy_response.js

@@ -27,9 +27,7 @@ add_task(function* () {
     document.querySelectorAll(".request-list-item")[3]);
 
   yield waitForClipboardPromise(function setup() {
-    // Context menu is appending in XUL document, we must select it from
-    // toolbox.doc
-    monitor.toolbox.doc
+    monitor.panelWin.parent.document
       .querySelector("#request-list-context-copy-response").click();
   }, EXPECTED_RESULT);
 

devtools/client/netmonitor/test/browser_net_copy_svg_image_as_data_uri.js

@@ -27,9 +27,7 @@ add_task(function* () {
     document.querySelectorAll(".request-list-item")[0]);
 
   yield waitForClipboardPromise(function setup() {
-    // Context menu is appending in XUL document, we must select it from
-    // toolbox.doc
-    monitor.toolbox.doc
+    monitor.panelWin.parent.document
       .querySelector("#request-list-context-copy-image-as-data-uri").click();
   }, function check(text) {
     return text.startsWith("data:") && !/undefined/.test(text);

devtools/client/netmonitor/test/browser_net_copy_url.js

@@ -28,9 +28,7 @@ add_task(function* () {
   let requestItem = getSortedRequests(gStore.getState()).get(0);
 
   yield waitForClipboardPromise(function setup() {
-    // Context menu is appending in XUL document, we must select it from
-    // toolbox.doc
-    monitor.toolbox.doc
+    monitor.panelWin.parent.document
       .querySelector("#request-list-context-copy-url").click();
   }, requestItem.url);
 

devtools/client/netmonitor/test/browser_net_image-tooltip.js

@@ -16,7 +16,7 @@ add_task(function* test() {
   let { document, gStore, windowRequire, NetMonitorController } = monitor.panelWin;
   let Actions = windowRequire("devtools/client/netmonitor/actions/index");
   let { ACTIVITY_TYPE, EVENTS } = windowRequire("devtools/client/netmonitor/constants");
-  let toolboxDoc = monitor.toolbox.doc;
+  let toolboxDoc = monitor.panelWin.parent.document;
 
   gStore.dispatch(Actions.batchEnable(false));
 

devtools/client/netmonitor/test/browser_net_open_request_in_tab.js

@@ -28,9 +28,7 @@ add_task(function* () {
     document.querySelectorAll(".request-list-item")[0]);
 
   let onTabOpen = once(gBrowser.tabContainer, "TabOpen", false);
-  // Context menu is appending in XUL document, we must select it from
-  // toolbox.doc
-  monitor.toolbox.doc
+  monitor.panelWin.parent.document
     .querySelector("#request-list-context-newtab").click();
   yield onTabOpen;
 

devtools/client/netmonitor/test/head.js

@@ -400,7 +400,7 @@ function testFilterButtons(monitor, filterType) {
   let doc = monitor.panelWin.document;
   let target = doc.querySelector(".requests-list-filter-" + filterType + "-button");
   ok(target, `Filter button '${filterType}' was found`);
-  let buttons = [...doc.querySelectorAll("#requests-list-filter-buttons button")];
+  let buttons = [...doc.querySelectorAll(".requests-list-filter-buttons button")];
   ok(buttons.length > 0, "More than zero filter buttons were found");
 
   // Only target should be checked.
@@ -418,7 +418,7 @@ function testFilterButtons(monitor, filterType) {
  */
 function testFilterButtonsCustom(monitor, isChecked) {
   let doc = monitor.panelWin.document;
-  let buttons = doc.querySelectorAll("#requests-list-filter-buttons button");
+  let buttons = doc.querySelectorAll(".requests-list-filter-buttons button");
   for (let i = 0; i < isChecked.length; i++) {
     let button = buttons[i];
     if (isChecked[i]) {

devtools/client/netmonitor/waterfall-background.js

@@ -28,8 +28,7 @@ const STATE_KEYS = [
 /**
  * Creates the background displayed on each waterfall view in this container.
  */
-function WaterfallBackground(document) {
-  this.document = document;
+function WaterfallBackground() {
   this.canvas = document.createElementNS(HTML_NS, "canvas");
   this.ctx = this.canvas.getContext("2d");
   this.prevState = {};
@@ -45,8 +44,8 @@ WaterfallBackground.prototype = {
 
     this.prevState = state;
 
-    if (state.waterfallWidth == null || state.scale == null) {
-      this.document.mozSetImageElement("waterfall-background", null);
+    if (state.waterfallWidth === null || state.scale === null) {
+      document.mozSetImageElement("waterfall-background", null);
       return;
     }
 
@@ -78,7 +77,7 @@ WaterfallBackground.prototype = {
       optimalTickIntervalFound = true;
     }
 
-    const isRTL = isDocumentRTL(this.document);
+    const isRTL = isDocumentRTL(document);
     const [r, g, b] = REQUESTS_WATERFALL_BACKGROUND_TICKS_COLOR_RGB;
     let alphaComponent = REQUESTS_WATERFALL_BACKGROUND_TICKS_OPACITY_MIN;
 
@@ -98,7 +97,7 @@ WaterfallBackground.prototype = {
     }
 
     function drawTimestamp(timestamp, color) {
-      if (timestamp == -1) {
+      if (timestamp === -1) {
         return;
       }
 
@@ -116,11 +115,11 @@ WaterfallBackground.prototype = {
     pixelArray.set(view8bit);
     this.ctx.putImageData(imageData, 0, 0);
 
-    this.document.mozSetImageElement("waterfall-background", this.canvas);
+    document.mozSetImageElement("waterfall-background", this.canvas);
   },
 
   destroy() {
-    this.document.mozSetImageElement("waterfall-background", null);
+    document.mozSetImageElement("waterfall-background", null);
   }
 };
 

devtools/client/shared/components/tabs/tabbar.js

@@ -4,6 +4,8 @@
  * 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/. */
 
+/* eslint-env browser */
+
 "use strict";
 
 const { DOM, createClass, PropTypes, createFactory } = require("devtools/client/shared/vendor/react");
@@ -26,7 +28,6 @@ let Tabbar = createClass({
     onSelect: PropTypes.func,
     showAllTabsMenu: PropTypes.bool,
     activeTabId: PropTypes.string,
-    toolbox: PropTypes.object,
     renderOnlySelected: PropTypes.bool,
   },
 
@@ -195,7 +196,8 @@ let Tabbar = createClass({
     let rect = target.getBoundingClientRect();
     let screenX = target.ownerDocument.defaultView.mozInnerScreenX;
     let screenY = target.ownerDocument.defaultView.mozInnerScreenY;
-    menu.popup(rect.left + screenX, rect.bottom + screenY, this.props.toolbox);
+    menu.popup(rect.left + screenX, rect.bottom + screenY,
+      { doc: window.parent.document });
 
     return menu;
   },