devtools/client/webconsole/utils/object-inspector.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
   3  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 "use strict";
   6
   7 const {
   8   createFactory,
   9   createElement,
  10 } = require("resource://devtools/client/shared/vendor/react.js");
  11
  12 loader.lazyGetter(this, "REPS", function () {
  13   return require("resource://devtools/client/shared/components/reps/index.js")
  14     .REPS;
  15 });
  16 loader.lazyGetter(this, "MODE", function () {
  17   return require("resource://devtools/client/shared/components/reps/index.js")
  18     .MODE;
  19 });
  20 loader.lazyGetter(this, "ObjectInspector", function () {
  21   const objectInspector = require("resource://devtools/client/shared/components/object-inspector/index.js");
  22   return createFactory(objectInspector.ObjectInspector);
  23 });
  24
  25 loader.lazyRequireGetter(
  26   this,
  27   "SmartTrace",
  28   "resource://devtools/client/shared/components/SmartTrace.js"
  29 );
  30
  31 loader.lazyRequireGetter(
  32   this,
  33   "LongStringFront",
  34   "resource://devtools/client/fronts/string.js",
  35   true
  36 );
  37
  38 loader.lazyRequireGetter(
  39   this,
  40   "ObjectFront",
  41   "resource://devtools/client/fronts/object.js",
  42   true
  43 );
  44
  45 /**
  46  * Create and return an ObjectInspector for the given front.
  47  *
  48  * @param {Object} grip
  49  *        The object grip to create an ObjectInspector for.
  50  * @param {Object} serviceContainer
  51  *        Object containing various utility functions
  52  * @param {Object} override
  53  *        Object containing props that should override the default props passed to
  54  *        ObjectInspector.
  55  * @returns {ObjectInspector}
  56  *        An ObjectInspector for the given grip.
  57  */
  58 function getObjectInspector(
  59   frontOrPrimitiveGrip,
  60   serviceContainer,
  61   override = {}
  62 ) {
  63   let onDOMNodeMouseOver;
  64   let onDOMNodeMouseOut;
  65   let onInspectIconClick;
  66
  67   if (serviceContainer) {
  68     onDOMNodeMouseOver = serviceContainer.highlightDomElement
  69       ? object => serviceContainer.highlightDomElement(object)
  70       : null;
  71     onDOMNodeMouseOut = serviceContainer.unHighlightDomElement
  72       ? object => serviceContainer.unHighlightDomElement(object)
  73       : null;
  74     onInspectIconClick = serviceContainer.openNodeInInspector
  75       ? (object, e) => {
  76           // Stop the event propagation so we don't trigger ObjectInspector expand/collapse.
  77           e.stopPropagation();
  78           serviceContainer.openNodeInInspector(object);
  79         }
  80       : null;
  81   }
  82
  83   const roots = createRoots(frontOrPrimitiveGrip, override.pathPrefix);
  84
  85   const objectInspectorProps = {
  86     autoExpandDepth: 0,
  87     mode: MODE.LONG,
  88     standalone: true,
  89     roots,
  90     onViewSourceInDebugger: serviceContainer.onViewSourceInDebugger,
  91     recordTelemetryEvent: serviceContainer.recordTelemetryEvent,
  92     openLink: serviceContainer.openLink,
  93     sourceMapURLService: serviceContainer.sourceMapURLService,
  94     customFormat: override.customFormat !== false,
  95     setExpanded: override.setExpanded,
  96     initiallyExpanded: override.initiallyExpanded,
  97     queueActorsForCleanup: override.queueActorsForCleanup,
  98     cachedNodes: override.cachedNodes,
  99     urlCropLimit: 120,
 100     renderStacktrace: stacktrace => {
 101       const attrs = {
 102         key: "stacktrace",
 103         stacktrace,
 104         onViewSourceInDebugger: serviceContainer
 105           ? serviceContainer.onViewSourceInDebugger ||
 106             serviceContainer.onViewSource
 107           : null,
 108         onViewSource: serviceContainer.onViewSource,
 109         onReady: override.maybeScrollToBottom,
 110         sourceMapURLService: serviceContainer
 111           ? serviceContainer.sourceMapURLService
 112           : null,
 113       };
 114
 115       if (serviceContainer?.preventStacktraceInitialRenderDelay) {
 116         attrs.initialRenderDelay = 0;
 117       }
 118       return createElement(SmartTrace, attrs);
 119     },
 120     onDOMNodeMouseOver,
 121     onDOMNodeMouseOut,
 122     onInspectIconClick,
 123     defaultRep: REPS.Grip,
 124     createElement: serviceContainer?.createElement,
 125     mayUseCustomFormatter: true,
 126     ...override,
 127   };
 128
 129   if (override.autoFocusRoot) {
 130     Object.assign(objectInspectorProps, {
 131       focusedItem: objectInspectorProps.roots[0],
 132     });
 133   }
 134
 135   return ObjectInspector(objectInspectorProps);
 136 }
 137
 138 function createRoots(frontOrPrimitiveGrip, pathPrefix = "") {
 139   const isFront =
 140     frontOrPrimitiveGrip instanceof ObjectFront ||
 141     frontOrPrimitiveGrip instanceof LongStringFront;
 142   const grip = isFront ? frontOrPrimitiveGrip.getGrip() : frontOrPrimitiveGrip;
 143
 144   return [
 145     {
 146       path: `${pathPrefix}${
 147         frontOrPrimitiveGrip
 148           ? frontOrPrimitiveGrip.actorID || frontOrPrimitiveGrip.actor
 149           : null
 150       }`,
 151       contents: { value: grip, front: isFront ? frontOrPrimitiveGrip : null },
 152     },
 153   ];
 154 }
 155
 156 module.exports = {
 157   getObjectInspector,
 158 };