devtools/client/memory/initializer.js

   1 /* This Source Code Form is subject to the terms of the Mozilla Public
   2  * License, v. 2.0. If a copy of the MPL was not distributed with this file,
   3  * You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 /* exported initialize, destroy, Promise */
   6
   7 "use strict";
   8
   9 const {
  10   createFactory,
  11   createElement,
  12 } = require("resource://devtools/client/shared/vendor/react.js");
  13 const ReactDOM = require("resource://devtools/client/shared/vendor/react-dom.js");
  14 const {
  15   Provider,
  16 } = require("resource://devtools/client/shared/vendor/react-redux.js");
  17 const App = createFactory(require("resource://devtools/client/memory/app.js"));
  18 const Store = require("resource://devtools/client/memory/store.js");
  19 const { assert } = require("resource://devtools/shared/DevToolsUtils.js");
  20
  21 const {
  22   updateMemoryFront,
  23 } = require("resource://devtools/client/memory/actions/front.js");
  24
  25 // Shared variables used by several methods of this module.
  26 let root, store, unsubscribe;
  27
  28 const initialize = async function (commands) {
  29   // Exposed by panel.js
  30   const { gToolbox, gHeapAnalysesClient } = window;
  31
  32   root = document.querySelector("#app");
  33   store = Store();
  34   const app = createElement(App, {
  35     toolbox: gToolbox,
  36     commands,
  37     heapWorker: gHeapAnalysesClient,
  38   });
  39   const provider = createElement(Provider, { store }, app);
  40   ReactDOM.render(provider, root);
  41   unsubscribe = store.subscribe(onStateChange);
  42
  43   // Exposed for tests.
  44   window.gStore = store;
  45 };
  46
  47 const updateFront = front => {
  48   store.dispatch(updateMemoryFront(front));
  49 };
  50
  51 const destroy = function () {
  52   const ok = ReactDOM.unmountComponentAtNode(root);
  53   assert(
  54     ok,
  55     "Should successfully unmount the memory tool's top level React component"
  56   );
  57
  58   unsubscribe();
  59 };
  60
  61 // Current state
  62 let isHighlighted;
  63
  64 /**
  65  * Fired on any state change, currently only handles toggling
  66  * the highlighting of the tool when recording allocations.
  67  */
  68 function onStateChange() {
  69   const { gToolbox } = window;
  70
  71   const isRecording = store.getState().allocations.recording;
  72   if (isRecording === isHighlighted) {
  73     return;
  74   }
  75
  76   if (isRecording) {
  77     gToolbox.highlightTool("memory");
  78   } else {
  79     gToolbox.unhighlightTool("memory");
  80   }
  81
  82   isHighlighted = isRecording;
  83 }
  84
  85 module.exports = { initialize, updateFront, destroy };