Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (243212 => 243213)
--- trunk/Source/WebInspectorUI/ChangeLog 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/ChangeLog 2019-03-20 17:43:05 UTC (rev 243213)
@@ -1,5 +1,120 @@
2019-03-20 Devin Rousso <[email protected]>
+ Web Inspector: refactor WI.TimelineDataGridNode and its subclasses to unify the API surface
+ https://bugs.webkit.org/show_bug.cgi?id=195959
+ <rdar://problem/49028896>
+
+ Reviewed by Timothy Hatcher.
+
+ * UserInterface/Views/TimelineDataGridNode.js:
+ (WI.TimelineDataGridNode.prototype.get records):
+ (WI.TimelineDataGridNode.prototype.get data):
+ (WI.TimelineDataGridNode.prototype.refresh):
+
+ * UserInterface/Views/HeapAllocationsTimelineDataGridNode.js:
+ (WI.HeapAllocationsTimelineDataGridNode):
+ (WI.HeapAllocationsTimelineDataGridNode.prototype.get heapSnapshot): Added.
+ (WI.HeapAllocationsTimelineDataGridNode.prototype.get data):
+ (WI.HeapAllocationsTimelineDataGridNode.prototype.createCellContent):
+ (WI.HeapAllocationsTimelineDataGridNode.prototype.createCells):
+ (WI.HeapAllocationsTimelineDataGridNode.prototype._handleHeapSnapshotCollectedNodes):
+ (WI.HeapAllocationsTimelineDataGridNode.prototype._handleHeapSnapshotInvalidated):
+ (WI.HeapAllocationsTimelineDataGridNode.prototype.get record): Deleted.
+ (WI.HeapAllocationsTimelineDataGridNode.prototype.updateTimestamp): Deleted.
+ (WI.HeapAllocationsTimelineDataGridNode.prototype._heapSnapshotCollectedNodes): Deleted.
+ (WI.HeapAllocationsTimelineDataGridNode.prototype._heapSnapshotInvalidated): Deleted.
+
+ * UserInterface/Views/LayoutTimelineDataGridNode.js:
+ (WI.LayoutTimelineDataGridNode):
+ (WI.LayoutTimelineDataGridNode.prototype.get data):
+ (WI.LayoutTimelineDataGridNode.prototype.createCellContent):
+ (WI.LayoutTimelineDataGridNode.prototype.get records): Deleted.
+
+ * UserInterface/Views/MediaTimelineDataGridNode.js:
+ (WI.MediaTimelineDataGridNode):
+ (WI.MediaTimelineDataGridNode.prototype.get records): Deleted.
+
+ * UserInterface/Views/ProfileNodeDataGridNode.js:
+ (WI.ProfileNodeDataGridNode):
+ (WI.ProfileNodeDataGridNode.prototype.get profileNode):
+ (WI.ProfileNodeDataGridNode.prototype.get data):
+ (WI.ProfileNodeDataGridNode.prototype.createCellContent):
+ (WI.ProfileNodeDataGridNode.prototype._populate):
+ (WI.ProfileNodeDataGridNode.prototype.get records): Deleted.
+ (WI.ProfileNodeDataGridNode.prototype.get baseStartTime): Deleted.
+ (WI.ProfileNodeDataGridNode.prototype.get rangeStartTime): Deleted.
+ (WI.ProfileNodeDataGridNode.prototype.get rangeEndTime): Deleted.
+ (WI.ProfileNodeDataGridNode.prototype.updateRangeTimes): Deleted.
+ (WI.ProfileNodeDataGridNode.prototype.refresh): Deleted.
+
+ * UserInterface/Views/RenderingFrameTimelineDataGridNode.js:
+ (WI.RenderingFrameTimelineDataGridNode):
+ (WI.RenderingFrameTimelineDataGridNode.prototype.get data):
+ (WI.RenderingFrameTimelineDataGridNode.prototype.createCellContent):
+ (WI.RenderingFrameTimelineDataGridNode.prototype.get records): Deleted.
+
+ * UserInterface/Views/ResourceTimelineDataGridNode.js:
+ (WI.ResourceTimelineDataGridNode):
+ (WI.ResourceTimelineDataGridNode.prototype.get resource):
+ (WI.ResourceTimelineDataGridNode.prototype.get data):
+ (WI.ResourceTimelineDataGridNode.prototype.createCellContent):
+ (WI.ResourceTimelineDataGridNode.prototype.appendContextMenuItems):
+ (WI.ResourceTimelineDataGridNode.prototype.filterableDataForColumn):
+ (WI.ResourceTimelineDataGridNode.prototype._createNameCellDocumentFragment):
+ (WI.ResourceTimelineDataGridNode.prototype._cachedCellContent):
+ (WI.ResourceTimelineDataGridNode.prototype._timelineRecordUpdated):
+ (WI.ResourceTimelineDataGridNode.prototype._dataGridNodeGoToArrowClicked):
+ (WI.ResourceTimelineDataGridNode.prototype._updateStatus):
+ (WI.ResourceTimelineDataGridNode.prototype._mouseoverRecordBar.else.let.graphDataSource.get startTime):
+ (WI.ResourceTimelineDataGridNode.prototype._mouseoverRecordBar.else.let.graphDataSource.get currentTime):
+ (WI.ResourceTimelineDataGridNode.prototype._mouseoverRecordBar.else.let.graphDataSource.get endTime):
+ (WI.ResourceTimelineDataGridNode.prototype._mouseoverRecordBar.else.let.graphDataSource.get _extraTimePadding):
+ (WI.ResourceTimelineDataGridNode.prototype._mouseoverRecordBar):
+ (WI.ResourceTimelineDataGridNode.prototype.get records): Deleted.
+
+ * UserInterface/Views/ResourceTimingPopoverDataGridNode.js:
+ (WI.ResourceTimingPopoverDataGridNode):
+ (WI.ResourceTimingPopoverDataGridNode.prototype.get records): Deleted.
+
+ * UserInterface/Views/ScriptTimelineDataGridNode.js:
+ (WI.ScriptTimelineDataGridNode.prototype.get data):
+ (WI.ScriptTimelineDataGridNode.prototype.get subtitle):
+ (WI.ScriptTimelineDataGridNode.prototype.createCellContent):
+ (WI.ScriptTimelineDataGridNode.prototype.get records): Deleted.
+ (WI.ScriptTimelineDataGridNode.prototype.get baseStartTime): Deleted.
+ (WI.ScriptTimelineDataGridNode.prototype.get rangeStartTime): Deleted.
+ (WI.ScriptTimelineDataGridNode.prototype.get rangeEndTime): Deleted.
+ (WI.ScriptTimelineDataGridNode.prototype.updateRangeTimes): Deleted.
+
+ * UserInterface/Views/SourceCodeTimelineTimelineDataGridNode.js:
+ (WI.SourceCodeTimelineTimelineDataGridNode.prototype.get data):
+
+ * UserInterface/Views/HeapAllocationsTimelineView.js:
+ (WI.HeapAllocationsTimelineView):
+ (WI.HeapAllocationsTimelineView.prototype.layout):
+ (WI.HeapAllocationsTimelineView.prototype.reset):
+ * UserInterface/Views/LayoutTimelineView.js:
+ (WI.LayoutTimelineView.prototype._processPendingRecords):
+ * UserInterface/Views/MediaTimelineView.js:
+ (WI.MediaTimelineView.prototype._processPendingRecords):
+ * UserInterface/Views/NetworkTimelineView.js:
+ (WI.NetworkTimelineView.prototype._processPendingRecords):
+ * UserInterface/Views/OverviewTimelineView.js:
+ (WI.OverviewTimelineView.prototype._addResourceToDataGridIfNeeded):
+ (WI.OverviewTimelineView.prototype._addSourceCodeTimeline):
+ * UserInterface/Views/RenderingFrameTimelineView.js:
+ (WI.RenderingFrameTimelineView.prototype._processPendingRecords):
+ * UserInterface/Views/ScriptDetailsTimelineView.js:
+ (WI.ScriptDetailsTimelineView.prototype.layout):
+ (WI.ScriptDetailsTimelineView.prototype._processPendingRecords):
+ Update Timeline `WI.DataGrid` views to use the new constructor format.
+
+ * UserInterface/Views/ResourceTimelineDataGridNode.css:
+ (.resource-timing-popover-content .data-grid td.graph-column):
+ Drive-by: add extra padding before/after resource timing bars shown when hovering.
+
+2019-03-20 Devin Rousso <[email protected]>
+
Web Inspector: changes to CSS resources only take affect once editing stops
https://bugs.webkit.org/show_bug.cgi?id=195774
<rdar://problem/48905413>
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/HeapAllocationsTimelineDataGridNode.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/HeapAllocationsTimelineDataGridNode.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/HeapAllocationsTimelineDataGridNode.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -25,31 +25,44 @@
WI.HeapAllocationsTimelineDataGridNode = class HeapAllocationsTimelineDataGridNode extends WI.TimelineDataGridNode
{
- constructor(heapAllocationsTimelineRecord, zeroTime, heapAllocationsView)
+ constructor(record, options = {})
{
- super(false, null);
+ console.assert(record instanceof WI.HeapAllocationsTimelineRecord);
- this._record = heapAllocationsTimelineRecord;
- this._heapAllocationsView = heapAllocationsView;
+ super([record], options);
- this._data = {
- name: this.displayName(),
- timestamp: zeroTime ? this._record.timestamp - zeroTime : NaN,
- size: this._record.heapSnapshot.totalSize,
- liveSize: this._record.heapSnapshot.liveSize,
- };
+ this._heapAllocationsView = options.heapAllocationsView;
- this._record.heapSnapshot.addEventListener(WI.HeapSnapshotProxy.Event.CollectedNodes, this._heapSnapshotCollectedNodes, this);
- this._record.heapSnapshot.addEventListener(WI.HeapSnapshotProxy.Event.Invalidated, this._heapSnapshotInvalidated, this);
+ this.heapSnapshot.addEventListener(WI.HeapSnapshotProxy.Event.CollectedNodes, this._handleHeapSnapshotCollectedNodes, this);
+ this.heapSnapshot.addEventListener(WI.HeapSnapshotProxy.Event.Invalidated, this._handleHeapSnapshotInvalidated, this);
}
// Public
- get record() { return this._record; }
- get data() { return this._data; }
+ get heapSnapshot()
+ {
+ return this.record.heapSnapshot;
+ }
+ get data()
+ {
+ if (this._cachedData)
+ return this._cachedData;
+
+ this._cachedData = super.data;
+ this._cachedData.name = this.displayName();
+ this._cachedData.timestamp = this.record.timestamp - (this.graphDataSource ? this.graphDataSource.zeroTime : 0);
+ this._cachedData.size = this.heapSnapshot.totalSize;
+ this._cachedData.liveSize = this.heapSnapshot.liveSize;
+ return this._cachedData;
+ }
+
createCellContent(columnIdentifier, cell)
{
+ const higherResolution = true;
+
+ let value = this.data[columnIdentifier];
+
switch (columnIdentifier) {
case "name":
cell.classList.add(...this.iconClassNames());
@@ -56,23 +69,24 @@
var fragment = document.createDocumentFragment();
var titleElement = fragment.appendChild(document.createElement("span"));
- titleElement.textContent = this._data.name;
- if (!this._record.heapSnapshot.invalid) {
+ titleElement.textContent = value;
+
+ if (this._heapAllocationsView && !this.heapSnapshot.invalid) {
var goToButton = fragment.appendChild(WI.createGoToArrowButton());
goToButton.addEventListener("click", (event) => {
- this._heapAllocationsView.showHeapSnapshotTimelineRecord(this._record);
+ this._heapAllocationsView.showHeapSnapshotTimelineRecord(this.record);
});
}
+
return fragment;
- case "timestamp":
- return isNaN(this._data.timestamp) ? emDash : Number.secondsToString(this._data.timestamp, true);
+ case "timestamp": {
+ return isNaN(value) ? emDash : Number.secondsToString(value, higherResolution);
+ }
case "size":
- return Number.bytesToString(this._data.size);
-
case "liveSize":
- return Number.bytesToString(this._data.liveSize);
+ return Number.bytesToString(value, higherResolution);
}
return super.createCellContent(columnIdentifier, cell);
@@ -88,13 +102,6 @@
this.element.classList.remove("baseline");
}
- updateTimestamp(zeroTime)
- {
- console.assert(isNaN(this._data.timestamp));
- this._data.timestamp = this._record.timestamp - zeroTime;
- this.needsRefresh();
- }
-
// Protected
createCells()
@@ -101,29 +108,19 @@
{
super.createCells();
- if (this._record.heapSnapshot.invalid)
+ if (this.heapSnapshot.invalid)
this.element.classList.add("invalid");
}
// Private
- _heapSnapshotCollectedNodes()
+ _handleHeapSnapshotCollectedNodes()
{
- let oldSize = this._data.liveSize;
- let newSize = this._record.heapSnapshot.liveSize;
-
- console.assert(newSize <= oldSize);
- if (oldSize === newSize)
- return;
-
- this._data.liveSize = newSize;
this.needsRefresh();
}
- _heapSnapshotInvalidated()
+ _handleHeapSnapshotInvalidated()
{
- this._data.liveSize = 0;
-
this.needsRefresh();
}
};
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/HeapAllocationsTimelineView.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/HeapAllocationsTimelineView.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/HeapAllocationsTimelineView.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -101,7 +101,6 @@
WI.ContentView.addEventListener(WI.ContentView.Event.SelectionPathComponentsDidChange, this._contentViewSelectionPathComponentDidChange, this);
this._pendingRecords = [];
- this._pendingZeroTimeDataGridNodes = [];
timeline.addEventListener(WI.Timeline.Event.RecordAdded, this._heapAllocationsTimelineRecordAdded, this);
@@ -263,19 +262,12 @@
layout()
{
- if (this._pendingZeroTimeDataGridNodes.length && this.zeroTime) {
- for (let dataGridNode of this._pendingZeroTimeDataGridNodes)
- dataGridNode.updateTimestamp(this.zeroTime);
- this._pendingZeroTimeDataGridNodes = [];
- this._dataGrid._sort();
- }
-
- if (this._pendingRecords.length) {
+ if (this._pendingRecords.length && this.zeroTime) {
for (let heapAllocationsTimelineRecord of this._pendingRecords) {
- let dataGridNode = new WI.HeapAllocationsTimelineDataGridNode(heapAllocationsTimelineRecord, this.zeroTime, this);
- this._dataGrid.addRowInSortOrder(dataGridNode);
- if (!this.zeroTime)
- this._pendingZeroTimeDataGridNodes.push(dataGridNode);
+ this._dataGrid.addRowInSortOrder(new WI.HeapAllocationsTimelineDataGridNode(heapAllocationsTimelineRecord, {
+ graphDataSource: this,
+ heapAllocationsView: this,
+ }));
}
this._pendingRecords = [];
@@ -291,7 +283,6 @@
this.showHeapSnapshotList();
this._pendingRecords = [];
- this._pendingZeroTimeDataGridNodes = [];
this._updateCompareHeapSnapshotButton();
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGridNode.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGridNode.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGridNode.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -25,36 +25,29 @@
WI.LayoutTimelineDataGridNode = class LayoutTimelineDataGridNode extends WI.TimelineDataGridNode
{
- constructor(layoutTimelineRecord, baseStartTime)
+ constructor(record, options = {})
{
- super(false, null);
+ console.assert(record instanceof WI.LayoutTimelineRecord);
- this._record = layoutTimelineRecord;
- this._baseStartTime = baseStartTime || 0;
+ super([record], options);
}
// Public
- get records()
- {
- return [this._record];
- }
-
get data()
{
- if (!this._cachedData) {
- this._cachedData = {
- type: this._record.eventType,
- name: this.displayName(),
- width: this._record.width,
- height: this._record.height,
- area: this._record.width * this._record.height,
- startTime: this._record.startTime,
- totalTime: this._record.duration,
- location: this._record.initiatorCallFrame,
- };
- }
+ if (this._cachedData)
+ return this._cachedData;
+ this._cachedData = super.data;
+ this._cachedData.type = this.record.eventType;
+ this._cachedData.name = this.displayName();
+ this._cachedData.width = this.record.width;
+ this._cachedData.height = this.record.height;
+ this._cachedData.area = this.record.width * this.record.height;
+ this._cachedData.startTime = this.record.startTime - (this.graphDataSource ? this.graphDataSource.zeroTime : 0);
+ this._cachedData.totalTime = this.record.duration;
+ this._cachedData.location = this.record.initiatorCallFrame;
return this._cachedData;
}
@@ -61,6 +54,7 @@
createCellContent(columnIdentifier, cell)
{
var value = this.data[columnIdentifier];
+ const higherResolution = true;
switch (columnIdentifier) {
case "name":
@@ -75,10 +69,10 @@
return isNaN(value) ? emDash : WI.UIString("%dpx\u00B2").format(value);
case "startTime":
- return isNaN(value) ? emDash : Number.secondsToString(value - this._baseStartTime, true);
+ return isNaN(value) ? emDash : Number.secondsToString(value, higherResolution);
case "totalTime":
- return isNaN(value) ? emDash : Number.secondsToString(value, true);
+ return isNaN(value) ? emDash : Number.secondsToString(value, higherResolution);
}
return super.createCellContent(columnIdentifier, cell);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineView.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineView.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineView.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -204,7 +204,9 @@
return;
for (var layoutTimelineRecord of this._pendingRecords) {
- let dataGridNode = new WI.LayoutTimelineDataGridNode(layoutTimelineRecord, this.zeroTime);
+ let dataGridNode = new WI.LayoutTimelineDataGridNode(layoutTimelineRecord, {
+ graphDataSource: this,
+ });
this._dataGrid.addRowInSortOrder(dataGridNode);
@@ -217,14 +219,24 @@
}
let childRecord = entry.children[entry.index];
- console.assert(childRecord.type === WI.TimelineRecord.Type.Layout, childRecord);
- let childDataGridNode = new WI.LayoutTimelineDataGridNode(childRecord, this.zeroTime);
+ const options = {
+ graphDataSource: this,
+ };
+ let childDataGridNode = null;
+ if (childRecord.type === WI.TimelineRecord.Type.Script)
+ childDataGridNode = new WI.ScriptTimelineDataGridNode(childRecord, options);
+ else {
+ console.assert(childRecord.type === WI.TimelineRecord.Type.Layout, childRecord);
+ childDataGridNode = new WI.LayoutTimelineDataGridNode(childRecord, options);
+ }
+
console.assert(entry.parentDataGridNode, "Missing parent node for entry.", entry);
this._dataGrid.addRowInSortOrder(childDataGridNode, entry.parentDataGridNode);
if (childDataGridNode && childRecord.children.length)
stack.push({children: childRecord.children, parentDataGridNode: childDataGridNode, index: 0});
+
++entry.index;
}
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/MediaTimelineDataGridNode.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/MediaTimelineDataGridNode.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/MediaTimelineDataGridNode.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -25,20 +25,15 @@
WI.MediaTimelineDataGridNode = class MediaTimelineDataGridNode extends WI.TimelineDataGridNode
{
- constructor(record, graphDataSource)
+ constructor(record, options = {})
{
console.assert(record instanceof WI.MediaTimelineRecord);
- const includesGraph = false;
- super(includesGraph, graphDataSource);
-
- this._records = [record];
+ super([record], options);
}
// Public
- get records() { return this._records; }
-
get data()
{
if (this._cachedData)
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/MediaTimelineView.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/MediaTimelineView.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/MediaTimelineView.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -186,7 +186,9 @@
if (timelineRecord.domEvent && timelineRecord.domEvent.originator)
this._dataGrid.setColumnVisible("originator", true);
- this._dataGrid.addRowInSortOrder(new WI.MediaTimelineDataGridNode(timelineRecord, this));
+ this._dataGrid.addRowInSortOrder(new WI.MediaTimelineDataGridNode(timelineRecord, {
+ graphDataSource: this,
+ }));
}
this._pendingRecords = [];
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTimelineView.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTimelineView.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTimelineView.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -257,9 +257,11 @@
if (dataGridNode)
continue;
- const includesGraph = false;
- const shouldShowPopover = true;
- dataGridNode = new WI.ResourceTimelineDataGridNode(resourceTimelineRecord, includesGraph, this, shouldShowPopover);
+ dataGridNode = new WI.ResourceTimelineDataGridNode(resourceTimelineRecord, {
+ graphDataSource: this,
+ shouldShowPopover: true,
+ });
+
this._resourceDataGridNodeMap.set(resourceTimelineRecord.resource, dataGridNode);
this._dataGrid.addRowInSortOrder(dataGridNode);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/OverviewTimelineView.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/OverviewTimelineView.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/OverviewTimelineView.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -220,9 +220,10 @@
if (!resourceTimelineRecord)
resourceTimelineRecord = new WI.ResourceTimelineRecord(resource);
- const includesGraph = true;
- const shouldShowPopover = false;
- let resourceDataGridNode = new WI.ResourceTimelineDataGridNode(resourceTimelineRecord, includesGraph, this, shouldShowPopover);
+ let resourceDataGridNode = new WI.ResourceTimelineDataGridNode(resourceTimelineRecord, {
+ graphDataSource: this,
+ includesGraph: true,
+ });
this._resourceDataGridNodeMap.set(resource, resourceDataGridNode);
let expandedByDefault = false;
@@ -253,7 +254,9 @@
_addSourceCodeTimeline(sourceCodeTimeline)
{
let parentDataGridNode = sourceCodeTimeline.sourceCodeLocation ? this._addResourceToDataGridIfNeeded(sourceCodeTimeline.sourceCode) : null;
- let sourceCodeTimelineDataGridNode = new WI.SourceCodeTimelineTimelineDataGridNode(sourceCodeTimeline, this);
+ let sourceCodeTimelineDataGridNode = new WI.SourceCodeTimelineTimelineDataGridNode(sourceCodeTimeline, {
+ graphDataSource: this,
+ });
this._resourceDataGridNodeMap.set(sourceCodeTimeline, sourceCodeTimelineDataGridNode);
this._insertDataGridNode(sourceCodeTimelineDataGridNode, parentDataGridNode);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ProfileNodeDataGridNode.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ProfileNodeDataGridNode.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ProfileNodeDataGridNode.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -25,93 +25,53 @@
WI.ProfileNodeDataGridNode = class ProfileNodeDataGridNode extends WI.TimelineDataGridNode
{
- constructor(profileNode, baseStartTime, rangeStartTime, rangeEndTime)
+ constructor(profileNode, options = {})
{
- var hasChildren = !!profileNode.childNodes.length;
+ console.assert(profileNode instanceof WI.ProfileNode);
- super(false, null, hasChildren);
+ options.hasChildren = !!profileNode.childNodes.length;
+ super(null, options);
+
this._profileNode = profileNode;
- this._baseStartTime = baseStartTime || 0;
- this._rangeStartTime = rangeStartTime || 0;
- this._rangeEndTime = typeof rangeEndTime === "number" ? rangeEndTime : Infinity;
- this._cachedData = null;
-
this.addEventListener("populate", this._populate, this);
}
// Public
- get profileNode()
- {
- return this._profileNode;
- }
+ get profileNode() { return this._profileNode; }
- get records()
+ get data()
{
- return null;
- }
+ if (this._cachedData)
+ return this._cachedData;
- get baseStartTime()
- {
- return this._baseStartTime;
- }
+ let baseStartTime = 0;
+ let rangeStartTime = 0;
+ let rangeEndTime = Infinity;
+ if (this.graphDataSource) {
+ baseStartTime = this.graphDataSource.zeroTime;
+ rangeStartTime = this.graphDataSource.startTime;
+ rangeEndTime = this.graphDataSource.endTime;
+ }
- get rangeStartTime()
- {
- return this._rangeStartTime;
- }
+ let callInfo = this._profileNode.computeCallInfoForTimeRange(rangeStartTime, rangeEndTime);
- get rangeEndTime()
- {
- return this._rangeEndTime;
- }
+ this._cachedData = super.data;
+ for (let key in callInfo)
+ this._cachedData[key] = callInfo[key];
+ this._cachedData.startTime -= baseStartTime;
+ this._cachedData.name = this.displayName();
+ this._cachedData.location = this._profileNode.sourceCodeLocation;
- get data()
- {
- if (!this._cachedData) {
- this._cachedData = this._profileNode.computeCallInfoForTimeRange(this._rangeStartTime, this._rangeEndTime);
- this._cachedData.name = this.displayName();
- this._cachedData.location = this._profileNode.sourceCodeLocation;
- }
-
return this._cachedData;
}
- updateRangeTimes(startTime, endTime)
+ createCellContent(columnIdentifier, cell)
{
- var oldRangeStartTime = this._rangeStartTime;
- var oldRangeEndTime = this._rangeEndTime;
+ const higherResolution = true;
- if (oldRangeStartTime === startTime && oldRangeEndTime === endTime)
- return;
-
- this._rangeStartTime = startTime;
- this._rangeEndTime = endTime;
-
- // We only need a refresh if the new range time changes the visible portion of this record.
- var profileStart = this._profileNode.startTime;
- var profileEnd = this._profileNode.endTime;
- var oldStartBoundary = Number.constrain(oldRangeStartTime, profileStart, profileEnd);
- var oldEndBoundary = Number.constrain(oldRangeEndTime, profileStart, profileEnd);
- var newStartBoundary = Number.constrain(startTime, profileStart, profileEnd);
- var newEndBoundary = Number.constrain(endTime, profileStart, profileEnd);
-
- if (oldStartBoundary !== newStartBoundary || oldEndBoundary !== newEndBoundary)
- this.needsRefresh();
- }
-
- refresh()
- {
- this._data = this._profileNode.computeCallInfoForTimeRange(this._rangeStartTime, this._rangeEndTime);
- this._data.location = this._profileNode.sourceCodeLocation;
-
- super.refresh();
- }
-
- createCellContent(columnIdentifier, cell)
- {
var value = this.data[columnIdentifier];
switch (columnIdentifier) {
@@ -120,12 +80,10 @@
return value;
case "startTime":
- return isNaN(value) ? emDash : Number.secondsToString(value - this._baseStartTime, true);
-
case "selfTime":
case "totalTime":
case "averageTime":
- return isNaN(value) ? emDash : Number.secondsToString(value, true);
+ return isNaN(value) ? emDash : Number.secondsToString(value, higherResolution);
}
return super.createCellContent(columnIdentifier, cell);
@@ -186,6 +144,8 @@
this.removeChildren();
for (let node of this._profileNode.childNodes)
- this.appendChild(new WI.ProfileNodeDataGridNode(node, this.baseStartTime, this.rangeStartTime, this.rangeEndTime));
+ this.appendChild(new WI.ProfileNodeDataGridNode(node, {
+ graphDataSource: this.graphDataSource,
+ }));
}
};
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineDataGridNode.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineDataGridNode.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineDataGridNode.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -1,5 +1,5 @@
/*
- * Copyright (C) 2015 Apple Inc. All rights reserved.
+ * Copyright (C) 2019 Apple Inc. All rights reserved.
*
* Redistribution and use in source and binary forms, with or without
* modification, are permitted provided that the following conditions
@@ -25,45 +25,35 @@
WI.RenderingFrameTimelineDataGridNode = class RenderingFrameTimelineDataGridNode extends WI.TimelineDataGridNode
{
- constructor(renderingFrameTimelineRecord, baseStartTime)
+ constructor(record, options = {})
{
- super(false, null);
+ console.assert(record instanceof WI.RenderingFrameTimelineRecord);
- this._record = renderingFrameTimelineRecord;
- this._baseStartTime = baseStartTime || 0;
+ super([record], options);
}
// Public
- get records()
- {
- return [this._record];
- }
-
get data()
{
- if (!this._cachedData) {
- let name = WI.TimelineTabContentView.displayNameForRecord(this._record);
- let scriptTime = this._record.durationForTask(WI.RenderingFrameTimelineRecord.TaskType.Script);
- let layoutTime = this._record.durationForTask(WI.RenderingFrameTimelineRecord.TaskType.Layout);
- let paintTime = this._record.durationForTask(WI.RenderingFrameTimelineRecord.TaskType.Paint);
- let otherTime = this._record.durationForTask(WI.RenderingFrameTimelineRecord.TaskType.Other);
- this._cachedData = {
- name,
- startTime: this._record.startTime,
- totalTime: this._record.duration,
- scriptTime,
- layoutTime,
- paintTime,
- otherTime,
- };
- }
+ if (this._cachedData)
+ return this._cachedData;
+ this._cachedData = super.data;
+ this._cachedData.name = WI.TimelineTabContentView.displayNameForRecord(this.record);
+ this._cachedData.startTime = this.record.startTime - (this.graphDataSource ? this.graphDataSource.zeroTime : 0);
+ this._cachedData.totalTime = this.record.duration;
+ this._cachedData.scriptTime = this.record.durationForTask(WI.RenderingFrameTimelineRecord.TaskType.Script);
+ this._cachedData.layoutTime = this.record.durationForTask(WI.RenderingFrameTimelineRecord.TaskType.Layout);
+ this._cachedData.paintTime = this.record.durationForTask(WI.RenderingFrameTimelineRecord.TaskType.Paint);
+ this._cachedData.otherTime = this.record.durationForTask(WI.RenderingFrameTimelineRecord.TaskType.Other);
return this._cachedData;
}
createCellContent(columnIdentifier, cell)
{
+ const higherResolution = true;
+
var value = this.data[columnIdentifier];
switch (columnIdentifier) {
@@ -72,7 +62,7 @@
return value;
case "startTime":
- return isNaN(value) ? emDash : Number.secondsToString(value - this._baseStartTime, true);
+ return isNaN(value) ? emDash : Number.secondsToString(value, higherResolution);
case "scriptTime":
case "layoutTime":
@@ -79,7 +69,7 @@
case "paintTime":
case "otherTime":
case "totalTime":
- return (isNaN(value) || value === 0) ? emDash : Number.secondsToString(value, true);
+ return (isNaN(value) || value === 0) ? emDash : Number.secondsToString(value, higherResolution);
}
return super.createCellContent(columnIdentifier, cell);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineView.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineView.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineView.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -235,7 +235,9 @@
for (let renderingFrameTimelineRecord of this._pendingRecords) {
console.assert(renderingFrameTimelineRecord instanceof WI.RenderingFrameTimelineRecord);
- let dataGridNode = new WI.RenderingFrameTimelineDataGridNode(renderingFrameTimelineRecord, this.zeroTime);
+ let dataGridNode = new WI.RenderingFrameTimelineDataGridNode(renderingFrameTimelineRecord, {
+ graphDataSource: this,
+ });
this._dataGrid.addRowInSortOrder(dataGridNode);
let stack = [{children: renderingFrameTimelineRecord.children, parentDataGridNode: dataGridNode, index: 0}];
@@ -249,7 +251,9 @@
let childRecord = entry.children[entry.index];
let childDataGridNode = null;
if (childRecord.type === WI.TimelineRecord.Type.Layout) {
- childDataGridNode = new WI.LayoutTimelineDataGridNode(childRecord, this.zeroTime);
+ childDataGridNode = new WI.LayoutTimelineDataGridNode(childRecord, {
+ graphDataSource: this,
+ });
this._dataGrid.addRowInSortOrder(childDataGridNode, entry.parentDataGridNode);
} else if (childRecord.type === WI.TimelineRecord.Type.Script) {
@@ -259,12 +263,16 @@
rootNodes = childRecord.profile.topDownRootNodes;
}
- childDataGridNode = new WI.ScriptTimelineDataGridNode(childRecord, this.zeroTime);
+ childDataGridNode = new WI.ScriptTimelineDataGridNode(childRecord, {
+ graphDataSource: this,
+ });
this._dataGrid.addRowInSortOrder(childDataGridNode, entry.parentDataGridNode);
for (let profileNode of rootNodes) {
- let profileNodeDataGridNode = new WI.ProfileNodeDataGridNode(profileNode, this.zeroTime, this.startTime, this.endTime);
+ let profileNodeDataGridNode = new WI.ProfileNodeDataGridNode(profileNode, {
+ graphDataSource: this,
+ });
this._dataGrid.addRowInSortOrder(profileNodeDataGridNode, childDataGridNode);
}
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.css (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.css 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.css 2019-03-20 17:43:05 UTC (rev 243213)
@@ -37,7 +37,7 @@
}
.resource-timing-popover-content .data-grid td.graph-column {
- padding: 4px 0 0;
+ padding: 4px 2px 0;
}
.resource-timing-popover-content .data-grid table.data {
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -25,37 +25,32 @@
WI.ResourceTimelineDataGridNode = class ResourceTimelineDataGridNode extends WI.TimelineDataGridNode
{
- constructor(resourceTimelineRecord, includesGraph, graphDataSource, shouldShowPopover)
+ constructor(record, options = {})
{
- super(includesGraph, graphDataSource);
+ console.assert(record instanceof WI.ResourceTimelineRecord);
- this._resource = resourceTimelineRecord.resource;
- this._record = resourceTimelineRecord;
- this._shouldShowPopover = shouldShowPopover;
+ super([record], options);
- this._resource.addEventListener(WI.Resource.Event.LoadingDidFinish, this._needsRefresh, this);
- this._resource.addEventListener(WI.Resource.Event.LoadingDidFail, this._needsRefresh, this);
- this._resource.addEventListener(WI.Resource.Event.URLDidChange, this._needsRefresh, this);
+ this._shouldShowPopover = options.shouldShowPopover;
- if (includesGraph)
- this._record.addEventListener(WI.TimelineRecord.Event.Updated, this._timelineRecordUpdated, this);
+ this.resource.addEventListener(WI.Resource.Event.LoadingDidFinish, this._needsRefresh, this);
+ this.resource.addEventListener(WI.Resource.Event.LoadingDidFail, this._needsRefresh, this);
+ this.resource.addEventListener(WI.Resource.Event.URLDidChange, this._needsRefresh, this);
+
+ if (options.includesGraph)
+ this.record.addEventListener(WI.TimelineRecord.Event.Updated, this._timelineRecordUpdated, this);
else {
- this._resource.addEventListener(WI.Resource.Event.TypeDidChange, this._needsRefresh, this);
- this._resource.addEventListener(WI.Resource.Event.SizeDidChange, this._needsRefresh, this);
- this._resource.addEventListener(WI.Resource.Event.TransferSizeDidChange, this._needsRefresh, this);
+ this.resource.addEventListener(WI.Resource.Event.TypeDidChange, this._needsRefresh, this);
+ this.resource.addEventListener(WI.Resource.Event.SizeDidChange, this._needsRefresh, this);
+ this.resource.addEventListener(WI.Resource.Event.TransferSizeDidChange, this._needsRefresh, this);
}
}
// Public
- get records()
- {
- return [this._record];
- }
-
get resource()
{
- return this._resource;
+ return this.record.resource;
}
get data()
@@ -63,40 +58,28 @@
if (this._cachedData)
return this._cachedData;
- var resource = this._resource;
- var data = ""
-
- if (!this._includesGraph) {
- var zeroTime = this.graphDataSource ? this.graphDataSource.zeroTime : 0;
-
- data.domain = WI.displayNameForHost(resource.urlComponents.host);
- data.scheme = resource.urlComponents.scheme ? resource.urlComponents.scheme.toUpperCase() : "";
- data.method = resource.requestMethod;
- data.type = resource.type;
- data.statusCode = resource.statusCode;
- data.cached = resource.cached;
- data.size = resource.size;
- data.transferSize = !isNaN(resource.networkTotalTransferSize) ? resource.networkTotalTransferSize : resource.estimatedTotalTransferSize;
- data.requestSent = resource.requestSentTimestamp - zeroTime;
- data.duration = resource.receiveDuration;
- data.latency = resource.latency;
- data.protocol = resource.protocol;
- data.priority = resource.priority;
- data.remoteAddress = resource.remoteAddress;
- data.connectionIdentifier = resource.connectionIdentifier;
- }
-
- data.graph = this._record.startTime;
-
- this._cachedData = data;
- return data;
+ this._cachedData = super.data;
+ this._cachedData.domain = WI.displayNameForHost(this.resource.urlComponents.host);
+ this._cachedData.scheme = this.resource.urlComponents.scheme ? this.resource.urlComponents.scheme.toUpperCase() : "";
+ this._cachedData.method = this.resource.requestMethod;
+ this._cachedData.type = this.resource.type;
+ this._cachedData.statusCode = this.resource.statusCode;
+ this._cachedData.cached = this.resource.cached;
+ this._cachedData.size = this.resource.size;
+ this._cachedData.transferSize = !isNaN(this.resource.networkTotalTransferSize) ? this.resource.networkTotalTransferSize : this.resource.estimatedTotalTransferSize;
+ this._cachedData.requestSent = this.resource.requestSentTimestamp - (this.graphDataSource ? this.graphDataSource.zeroTime : 0);
+ this._cachedData.duration = this.resource.receiveDuration;
+ this._cachedData.latency = this.resource.latency;
+ this._cachedData.protocol = this.resource.protocol;
+ this._cachedData.priority = this.resource.priority;
+ this._cachedData.remoteAddress = this.resource.remoteAddress;
+ this._cachedData.connectionIdentifier = this.resource.connectionIdentifier;
+ return this._cachedData;
}
createCellContent(columnIdentifier, cell)
{
- let resource = this._resource;
-
- if (resource.hadLoadingError())
+ if (this.resource.hadLoadingError())
cell.classList.add("error");
let value = this.data[columnIdentifier];
@@ -104,7 +87,7 @@
switch (columnIdentifier) {
case "name":
cell.classList.add(...this.iconClassNames());
- cell.title = resource.displayURL;
+ cell.title = this.resource.displayURL;
this._updateStatus(cell);
return this._createNameCellDocumentFragment();
@@ -114,7 +97,7 @@
return text;
case "statusCode":
- cell.title = resource.statusText || "";
+ cell.title = this.resource.statusText || "";
return value || emDash;
case "cached":
@@ -180,7 +163,7 @@
appendContextMenuItems(contextMenu)
{
- WI.appendContextMenuItemsForSourceCode(contextMenu, this._resource);
+ WI.appendContextMenuItemsForSourceCode(contextMenu, this.resource);
}
// Protected
@@ -213,7 +196,7 @@
filterableDataForColumn(columnIdentifier)
{
if (columnIdentifier === "name")
- return this._resource.url;
+ return this.resource.url;
return super.filterableDataForColumn(columnIdentifier);
}
@@ -226,8 +209,8 @@
fragment.append(mainTitle);
// Show the host as the subtitle if it is different from the main resource or if this is the main frame's main resource.
- let frame = this._resource.parentFrame;
- let isMainResource = this._resource.isMainResource();
+ let frame = this.resource.parentFrame;
+ let isMainResource = this.resource.isMainResource();
let parentResourceHost;
if (frame && isMainResource) {
// When the resource is a main resource, get the host from the current frame's parent frame instead of the current frame.
@@ -237,8 +220,8 @@
parentResourceHost = frame.mainResource.urlComponents.host;
}
- if (parentResourceHost !== this._resource.urlComponents.host || frame.isMainFrame() && isMainResource) {
- let subtitle = WI.displayNameForHost(this._resource.urlComponents.host);
+ if (parentResourceHost !== this.resource.urlComponents.host || frame.isMainFrame() && isMainResource) {
+ let subtitle = WI.displayNameForHost(this.resource.urlComponents.host);
if (mainTitle !== subtitle) {
let subtitleElement = document.createElement("span");
subtitleElement.classList.add("subtitle");
@@ -252,12 +235,12 @@
_cachedCellContent()
{
- if (!this._resource.hasResponse())
+ if (!this.resource.hasResponse())
return emDash;
- let responseSource = this._resource.responseSource;
+ let responseSource = this.resource.responseSource;
if (responseSource === WI.Resource.ResponseSource.MemoryCache || responseSource === WI.Resource.ResponseSource.DiskCache) {
- console.assert(this._resource.cached, "This resource has a cache responseSource it should also be marked as cached", this._resource);
+ console.assert(this.resource.cached, "This resource has a cache responseSource it should also be marked as cached", this.resource);
let span = document.createElement("span");
let cacheType = document.createElement("span");
cacheType.classList = "cache-type";
@@ -267,7 +250,7 @@
}
let fragment = document.createDocumentFragment();
- fragment.append(this._resource.cached ? WI.UIString("Yes") : WI.UIString("No"));
+ fragment.append(this.resource.cached ? WI.UIString("Yes") : WI.UIString("No"));
return fragment;
}
@@ -286,7 +269,7 @@
_timelineRecordUpdated(event)
{
- if (this.isRecordVisible(this._record))
+ if (this.isRecordVisible(this.record))
this.needsGraphRefresh();
}
@@ -296,21 +279,21 @@
ignoreNetworkTab: true,
ignoreSearchTab: true,
};
- WI.showSourceCode(this._resource, options);
+ WI.showSourceCode(this.resource, options);
}
_updateStatus(cell)
{
- if (this._resource.failed)
+ if (this.resource.failed)
cell.classList.add("error");
else {
cell.classList.remove("error");
- if (this._resource.finished)
+ if (this.resource.finished)
this.createGoToArrowButton(cell, this._dataGridNodeGoToArrowClicked.bind(this));
}
- if (this._resource.isLoading()) {
+ if (this.resource.isLoading()) {
if (!this._spinner)
this._spinner = new WI.IndeterminateProgressSpinner;
let contentElement = cell.firstChild;
@@ -386,14 +369,10 @@
let graphDataSource = {
get secondsPerPixel() { return resource.totalDuration / WI.ResourceTimelineDataGridNode.PopoverGraphColumnWidthPixels; },
get zeroTime() { return resource.firstTimestamp; },
- get startTime() { return resource.firstTimestamp; },
- get currentTime() { return this.endTime; },
-
- get endTime()
- {
- let endTimePadding = this.secondsPerPixel * WI.TimelineRecordBar.MinimumWidthPixels;
- return resource.lastTimestamp + endTimePadding;
- }
+ get startTime() { return this.zeroTime; },
+ get currentTime() { return resource.lastTimestamp + this._extraTimePadding; },
+ get endTime() { return this.currentTime; },
+ get _extraTimePadding() { return this.secondsPerPixel * WI.TimelineRecordBar.MinimumWidthPixels; },
};
if (resource.timingData.redirectEnd - resource.timingData.redirectStart) {
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimingPopoverDataGridNode.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimingPopoverDataGridNode.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimingPopoverDataGridNode.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -1,5 +1,5 @@
/*
- * Copyright (C) 2016 Apple Inc. All rights reserved.
+ * Copyright (C) 2019 Apple Inc. All rights reserved.
*
* Redistribution and use in source and binary forms, with or without
* modification, are permitted provided that the following conditions
@@ -27,21 +27,27 @@
{
constructor(description, startTime, endTime, graphDataSource)
{
- super(true, graphDataSource);
+ let record = new WI.TimelineRecord(WI.TimelineRecord.Type.Network, startTime, endTime);
+ super([record], {
+ includesGraph: true,
+ graphDataSource,
+ });
const higherResolution = true;
let duration = Number.secondsToMillisecondsString(endTime - startTime, higherResolution);
this._data = {description, duration};
- this._record = new WI.TimelineRecord(WI.TimelineRecord.Type.Network, startTime, endTime);
}
// Public
- get records() { return [this._record]; }
get data() { return this._data; }
- get selectable() { return false; }
+ get selectable()
+ {
+ return false;
+ }
+
// Protected
createCellContent(columnIdentifier, cell)
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ScriptDetailsTimelineView.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ScriptDetailsTimelineView.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ScriptDetailsTimelineView.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -179,9 +179,11 @@
if (this.startTime !== this._oldStartTime || this.endTime !== this._oldEndTime) {
let dataGridNode = this._dataGrid.children[0];
while (dataGridNode) {
- dataGridNode.updateRangeTimes(this.startTime, this.endTime);
if (dataGridNode.revealed)
- dataGridNode.refreshIfNeeded();
+ dataGridNode.refresh();
+ else
+ dataGridNode.needsRefresh();
+
dataGridNode = dataGridNode.traverseNextNode(false, null, true);
}
@@ -202,10 +204,6 @@
if (!this._pendingRecords.length)
return;
- let zeroTime = this.zeroTime;
- let startTime = this.startTime;
- let endTime = this.endTime;
-
for (let scriptTimelineRecord of this._pendingRecords) {
let rootNodes = [];
if (scriptTimelineRecord.profile) {
@@ -213,11 +211,15 @@
rootNodes = scriptTimelineRecord.profile.topDownRootNodes;
}
- let dataGridNode = new WI.ScriptTimelineDataGridNode(scriptTimelineRecord, zeroTime);
+ let dataGridNode = new WI.ScriptTimelineDataGridNode(scriptTimelineRecord, {
+ graphDataSource: this,
+ });
this._dataGrid.addRowInSortOrder(dataGridNode);
for (let profileNode of rootNodes) {
- let profileNodeDataGridNode = new WI.ProfileNodeDataGridNode(profileNode, zeroTime, startTime, endTime);
+ let profileNodeDataGridNode = new WI.ProfileNodeDataGridNode(profileNode, {
+ graphDataSource: this,
+ });
this._dataGrid.addRowInSortOrder(profileNodeDataGridNode, dataGridNode);
}
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ScriptTimelineDataGridNode.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ScriptTimelineDataGridNode.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ScriptTimelineDataGridNode.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -1,5 +1,5 @@
/*
- * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
+ * Copyright (C) 2019 Apple Inc. All rights reserved.
*
* Redistribution and use in source and binary forms, with or without
* modification, are permitted provided that the following conditions
@@ -25,65 +25,51 @@
WI.ScriptTimelineDataGridNode = class ScriptTimelineDataGridNode extends WI.TimelineDataGridNode
{
- constructor(scriptTimelineRecord, baseStartTime, rangeStartTime, rangeEndTime)
+ constructor(record, options = {})
{
- super(false, null);
+ console.assert(record instanceof WI.ScriptTimelineRecord);
- this._record = scriptTimelineRecord;
- this._baseStartTime = baseStartTime || 0;
- this._rangeStartTime = rangeStartTime || 0;
- this._rangeEndTime = typeof rangeEndTime === "number" ? rangeEndTime : Infinity;
+ super([record], options);
}
// Public
- get records()
+ get data()
{
- return [this._record];
- }
+ if (this._cachedData)
+ return this._cachedData;
- get baseStartTime()
- {
- return this._baseStartTime;
- }
+ let baseStartTime = 0;
+ let rangeStartTime = 0;
+ let rangeEndTime = Infinity;
+ if (this.graphDataSource) {
+ baseStartTime = this.graphDataSource.zeroTime;
+ rangeStartTime = this.graphDataSource.startTime;
+ rangeEndTime = this.graphDataSource.endTime;
+ }
- get rangeStartTime()
- {
- return this._rangeStartTime;
- }
+ let startTime = this.record.startTime;
+ let duration = this.record.startTime + this.record.duration - startTime;
- get rangeEndTime()
- {
- return this._rangeEndTime;
- }
-
- get data()
- {
- if (!this._cachedData) {
- var startTime = this._record.startTime;
- var duration = this._record.startTime + this._record.duration - startTime;
- var callFrameOrSourceCodeLocation = this._record.initiatorCallFrame || this._record.sourceCodeLocation;
-
- // COMPATIBILITY (iOS 8): Profiles included per-call information and can be finely partitioned.
- if (this._record.profile) {
- var _oneRootNode_ = this._record.profile.topDownRootNodes[0];
- if (oneRootNode && oneRootNode.calls) {
- startTime = Math.max(this._rangeStartTime, this._record.startTime);
- duration = Math.min(this._record.startTime + this._record.duration, this._rangeEndTime) - startTime;
- }
+ // COMPATIBILITY (iOS 8): Profiles included per-call information and can be finely partitioned.
+ if (this.record.profile) {
+ let _oneRootNode_ = this.record.profile.topDownRootNodes[0];
+ if (oneRootNode && oneRootNode.calls) {
+ startTime = Math.max(rangeStartTime, this.record.startTime);
+ duration = Math.min(this.record.startTime + this.record.duration, rangeEndTime) - startTime;
}
-
- this._cachedData = {
- eventType: this._record.eventType,
- startTime,
- selfTime: duration,
- totalTime: duration,
- averageTime: duration,
- callCount: this._record.callCountOrSamples,
- location: callFrameOrSourceCodeLocation,
- };
}
+ this._cachedData = super.data;
+ this._cachedData.type = this.record.eventType;
+ this._cachedData.name = this.displayName();
+ this._cachedData.startTime = startTime - baseStartTime;
+ this._cachedData.selfTime = duration;
+ this._cachedData.totalTime = duration;
+ this._cachedData.averageTime = duration;
+ this._cachedData.callCount = this.record.callCountOrSamples;
+ this._cachedData.location = this.record.initiatorCallFrame || this.record.sourceCodeLocation;
+
return this._cachedData;
}
@@ -94,9 +80,9 @@
this._subtitle = "";
- if (this._record.eventType === WI.ScriptTimelineRecord.EventType.TimerInstalled) {
- let timeoutString = Number.secondsToString(this._record.details.timeout / 1000);
- if (this._record.details.repeating)
+ if (this.record.eventType === WI.ScriptTimelineRecord.EventType.TimerInstalled) {
+ let timeoutString = Number.secondsToString(this.record.details.timeout / 1000);
+ if (this.record.details.repeating)
this._subtitle = WI.UIString("%s interval").format(timeoutString);
else
this._subtitle = WI.UIString("%s delay").format(timeoutString);
@@ -105,35 +91,10 @@
return this._subtitle;
}
- updateRangeTimes(startTime, endTime)
+ createCellContent(columnIdentifier, cell)
{
- var oldRangeStartTime = this._rangeStartTime;
- var oldRangeEndTime = this._rangeEndTime;
+ const higherResolution = true;
- if (oldRangeStartTime === startTime && oldRangeEndTime === endTime)
- return;
-
- this._rangeStartTime = startTime;
- this._rangeEndTime = endTime;
-
- // If we have no duration the range does not matter.
- if (!this._record.duration)
- return;
-
- // We only need a refresh if the new range time changes the visible portion of this record.
- var recordStart = this._record.startTime;
- var recordEnd = this._record.startTime + this._record.duration;
- var oldStartBoundary = Number.constrain(oldRangeStartTime, recordStart, recordEnd);
- var oldEndBoundary = Number.constrain(oldRangeEndTime, recordStart, recordEnd);
- var newStartBoundary = Number.constrain(startTime, recordStart, recordEnd);
- var newEndBoundary = Number.constrain(endTime, recordStart, recordEnd);
-
- if (oldStartBoundary !== newStartBoundary || oldEndBoundary !== newEndBoundary)
- this.needsRefresh();
- }
-
- createCellContent(columnIdentifier, cell)
- {
var value = this.data[columnIdentifier];
switch (columnIdentifier) {
@@ -142,15 +103,19 @@
return this._createNameCellDocumentFragment();
case "startTime":
- return isNaN(value) ? emDash : Number.secondsToString(value - this._baseStartTime, true);
-
case "selfTime":
case "totalTime":
case "averageTime":
- return isNaN(value) ? emDash : Number.secondsToString(value, true);
+ return isNaN(value) ? emDash : Number.secondsToString(value, higherResolution);
case "callCount":
return isNaN(value) ? emDash : value.toLocaleString();
+
+ // Necessary to be displayed in WI.LayoutTimelineView.
+ case "width":
+ case "height":
+ case "area":
+ return zeroWidthSpace;
}
return super.createCellContent(columnIdentifier, cell);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SourceCodeTimelineTimelineDataGridNode.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/SourceCodeTimelineTimelineDataGridNode.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SourceCodeTimelineTimelineDataGridNode.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -25,9 +25,10 @@
WI.SourceCodeTimelineTimelineDataGridNode = class SourceCodeTimelineTimelineDataGridNode extends WI.TimelineDataGridNode
{
- constructor(sourceCodeTimeline, graphDataSource)
+ constructor(sourceCodeTimeline, options = {})
{
- super(true, graphDataSource);
+ const records = [];
+ super(records, {includesGraph: true, ...options});
this._sourceCodeTimeline = sourceCodeTimeline;
this._sourceCodeTimeline.addEventListener(WI.Timeline.Event.RecordAdded, this._timelineRecordAdded, this);
@@ -47,7 +48,12 @@
get data()
{
- return {graph: this._sourceCodeTimeline.startTime};
+ if (this._cachedData)
+ return this._cachedData;
+
+ this._cachedData = super.data;
+ this._cachedData.graph = this._sourceCodeTimeline.startTime;
+ return this._cachedData;
}
createCellContent(columnIdentifier, cell)
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineDataGridNode.js (243212 => 243213)
--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineDataGridNode.js 2019-03-20 16:47:55 UTC (rev 243212)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineDataGridNode.js 2019-03-20 17:43:05 UTC (rev 243213)
@@ -25,16 +25,18 @@
WI.TimelineDataGridNode = class TimelineDataGridNode extends WI.DataGridNode
{
- constructor(includesGraph, graphDataSource, hasChildren)
+ constructor(records, options = {})
{
- super({}, hasChildren);
+ super({}, options.hasChildren);
this.copyable = false;
- this._includesGraph = includesGraph || false;
- this._graphDataSource = graphDataSource || null;
+ this._records = records;
+ this._includesGraph = options.includesGraph || false;
+ this._graphDataSource = options.graphDataSource || null;
+ this._cachedData = null;
- if (graphDataSource) {
+ if (this._graphDataSource) {
this._graphContainerElement = document.createElement("div");
this._timelineRecordBars = [];
}
@@ -42,17 +44,13 @@
// Public
+ get records() { return this._records; }
+
get record()
{
return this.records && this.records.length ? this.records[0] : null;
}
- get records()
- {
- // Implemented by subclasses.
- return [];
- }
-
get graphDataSource()
{
return this._graphDataSource;
@@ -63,8 +61,9 @@
if (!this._graphDataSource)
return {};
- var records = this.records || [];
- return {graph: records.length ? records[0].startTime : 0};
+ return {
+ graph: this.record ? this.record.startTime : 0,
+ };
}
collapse()
@@ -207,6 +206,8 @@
refresh()
{
+ this._cachedData = null;
+
if (this._graphDataSource && this._includesGraph)
this.needsGraphRefresh();
