Web Inspector: Network Table - Update the Time column to include the …

…total duration not just the download duration

https://bugs.webkit.org/show_bug.cgi?id=180998
<rdar://problem/36140424>

Reviewed by Matt Baker.

* UserInterface/Models/Resource.js:
(WI.Resource.prototype.get totalDuration):
(WI.Resource.prototype.get duration): Deleted.
Rename and group getters to be clearer.

* UserInterface/Views/NetworkTableContentView.js:
(WI.NetworkTableContentView.prototype._entryForResource):
Use the totalDuration for the network table time column.

* UserInterface/Views/ResourceTimelineDataGridNode.js:
(WI.ResourceTimelineDataGridNode.prototype._mouseoverRecordBar graphDataSource.get secondsPerPixel):
Using the download duration was incorrect here.

Canonical link: https://commits.webkit.org/196881@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@226151 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Source/WebInspectorUI/ChangeLog

@@ -1,3 +1,24 @@
+2017-12-19  Joseph Pecoraro  <pecoraro@apple.com>
+
+        Web Inspector: Network Table - Update the Time column to include the total duration not just the download duration
+        https://bugs.webkit.org/show_bug.cgi?id=180998
+        <rdar://problem/36140424>
+
+        Reviewed by Matt Baker.
+
+        * UserInterface/Models/Resource.js:
+        (WI.Resource.prototype.get totalDuration):
+        (WI.Resource.prototype.get duration): Deleted.
+        Rename and group getters to be clearer.
+
+        * UserInterface/Views/NetworkTableContentView.js:
+        (WI.NetworkTableContentView.prototype._entryForResource):
+        Use the totalDuration for the network table time column.
+
+        * UserInterface/Views/ResourceTimelineDataGridNode.js:
+        (WI.ResourceTimelineDataGridNode.prototype._mouseoverRecordBar graphDataSource.get secondsPerPixel):
+        Using the download duration was incorrect here.
+
 2017-12-19  Devin Rousso  <webkit@devinrousso.com>
 
         Web Inspector: Styles Redesign: Typing semicolon at the end of value should move to the next property

Source/WebInspectorUI/UserInterface/Models/Resource.js

@@ -532,11 +532,6 @@ WI.Resource = class Resource extends WI.SourceCode
         return this.timingData.responseEnd || this.lastDataReceivedTimestamp || this.responseReceivedTimestamp || this.lastRedirectReceivedTimestamp || this.requestSentTimestamp;
     }
 
-    get duration()
-    {
-        return this.timingData.responseEnd - this.timingData.requestStart;
-    }
-
     get latency()
     {
         return this.timingData.responseStart - this.timingData.requestStart;
@@ -547,6 +542,11 @@ WI.Resource = class Resource extends WI.SourceCode
         return this.timingData.responseEnd - this.timingData.responseStart;
     }
 
+    get totalDuration()
+    {
+        return this.timingData.responseEnd - this.timingData.startTime;
+    }
+
     get cached()
     {
         return this._cached;

Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.js

@@ -1196,7 +1196,7 @@ WI.NetworkTableContentView = class NetworkTableContentView extends WI.ContentVie
             cached: resource.cached,
             resourceSize: resource.size,
             transferSize: !isNaN(resource.networkTotalTransferSize) ? resource.networkTotalTransferSize : resource.estimatedTotalTransferSize,
-            time: resource.duration,
+            time: resource.totalDuration,
             protocol: resource.protocol,
             priority: resource.priority,
             remoteAddress: resource.remoteAddress,

Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.js

@@ -384,7 +384,7 @@ WI.ResourceTimelineDataGridNode = class ResourceTimelineDataGridNode extends WI.
             popoverContentElement.appendChild(popoverDataGrid.element);
 
             let graphDataSource = {
-                get secondsPerPixel() { return resource.duration / WI.ResourceTimelineDataGridNode.PopoverGraphColumnWidthPixels; },
+                get secondsPerPixel() { return resource.totalDuration / WI.ResourceTimelineDataGridNode.PopoverGraphColumnWidthPixels; },
                 get zeroTime() { return resource.firstTimestamp; },
                 get startTime() { return resource.firstTimestamp; },
                 get currentTime() { return this.endTime; },