DevTools: [network] Show request Start time in timing table

third_party/WebKit/Source/devtools/front_end/network/RequestTimingView.js

Index: third_party/WebKit/Source/devtools/front_end/network/RequestTimingView.js
diff --git a/third_party/WebKit/Source/devtools/front_end/network/RequestTimingView.js b/third_party/WebKit/Source/devtools/front_end/network/RequestTimingView.js
index b3fa9b1c325272dcb451a73a4917a98efd5d0aaa..c1aa753c2d0a2fcabc1940abd638ff91962ddc0c 100644
--- a/third_party/WebKit/Source/devtools/front_end/network/RequestTimingView.js
+++ b/third_party/WebKit/Source/devtools/front_end/network/RequestTimingView.js
@@ -64,7 +64,7 @@ WebInspector.RequestTimingView.prototype = {
         if (this._tableElement)
             this._tableElement.remove();
 
-        this._tableElement = WebInspector.RequestTimingView.createTimingTable(this._request, this._calculator.minimumBoundary());
+        this._tableElement = WebInspector.RequestTimingView.createTimingTable(this._request, this._calculator);
         this.element.appendChild(this._tableElement);
     },
 
@@ -207,10 +207,10 @@ WebInspector.RequestTimingView.calculateRequestTimeRanges = function(request)
 
 /**
  * @param {!WebInspector.NetworkRequest} request
- * @param {number} navigationStart
+ * @param {!WebInspector.NetworkTimeCalculator} calculator
  * @return {!Element}
  */
-WebInspector.RequestTimingView.createTimingTable = function(request, navigationStart)
+WebInspector.RequestTimingView.createTimingTable = function(request, calculator)
 {
     var tableElement = createElementWithClass("table", "network-timing-table");
     var colgroup = tableElement.createChild("colgroup");
@@ -225,8 +225,16 @@ WebInspector.RequestTimingView.createTimingTable = function(request, navigationS
 
     var connectionHeader;
     var dataHeader;
+    var queueingHeader;
     var totalDuration = 0;
 
+    var startTimeHeader = tableElement.createChild("thead", "network-timing-start")
+    var queuedCell = startTimeHeader.createChild("tr").createChild("td");
+    var startedCell = startTimeHeader.createChild("tr").createChild("td");
+    queuedCell.colSpan = startedCell.colSpan = 2;
+    queuedCell.createTextChild(WebInspector.UIString("Queued at %s.", calculator.formatTime(request.issueTime(), 2)));
+    startedCell.createTextChild(WebInspector.UIString("Started at %s.", calculator.formatTime(request.startTime, 2)));
+
     for (var i = 0; i < timeRanges.length; ++i) {
         var range = timeRanges[i];
         var rangeName = range.name;
@@ -234,7 +242,12 @@ WebInspector.RequestTimingView.createTimingTable = function(request, navigationS
             totalDuration = range.end - range.start;
             continue;
         }
-        if (WebInspector.RequestTimingView.ConnectionSetupRangeNames[rangeName]) {
+        if (rangeName === WebInspector.RequestTimeRangeNames.Queueing) {
+            queueingHeader = tableElement.createChild("tr", "network-timing-table-header");
+            queueingHeader.createChild("td").createTextChild("Resource Scheduling");
+            queueingHeader.createChild("td").createTextChild("");
+            queueingHeader.createChild("td").createTextChild("TIME");
+        } else if (WebInspector.RequestTimingView.ConnectionSetupRangeNames[rangeName]) {
             if (!connectionHeader) {
                 connectionHeader = tableElement.createChild("tr", "network-timing-table-header");
                 connectionHeader.createChild("td").createTextChild("Connection Setup");
@@ -274,8 +287,9 @@ WebInspector.RequestTimingView.createTimingTable = function(request, navigationS
 
     var footer = tableElement.createChild("tr", "network-timing-footer");
     var note = footer.createChild("td");
-    note.colSpan = 2;
+    note.colSpan = 1;
     note.appendChild(WebInspector.linkifyDocumentationURLAsNode("profile/network-performance/resource-loading#view-network-timing-details-for-a-specific-resource", WebInspector.UIString("Explanation")));
+    footer.createChild("td");
     footer.createChild("td").createTextChild(Number.secondsToString(totalDuration, true));
 
     return tableElement;