Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
* 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";
/**
* This file contains the tree view, displaying all the samples and frames
* received from the proviler in a tree-like structure.
*/
const { Cc, Ci, Cu, Cr } = require("devtools/sham/chrome");
const { L10N } = require("devtools/client/performance/modules/global");
const { Heritage } = require("devtools/client/shared/widgets/ViewHelpers");
const { AbstractTreeItem } = require("devtools/client/shared/widgets/AbstractTreeItem");
const URL_LABEL_TOOLTIP = L10N.getStr("table.url.tooltiptext");
const VIEW_OPTIMIZATIONS_TOOLTIP = L10N.getStr("table.view-optimizations.tooltiptext2");
const CALL_TREE_INDENTATION = 16; // px
// Used for rendering values in cells
const FORMATTERS = {
TIME: (value) => L10N.getFormatStr("table.ms2", L10N.numberWithDecimals(value, 2)),
PERCENT: (value) => L10N.getFormatStr("table.percentage2", L10N.numberWithDecimals(value, 2)),
NUMBER: (value) => value || 0,
BYTESIZE: (value) => L10N.getFormatStr("table.bytes", (value || 0))
};
/**
* Definitions for rendering cells. Triads of class name, property name from
* `frame.getInfo()`, and a formatter function.
*/
const CELLS = {
elements.push(hbox);
}
return elements;
},
};
/**
* Mapping of JS marker causes to a friendlier form. Only
* markers that are considered "from content" should be labeled here.
*/
const JS_MARKER_MAP = {
"
}
return elements;
},
};
/**
* Mapping of JS marker causes to a friendlier form. Only
* markers that are considered "from content" should be labeled here.
*/
const JS_MARKER_MAP = {
"
/* Group 0 - Reflow and Rendering pipeline */
"Styles": {
group: 0,
colorName: "graphs-purple",
label: L10N.getStr("marker.label.styles"),
fields: Formatters.StylesFields,
},
"Reflow": {
group: 0,
colorName: "graphs-purple",
label: L10N.getStr("marker.label.reflow"),
},
"Paint": {
group: 0,
colorName: "graphs-green",
label: L10N.getStr("marker.label.paint"),
},
"Composite": {
group: 0,
colorName: "graphs-green",
label: L10N.getStr("marker.label.composite"),
},
"CompositeForwardTransaction": {
group: 0,
colorName: "graphs-bluegrey",
label: L10N.getStr("marker.label.compositeForwardTransaction"),
},
/* Group 1 - JS */
"DOMEvent": {
group: 1,
colorName: "graphs-yellow",
"GarbageCollection": {
group: 1,
colorName: "graphs-red",
label: Formatters.GCLabel,
fields: Formatters.GCFields,
},
"nsCycleCollector::Collect": {
group: 1,
colorName: "graphs-red",
label: L10N.getStr("marker.label.cycleCollection"),
fields: Formatters.CycleCollectionFields,
},
"nsCycleCollector::ForgetSkippable": {
group: 1,
colorName: "graphs-red",
label: L10N.getStr("marker.label.cycleCollection.forgetSkippable"),
fields: Formatters.CycleCollectionFields,
},
"Worker": {
group: 1,
colorName: "graphs-orange",
label: L10N.getStr("marker.label.worker"),
fields: Formatters.WorkerFields
},
/* Group 2 - User Controlled */
"ConsoleTime": {
group: 2,
colorName: "graphs-blue",
label: sublabelForProperty(L10N.getStr("marker.label.consoleTime"), "causeName"),
fields: [{
property: "causeName",
"Composite": {
group: 0,
colorName: "graphs-green",
label: L10N.getStr("marker.label.composite"),
},
"CompositeForwardTransaction": {
group: 0,
colorName: "graphs-bluegrey",
label: L10N.getStr("marker.label.compositeForwardTransaction"),
},
/* Group 1 - JS */
"DOMEvent": {
group: 1,
colorName: "graphs-yellow",
label: L10N.getStr("marker.label.domevent"),
fields: Formatters.DOMEventFields,
},
"document::DOMContentLoaded": {
group: 1,
colorName: "graphs-full-red",
label: "DOMContentLoaded"
},
"document::Load": {
group: 1,
colorName: "graphs-full-blue",
label: "Load"
},
"Javascript": {
group: 1,
colorName: "graphs-yellow",
label: Formatters.JSLabel,
}));
hbox.appendChild(label);
elements.push(hbox);
}
return elements;
},
};
/**
* Mapping of JS marker causes to a friendlier form. Only
* markers that are considered "from content" should be labeled here.
*/
const JS_MARKER_MAP = {
"
WorkerFields: function(marker) {
return {
[L10N.getStr("marker.field.type")]:
L10N.getStr(`marker.worker.${marker.workerOperation}`)
};
}
};
UnknownLabel: function (marker={}) {
return marker.name || L10N.getStr("marker.label.unknown");
},
DOMEventFields: function (marker) {
let fields = Object.create(null);
if ("type" in marker) {
fields[L10N.getStr("marker.field.DOMEventType")] = marker.type;
}
if ("eventPhase" in marker) {
let phase;
if (marker.eventPhase === Ci.nsIDOMEvent.AT_TARGET) {
phase = L10N.getStr("marker.value.DOMEventTargetPhase");
} else if (marker.eventPhase === Ci.nsIDOMEvent.CAPTURING_PHASE) {
phase = L10N.getStr("marker.value.DOMEventCapturingPhase");
} else if (marker.eventPhase === Ci.nsIDOMEvent.BUBBLING_PHASE) {
phase = L10N.getStr("marker.value.DOMEventBubblingPhase");
}
fields[L10N.getStr("marker.field.DOMEventPhase")] = phase;
}
return fields;
},