Web Inspector: Timelines: CPU/memory timeline bars sometimes don't draw correctly...
authordrousso@apple.com <drousso@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Sat, 18 May 2019 05:27:06 +0000 (05:27 +0000)
committerdrousso@apple.com <drousso@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Sat, 18 May 2019 05:27:06 +0000 (05:27 +0000)
https://bugs.webkit.org/show_bug.cgi?id=197440
<rdar://problem/46886315>

Reviewed by Joseph Pecoraro.

When drawing the Memory/CPU graphs, we need to know about the record immediately before/after
what's overlapping the visible range so that the graph correctly slopes off the screen.

* UserInterface/Models/Timeline.js:
(WI.Timeline.prototype.recordsInTimeRange):
(WI.Timeline.prototype.recordsOverlappingTimeRange): Deleted.
Merge `recordsOverlappingTimeRange` into `recordsInTimeRange` by accepting an options object
that determines whether to include the record before/after the first/last record that are
at all overlapping the range.

* UserInterface/Models/CPUTimelineRecord.js:
(WI.CPUTimelineRecord):
(WI.CPUTimelineRecord.get samplingRatePerSecond): Added.
(WI.CPUTimelineRecord.prototype.adjustStartTimeToLastRecord): Added.
* UserInterface/Models/MemoryTimelineRecord.js:
(WI.MemoryTimelineRecord):
(WI.MemoryTimelineRecord.get samplingRatePerSecond): Added.
(WI.MemoryTimelineRecord.prototype.adjustStartTimeToLastRecord): Added.
Adjust the `startTime` of the record by the sampling rate (which is 500ms).

* UserInterface/Models/CPUTimeline.js: Added.
(WI.CPUTimeline.prototype.addRecord):
* UserInterface/Models/MemoryTimeline.js:
(WI.MemoryTimeline.prototype.addRecord): Added.
Adjust the `startTime` of the new record to be equal to the `endTime` of the last record.

* UserInterface/Views/TimelineOverview.js:
(WI.TimelineOverview.prototype._recordSelected):
* UserInterface/Views/CPUTimelineView.js:
(WI.CPUTimelineView.prototype.layout):
(WI.CPUTimelineView.prototype._computeStatisticsData):
(WI.CPUTimelineView.prototype._attemptSelectIndicatatorTimelineRecord):
* UserInterface/Views/CPUTimelineOverviewGraph.js:
(WI.CPUTimelineOverviewGraph.prototype.layout):
(WI.CPUTimelineOverviewGraph.prototype._handleChartClick):
(WI.CPUTimelineOverviewGraph.prototype.get samplingRatePerSecond): Deleted.
(WI.CPUTimelineOverviewGraph.prototype.layout.yScaleForRecord): Deleted.

* UserInterface/Views/MemoryTimelineView.js:
(WI.MemoryTimelineView.prototype.layout):
* UserInterface/Views/MemoryTimelineOverviewGraph.js:
(WI.MemoryTimelineOverviewGraph.prototype.layout):

* UserInterface/Main.html:
* UserInterface/Test.html:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@245498 268f45cc-cd09-0410-ab3c-d52691b4dbfc

13 files changed:
Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Main.html
Source/WebInspectorUI/UserInterface/Models/CPUTimeline.js [new file with mode: 0644]
Source/WebInspectorUI/UserInterface/Models/CPUTimelineRecord.js
Source/WebInspectorUI/UserInterface/Models/MemoryTimeline.js
Source/WebInspectorUI/UserInterface/Models/MemoryTimelineRecord.js
Source/WebInspectorUI/UserInterface/Models/Timeline.js
Source/WebInspectorUI/UserInterface/Test.html
Source/WebInspectorUI/UserInterface/Views/CPUTimelineOverviewGraph.js
Source/WebInspectorUI/UserInterface/Views/CPUTimelineView.js
Source/WebInspectorUI/UserInterface/Views/MemoryTimelineOverviewGraph.js
Source/WebInspectorUI/UserInterface/Views/MemoryTimelineView.js
Source/WebInspectorUI/UserInterface/Views/TimelineOverview.js

index 26470e0..d76efb6 100644 (file)
@@ -1,5 +1,59 @@
 2019-05-17  Devin Rousso  <drousso@apple.com>
 
+        Web Inspector: Timelines: CPU/memory timeline bars sometimes don't draw correctly and jump around on scrolling
+        https://bugs.webkit.org/show_bug.cgi?id=197440
+        <rdar://problem/46886315>
+
+        Reviewed by Joseph Pecoraro.
+
+        When drawing the Memory/CPU graphs, we need to know about the record immediately before/after
+        what's overlapping the visible range so that the graph correctly slopes off the screen.
+
+        * UserInterface/Models/Timeline.js:
+        (WI.Timeline.prototype.recordsInTimeRange):
+        (WI.Timeline.prototype.recordsOverlappingTimeRange): Deleted.
+        Merge `recordsOverlappingTimeRange` into `recordsInTimeRange` by accepting an options object
+        that determines whether to include the record before/after the first/last record that are
+        at all overlapping the range.
+
+        * UserInterface/Models/CPUTimelineRecord.js:
+        (WI.CPUTimelineRecord):
+        (WI.CPUTimelineRecord.get samplingRatePerSecond): Added.
+        (WI.CPUTimelineRecord.prototype.adjustStartTimeToLastRecord): Added.
+        * UserInterface/Models/MemoryTimelineRecord.js:
+        (WI.MemoryTimelineRecord):
+        (WI.MemoryTimelineRecord.get samplingRatePerSecond): Added.
+        (WI.MemoryTimelineRecord.prototype.adjustStartTimeToLastRecord): Added.
+        Adjust the `startTime` of the record by the sampling rate (which is 500ms).
+
+        * UserInterface/Models/CPUTimeline.js: Added.
+        (WI.CPUTimeline.prototype.addRecord):
+        * UserInterface/Models/MemoryTimeline.js:
+        (WI.MemoryTimeline.prototype.addRecord): Added.
+        Adjust the `startTime` of the new record to be equal to the `endTime` of the last record.
+
+        * UserInterface/Views/TimelineOverview.js:
+        (WI.TimelineOverview.prototype._recordSelected):
+        * UserInterface/Views/CPUTimelineView.js:
+        (WI.CPUTimelineView.prototype.layout):
+        (WI.CPUTimelineView.prototype._computeStatisticsData):
+        (WI.CPUTimelineView.prototype._attemptSelectIndicatatorTimelineRecord):
+        * UserInterface/Views/CPUTimelineOverviewGraph.js:
+        (WI.CPUTimelineOverviewGraph.prototype.layout):
+        (WI.CPUTimelineOverviewGraph.prototype._handleChartClick):
+        (WI.CPUTimelineOverviewGraph.prototype.get samplingRatePerSecond): Deleted.
+        (WI.CPUTimelineOverviewGraph.prototype.layout.yScaleForRecord): Deleted.
+
+        * UserInterface/Views/MemoryTimelineView.js:
+        (WI.MemoryTimelineView.prototype.layout):
+        * UserInterface/Views/MemoryTimelineOverviewGraph.js:
+        (WI.MemoryTimelineOverviewGraph.prototype.layout):
+
+        * UserInterface/Main.html:
+        * UserInterface/Test.html:
+
+2019-05-17  Devin Rousso  <drousso@apple.com>
+
         Web Inspector: Audit: make it easier to jump to any returned DOM node in the Elements tab
         https://bugs.webkit.org/show_bug.cgi?id=197470
         <rdar://problem/50466774>
index 981655e..6b4d613 100644 (file)
     <script src="Models/Branch.js"></script>
     <script src="Models/Breakpoint.js"></script>
     <script src="Models/CPUInstrument.js"></script>
+    <script src="Models/CPUTimeline.js"></script>
     <script src="Models/CPUTimelineRecord.js"></script>
     <script src="Models/CSSCompletions.js"></script>
     <script src="Models/CSSKeywordCompletions.js"></script>
diff --git a/Source/WebInspectorUI/UserInterface/Models/CPUTimeline.js b/Source/WebInspectorUI/UserInterface/Models/CPUTimeline.js
new file mode 100644 (file)
index 0000000..128022f
--- /dev/null
@@ -0,0 +1,38 @@
+/*
+ * 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
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ *    notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ *    notice, this list of conditions and the following disclaimer in the
+ *    documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+WI.CPUTimeline = class CPUTimeline extends WI.Timeline
+{
+    // Public
+
+    addRecord(record)
+    {
+        let lastRecord = this.records.lastValue;
+        if (lastRecord)
+            record.adjustStartTimeToLastRecord(lastRecord);
+
+        super.addRecord(record);
+    }
+};
index 2166891..112b713 100644 (file)
@@ -27,7 +27,7 @@ WI.CPUTimelineRecord = class CPUTimelineRecord extends WI.TimelineRecord
 {
     constructor({timestamp, usage, threads})
     {
-        super(WI.TimelineRecord.Type.CPU, timestamp, timestamp);
+        super(WI.TimelineRecord.Type.CPU, timestamp - CPUTimelineRecord.samplingRatePerSecond, timestamp);
 
         console.assert(typeof timestamp === "number");
         console.assert(typeof usage === "number");
@@ -68,6 +68,14 @@ WI.CPUTimelineRecord = class CPUTimelineRecord extends WI.TimelineRecord
         }
     }
 
+    // Static
+
+    static get samplingRatePerSecond()
+    {
+        // 500ms. This matches the ResourceUsageThread sampling frequency in the backend.
+        return 0.5;
+    }
+
     // Import / Export
 
     static fromJSON(json)
@@ -95,4 +103,11 @@ WI.CPUTimelineRecord = class CPUTimelineRecord extends WI.TimelineRecord
     get workerThreadUsage() { return this._workerThreadUsage; }
     get unknownThreadUsage() { return this._unknownThreadUsage; }
     get workersData() { return this._workersData; }
+
+    adjustStartTimeToLastRecord(lastRecord)
+    {
+        console.assert(lastRecord instanceof CPUTimelineRecord);
+        console.assert(this._startTime >= lastRecord.endTime);
+        this._startTime = lastRecord.endTime;
+    }
 };
index a2f109b..4b4f060 100644 (file)
@@ -46,6 +46,15 @@ WI.MemoryTimeline = class MemoryTimeline extends WI.Timeline
 
         this._pressureEvents = [];
     }
+
+    addRecord(record)
+    {
+        let lastRecord = this.records.lastValue;
+        if (lastRecord)
+            record.adjustStartTimeToLastRecord(lastRecord);
+
+        super.addRecord(record);
+    }
 };
 
 WI.MemoryTimeline.Event = {
index 1e37b9a..787bedc 100644 (file)
@@ -27,7 +27,7 @@ WI.MemoryTimelineRecord = class MemoryTimelineRecord extends WI.TimelineRecord
 {
     constructor(timestamp, categories)
     {
-        super(WI.TimelineRecord.Type.Memory, timestamp, timestamp);
+        super(WI.TimelineRecord.Type.Memory, timestamp - MemoryTimelineRecord.samplingRatePerSecond, timestamp);
 
         console.assert(typeof timestamp === "number");
         console.assert(categories instanceof Array);
@@ -43,6 +43,12 @@ WI.MemoryTimelineRecord = class MemoryTimelineRecord extends WI.TimelineRecord
 
     // Static
 
+    static get samplingRatePerSecond()
+    {
+        // 500ms. This matches the ResourceUsageThread sampling frequency in the backend.
+        return 0.5;
+    }
+
     static memoryCategoriesFromProtocol(categories)
     {
         let javascriptSize = 0;
@@ -102,4 +108,11 @@ WI.MemoryTimelineRecord = class MemoryTimelineRecord extends WI.TimelineRecord
     get timestamp() { return this._timestamp; }
     get categories() { return this._categories; }
     get totalSize() { return this._totalSize; }
+
+    adjustStartTimeToLastRecord(lastRecord)
+    {
+        console.assert(lastRecord instanceof MemoryTimelineRecord);
+        console.assert(this._startTime >= lastRecord.endTime);
+        this._startTime = lastRecord.endTime;
+    }
 };
index 0be7ec5..28f4252 100644 (file)
@@ -41,6 +41,9 @@ WI.Timeline = class Timeline extends WI.Object
         if (type === WI.TimelineRecord.Type.Network)
             return new WI.NetworkTimeline(type);
 
+        if (type === WI.TimelineRecord.Type.CPU)
+            return new WI.CPUTimeline(type);
+
         if (type === WI.TimelineRecord.Type.Memory)
             return new WI.MemoryTimeline(type);
 
@@ -111,20 +114,9 @@ WI.Timeline = class Timeline extends WI.Object
         return (before < after) ? recordBefore : recordAfter;
     }
 
-    recordsOverlappingTimeRange(startTime, endTime)
+    recordsInTimeRange(startTime, endTime, {includeRecordBeforeStart, includeRecordAfterEnd} = {})
     {
         let lowerIndex = this._records.lowerBound(startTime, (time, record) => time - record.endTime);
-        let upperIndex = this._records.upperBound(endTime, (time, record) => time - record.startTime);
-
-        return this._records.slice(lowerIndex, upperIndex);
-    }
-
-    recordsInTimeRange(startTime, endTime, includeRecordBeforeStart)
-    {
-        let lowerIndex = this._records.lowerBound(startTime, (time, record) => time - record.startTime);
-        let upperIndex = this._records.upperBound(endTime, (time, record) => time - record.startTime);
-
-        // Include the record right before the start time.
         if (includeRecordBeforeStart && lowerIndex > 0) {
             lowerIndex--;
 
@@ -137,6 +129,10 @@ WI.Timeline = class Timeline extends WI.Object
             }
         }
 
+        let upperIndex = this._records.upperBound(endTime, (time, record) => time - record.startTime);
+        if (includeRecordAfterEnd && upperIndex < this._records.length)
+            ++upperIndex;
+
         return this._records.slice(lowerIndex, upperIndex);
     }
 
index 06f0be2..e710ec6 100644 (file)
 
     <script src="Models/Breakpoint.js"></script>
     <script src="Models/CPUInstrument.js"></script>
+    <script src="Models/CPUTimeline.js"></script>
     <script src="Models/CPUTimelineRecord.js"></script>
     <script src="Models/CSSCompletions.js"></script>
     <script src="Models/CSSKeywordCompletions.js"></script>
index 087a4a6..024314c 100644 (file)
@@ -56,14 +56,6 @@ WI.CPUTimelineOverviewGraph = class CPUTimelineOverviewGraph extends WI.Timeline
             this._processRecord(record);
     }
 
-    // Static
-
-    static get samplingRatePerSecond()
-    {
-        // 500ms. This matches the ResourceUsageThread sampling frequency in the backend.
-        return 0.5;
-    }
-
     // Protected
 
     get height()
@@ -115,22 +107,18 @@ WI.CPUTimelineOverviewGraph = class CPUTimelineOverviewGraph extends WI.Timeline
             return (size / maxCapacity) * height;
         }
 
-        const includeRecordBeforeStart = true;
-        let visibleRecords = this._cpuTimeline.recordsInTimeRange(graphStartTime, visibleEndTime, includeRecordBeforeStart);
+        let visibleRecords = this._cpuTimeline.recordsInTimeRange(graphStartTime, visibleEndTime, {
+            includeRecordBeforeStart: true,
+        });
         if (!visibleRecords.length)
             return;
 
-        function yScaleForRecord(record) {
-            return yScale(record.usage);
-        }
-
-        let intervalWidth = CPUTimelineOverviewGraph.samplingRatePerSecond / secondsPerPixel;
         const minimumDisplayHeight = 4;
 
         for (let record of visibleRecords) {
             let additionalClass = record === this.selectedRecord ? "selected" : undefined;
-            let w = intervalWidth;
-            let x = xScale(record.startTime - CPUTimelineOverviewGraph.samplingRatePerSecond);
+            let w = (record.endTime - record.startTime) / secondsPerPixel;
+            let x = xScale(record.startTime);
             let h1 = Math.max(minimumDisplayHeight, yScale(record.mainThreadUsage));
             let h2 = Math.max(minimumDisplayHeight, yScale(record.mainThreadUsage + record.workerThreadUsage));
             let h3 = Math.max(minimumDisplayHeight, yScale(record.usage));
@@ -199,7 +187,7 @@ WI.CPUTimelineOverviewGraph = class CPUTimelineOverviewGraph extends WI.Timeline
         let graphStartTime = this.startTime;
 
         let clickTime = graphStartTime + graphClickTime;
-        let record = this._cpuTimeline.closestRecordTo(clickTime + (CPUTimelineOverviewGraph.samplingRatePerSecond / 2));
+        let record = this._cpuTimeline.closestRecordTo(clickTime);
         if (!record)
             return;
 
index 1513d4e..365421d 100644 (file)
@@ -445,9 +445,10 @@ WI.CPUTimelineView = class CPUTimelineView extends WI.TimelineView
         let discontinuities = this._recording.discontinuitiesInTimeRange(graphStartTime, visibleEndTime);
         let originalDiscontinuities = discontinuities.slice();
 
-        // Don't include the record before the graph start if the graph start is within a gap.
-        let includeRecordBeforeStart = !discontinuities.length || discontinuities[0].startTime > graphStartTime;
-        let visibleRecords = this.representedObject.recordsInTimeRange(graphStartTime, visibleEndTime, includeRecordBeforeStart);
+        let visibleRecords = this.representedObject.recordsInTimeRange(graphStartTime, visibleEndTime, {
+            includeRecordBeforeStart: !discontinuities.length || discontinuities[0].startTime > graphStartTime,
+            includeRecordAfterEnd: true,
+        });
         if (!visibleRecords.length || (visibleRecords.length === 1 && visibleRecords[0].endTime < graphStartTime)) {
             this.clear();
             return;
@@ -1161,8 +1162,6 @@ WI.CPUTimelineView = class CPUTimelineView extends WI.TimelineView
         // with the data available to the frontend and is quite accurate for most
         // Main Thread activity.
 
-        const includeRecordBeforeStart = true;
-
         function incrementTypeCount(map, key) {
             let entry = map.get(key);
             if (entry)
@@ -1183,7 +1182,7 @@ WI.CPUTimelineView = class CPUTimelineView extends WI.TimelineView
         let possibleRepeatingTimers = new Set;
 
         let scriptTimeline = this._recording.timelineForRecordType(WI.TimelineRecord.Type.Script);
-        let scriptRecords = scriptTimeline ? scriptTimeline.recordsInTimeRange(startTime, endTime, includeRecordBeforeStart) : [];
+        let scriptRecords = scriptTimeline ? scriptTimeline.recordsInTimeRange(startTime, endTime, {includeRecordBeforeStart: true}) : [];
         scriptRecords = scriptRecords.filter((record) => {
             // Return true for event types that define script entries/exits.
             // Return false for events with no time ranges or if they are contained in other events.
@@ -1249,7 +1248,7 @@ WI.CPUTimelineView = class CPUTimelineView extends WI.TimelineView
         });
 
         let layoutTimeline = this._recording.timelineForRecordType(WI.TimelineRecord.Type.Layout);
-        let layoutRecords = layoutTimeline ? layoutTimeline.recordsInTimeRange(startTime, endTime, includeRecordBeforeStart) : [];
+        let layoutRecords = layoutTimeline ? layoutTimeline.recordsInTimeRange(startTime, endTime, {includeRecordBeforeStart: true}) : [];
         layoutRecords = layoutRecords.filter((record) => {
             switch (record.eventType) {
             case WI.LayoutTimelineRecord.EventType.RecalculateStyles:
@@ -1573,7 +1572,7 @@ WI.CPUTimelineView = class CPUTimelineView extends WI.TimelineView
     _attemptSelectIndicatatorTimelineRecord(startTime, endTime)
     {
         let layoutTimeline = this._recording.timelineForRecordType(WI.TimelineRecord.Type.Layout);
-        let layoutRecords = layoutTimeline ? layoutTimeline.recordsOverlappingTimeRange(startTime, endTime) : [];
+        let layoutRecords = layoutTimeline ? layoutTimeline.recordsInTimeRange(startTime, endTime, {includeRecordBeforeStart: true}) : [];
         layoutRecords = layoutRecords.filter((record) => {
             switch (record.eventType) {
             case WI.LayoutTimelineRecord.EventType.RecalculateStyles:
@@ -1597,7 +1596,7 @@ WI.CPUTimelineView = class CPUTimelineView extends WI.TimelineView
         }
 
         let scriptTimeline = this._recording.timelineForRecordType(WI.TimelineRecord.Type.Script);
-        let scriptRecords = scriptTimeline ? scriptTimeline.recordsOverlappingTimeRange(startTime, endTime) : [];
+        let scriptRecords = scriptTimeline ? scriptTimeline.recordsInTimeRange(startTime, endTime, {includeRecordBeforeStart: true}) : [];
         scriptRecords = scriptRecords.filter((record) => {
             switch (record.eventType) {
             case WI.ScriptTimelineRecord.EventType.ScriptEvaluated:
index 496092f..f272287 100644 (file)
@@ -138,11 +138,10 @@ WI.MemoryTimelineOverviewGraph = class MemoryTimelineOverviewGraph extends WI.Ti
 
         let discontinuities = this.timelineOverview.discontinuitiesInTimeRange(graphStartTime, visibleEndTime);
 
-        // Don't include the record before the graph start if the graph start is within a gap.
-        let includeRecordBeforeStart = !discontinuities.length || discontinuities[0].startTime > graphStartTime;
-
-        // FIXME: <https://webkit.org/b/153759> Web Inspector: Memory Timelines should better extend to future data
-        let visibleRecords = this._memoryTimeline.recordsInTimeRange(graphStartTime, visibleEndTime, includeRecordBeforeStart);
+        let visibleRecords = this._memoryTimeline.recordsInTimeRange(graphStartTime, visibleEndTime, {
+            includeRecordBeforeStart: !discontinuities.length || discontinuities[0].startTime > graphStartTime,
+            includeRecordAfterEnd: true,
+        });
         if (!visibleRecords.length)
             return;
 
index 5172770..31e3dbb 100644 (file)
@@ -197,11 +197,10 @@ WI.MemoryTimelineView = class MemoryTimelineView extends WI.TimelineView
 
         let discontinuities = this._recording.discontinuitiesInTimeRange(graphStartTime, visibleEndTime);
 
-        // Don't include the record before the graph start if the graph start is within a gap.
-        let includeRecordBeforeStart = !discontinuities.length || discontinuities[0].startTime > graphStartTime;
-
-        // FIXME: <https://webkit.org/b/153759> Web Inspector: Memory Timelines should better extend to future data
-        let visibleRecords = this.representedObject.recordsInTimeRange(graphStartTime, visibleEndTime, includeRecordBeforeStart);
+        let visibleRecords = this.representedObject.recordsInTimeRange(graphStartTime, visibleEndTime, {
+            includeRecordBeforeStart: !discontinuities.length || discontinuities[0].startTime > graphStartTime,
+            includeRecordAfterEnd: true,
+        });
         if (!visibleRecords.length || (visibleRecords.length === 1 && visibleRecords[0].endTime < graphStartTime)) {
             this.clear();
             return;
index 3cec4fb..f11cff7 100644 (file)
@@ -784,12 +784,7 @@ WI.TimelineOverview = class TimelineOverview extends WI.View
 
             let startTime = firstRecord instanceof WI.RenderingFrameTimelineRecord ? firstRecord.frameIndex : firstRecord.startTime;
             let endTime = lastRecord instanceof WI.RenderingFrameTimelineRecord ? lastRecord.frameIndex : lastRecord.endTime;
-
-            if (firstRecord instanceof WI.CPUTimelineRecord) {
-                let selectionPadding = WI.CPUTimelineOverviewGraph.samplingRatePerSecond * 2.25;
-                this.selectionStartTime = startTime - selectionPadding - (WI.CPUTimelineOverviewGraph.samplingRatePerSecond / 2);
-                this.selectionDuration = endTime - startTime + (selectionPadding * 2);
-            } else if (startTime < this.selectionStartTime || endTime > this.selectionStartTime + this.selectionDuration) {
+            if (startTime < this.selectionStartTime || (endTime > this.selectionStartTime + this.selectionDuration) || firstRecord instanceof WI.CPUTimelineRecord) {
                 let selectionPadding = this.secondsPerPixel * 10;
                 this.selectionStartTime = startTime - selectionPadding;
                 this.selectionDuration = endTime - startTime + (selectionPadding * 2);