Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(64)

Side by Side Diff: third_party/WebKit/Source/devtools/front_end/network/RequestTimingView.js

Issue 2493373002: DevTools: rename WebInspector into modules. (Closed)
Patch Set: for bots Created 4 years, 1 month ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 /* 1 /*
2 * Copyright (C) 2010 Google Inc. All rights reserved. 2 * Copyright (C) 2010 Google Inc. All rights reserved.
3 * 3 *
4 * Redistribution and use in source and binary forms, with or without 4 * Redistribution and use in source and binary forms, with or without
5 * modification, are permitted provided that the following conditions are 5 * modification, are permitted provided that the following conditions are
6 * met: 6 * met:
7 * 7 *
8 * * Redistributions of source code must retain the above copyright 8 * * Redistributions of source code must retain the above copyright
9 * notice, this list of conditions and the following disclaimer. 9 * notice, this list of conditions and the following disclaimer.
10 * * Redistributions in binary form must reproduce the above 10 * * Redistributions in binary form must reproduce the above
(...skipping 13 matching lines...) Expand all
24 * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, 24 * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
25 * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY 25 * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
26 * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT 26 * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
27 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE 27 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
28 * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 28 * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
29 */ 29 */
30 30
31 /** 31 /**
32 * @unrestricted 32 * @unrestricted
33 */ 33 */
34 WebInspector.RequestTimingView = class extends WebInspector.VBox { 34 Network.RequestTimingView = class extends UI.VBox {
35 /** 35 /**
36 * @param {!WebInspector.NetworkRequest} request 36 * @param {!SDK.NetworkRequest} request
37 * @param {!WebInspector.NetworkTimeCalculator} calculator 37 * @param {!Network.NetworkTimeCalculator} calculator
38 */ 38 */
39 constructor(request, calculator) { 39 constructor(request, calculator) {
40 super(); 40 super();
41 this.element.classList.add('resource-timing-view'); 41 this.element.classList.add('resource-timing-view');
42 42
43 this._request = request; 43 this._request = request;
44 this._calculator = calculator; 44 this._calculator = calculator;
45 } 45 }
46 46
47 /** 47 /**
48 * @param {!WebInspector.RequestTimeRangeNames} name 48 * @param {!Network.RequestTimeRangeNames} name
49 * @return {string} 49 * @return {string}
50 */ 50 */
51 static _timeRangeTitle(name) { 51 static _timeRangeTitle(name) {
52 switch (name) { 52 switch (name) {
53 case WebInspector.RequestTimeRangeNames.Push: 53 case Network.RequestTimeRangeNames.Push:
54 return WebInspector.UIString('Receiving Push'); 54 return Common.UIString('Receiving Push');
55 case WebInspector.RequestTimeRangeNames.Queueing: 55 case Network.RequestTimeRangeNames.Queueing:
56 return WebInspector.UIString('Queueing'); 56 return Common.UIString('Queueing');
57 case WebInspector.RequestTimeRangeNames.Blocking: 57 case Network.RequestTimeRangeNames.Blocking:
58 return WebInspector.UIString('Stalled'); 58 return Common.UIString('Stalled');
59 case WebInspector.RequestTimeRangeNames.Connecting: 59 case Network.RequestTimeRangeNames.Connecting:
60 return WebInspector.UIString('Initial connection'); 60 return Common.UIString('Initial connection');
61 case WebInspector.RequestTimeRangeNames.DNS: 61 case Network.RequestTimeRangeNames.DNS:
62 return WebInspector.UIString('DNS Lookup'); 62 return Common.UIString('DNS Lookup');
63 case WebInspector.RequestTimeRangeNames.Proxy: 63 case Network.RequestTimeRangeNames.Proxy:
64 return WebInspector.UIString('Proxy negotiation'); 64 return Common.UIString('Proxy negotiation');
65 case WebInspector.RequestTimeRangeNames.ReceivingPush: 65 case Network.RequestTimeRangeNames.ReceivingPush:
66 return WebInspector.UIString('Reading Push'); 66 return Common.UIString('Reading Push');
67 case WebInspector.RequestTimeRangeNames.Receiving: 67 case Network.RequestTimeRangeNames.Receiving:
68 return WebInspector.UIString('Content Download'); 68 return Common.UIString('Content Download');
69 case WebInspector.RequestTimeRangeNames.Sending: 69 case Network.RequestTimeRangeNames.Sending:
70 return WebInspector.UIString('Request sent'); 70 return Common.UIString('Request sent');
71 case WebInspector.RequestTimeRangeNames.ServiceWorker: 71 case Network.RequestTimeRangeNames.ServiceWorker:
72 return WebInspector.UIString('Request to ServiceWorker'); 72 return Common.UIString('Request to ServiceWorker');
73 case WebInspector.RequestTimeRangeNames.ServiceWorkerPreparation: 73 case Network.RequestTimeRangeNames.ServiceWorkerPreparation:
74 return WebInspector.UIString('ServiceWorker Preparation'); 74 return Common.UIString('ServiceWorker Preparation');
75 case WebInspector.RequestTimeRangeNames.SSL: 75 case Network.RequestTimeRangeNames.SSL:
76 return WebInspector.UIString('SSL'); 76 return Common.UIString('SSL');
77 case WebInspector.RequestTimeRangeNames.Total: 77 case Network.RequestTimeRangeNames.Total:
78 return WebInspector.UIString('Total'); 78 return Common.UIString('Total');
79 case WebInspector.RequestTimeRangeNames.Waiting: 79 case Network.RequestTimeRangeNames.Waiting:
80 return WebInspector.UIString('Waiting (TTFB)'); 80 return Common.UIString('Waiting (TTFB)');
81 default: 81 default:
82 return WebInspector.UIString(name); 82 return Common.UIString(name);
83 } 83 }
84 } 84 }
85 85
86 /** 86 /**
87 * @param {!WebInspector.NetworkRequest} request 87 * @param {!SDK.NetworkRequest} request
88 * @param {number} navigationStart 88 * @param {number} navigationStart
89 * @return {!Array.<!WebInspector.RequestTimeRange>} 89 * @return {!Array.<!Network.RequestTimeRange>}
90 */ 90 */
91 static calculateRequestTimeRanges(request, navigationStart) { 91 static calculateRequestTimeRanges(request, navigationStart) {
92 var result = []; 92 var result = [];
93 /** 93 /**
94 * @param {!WebInspector.RequestTimeRangeNames} name 94 * @param {!Network.RequestTimeRangeNames} name
95 * @param {number} start 95 * @param {number} start
96 * @param {number} end 96 * @param {number} end
97 */ 97 */
98 function addRange(name, start, end) { 98 function addRange(name, start, end) {
99 if (start < Number.MAX_VALUE && start <= end) 99 if (start < Number.MAX_VALUE && start <= end)
100 result.push({name: name, start: start, end: end}); 100 result.push({name: name, start: start, end: end});
101 } 101 }
102 102
103 /** 103 /**
104 * @param {!Array.<number>} numbers 104 * @param {!Array.<number>} numbers
105 * @return {number|undefined} 105 * @return {number|undefined}
106 */ 106 */
107 function firstPositive(numbers) { 107 function firstPositive(numbers) {
108 for (var i = 0; i < numbers.length; ++i) { 108 for (var i = 0; i < numbers.length; ++i) {
109 if (numbers[i] > 0) 109 if (numbers[i] > 0)
110 return numbers[i]; 110 return numbers[i];
111 } 111 }
112 return undefined; 112 return undefined;
113 } 113 }
114 114
115 /** 115 /**
116 * @param {!WebInspector.RequestTimeRangeNames} name 116 * @param {!Network.RequestTimeRangeNames} name
117 * @param {number} start 117 * @param {number} start
118 * @param {number} end 118 * @param {number} end
119 */ 119 */
120 function addOffsetRange(name, start, end) { 120 function addOffsetRange(name, start, end) {
121 if (start >= 0 && end >= 0) 121 if (start >= 0 && end >= 0)
122 addRange(name, startTime + (start / 1000), startTime + (end / 1000)); 122 addRange(name, startTime + (start / 1000), startTime + (end / 1000));
123 } 123 }
124 124
125 var timing = request.timing; 125 var timing = request.timing;
126 if (!timing) { 126 if (!timing) {
127 var start = request.issueTime() !== -1 ? request.issueTime() : request.sta rtTime !== -1 ? request.startTime : 0; 127 var start = request.issueTime() !== -1 ? request.issueTime() : request.sta rtTime !== -1 ? request.startTime : 0;
128 var middle = (request.responseReceivedTime === -1) ? Number.MAX_VALUE : re quest.responseReceivedTime; 128 var middle = (request.responseReceivedTime === -1) ? Number.MAX_VALUE : re quest.responseReceivedTime;
129 var end = (request.endTime === -1) ? Number.MAX_VALUE : request.endTime; 129 var end = (request.endTime === -1) ? Number.MAX_VALUE : request.endTime;
130 addRange(WebInspector.RequestTimeRangeNames.Total, start, end); 130 addRange(Network.RequestTimeRangeNames.Total, start, end);
131 addRange(WebInspector.RequestTimeRangeNames.Blocking, start, middle); 131 addRange(Network.RequestTimeRangeNames.Blocking, start, middle);
132 addRange(WebInspector.RequestTimeRangeNames.Receiving, middle, end); 132 addRange(Network.RequestTimeRangeNames.Receiving, middle, end);
133 return result; 133 return result;
134 } 134 }
135 135
136 var issueTime = request.issueTime(); 136 var issueTime = request.issueTime();
137 var startTime = timing.requestTime; 137 var startTime = timing.requestTime;
138 var endTime = firstPositive([request.endTime, request.responseReceivedTime]) || startTime; 138 var endTime = firstPositive([request.endTime, request.responseReceivedTime]) || startTime;
139 139
140 addRange(WebInspector.RequestTimeRangeNames.Total, issueTime < startTime ? i ssueTime : startTime, endTime); 140 addRange(Network.RequestTimeRangeNames.Total, issueTime < startTime ? issueT ime : startTime, endTime);
141 if (timing.pushStart) { 141 if (timing.pushStart) {
142 var pushEnd = timing.pushEnd || endTime; 142 var pushEnd = timing.pushEnd || endTime;
143 // Only show the part of push that happened after the navigation/reload. 143 // Only show the part of push that happened after the navigation/reload.
144 // Pushes that happened on the same connection before we started main requ est will not be shown. 144 // Pushes that happened on the same connection before we started main requ est will not be shown.
145 if (pushEnd > navigationStart) 145 if (pushEnd > navigationStart)
146 addRange(WebInspector.RequestTimeRangeNames.Push, Math.max(timing.pushSt art, navigationStart), pushEnd); 146 addRange(Network.RequestTimeRangeNames.Push, Math.max(timing.pushStart, navigationStart), pushEnd);
147 } 147 }
148 if (issueTime < startTime) 148 if (issueTime < startTime)
149 addRange(WebInspector.RequestTimeRangeNames.Queueing, issueTime, startTime ); 149 addRange(Network.RequestTimeRangeNames.Queueing, issueTime, startTime);
150 150
151 if (request.fetchedViaServiceWorker) { 151 if (request.fetchedViaServiceWorker) {
152 addOffsetRange(WebInspector.RequestTimeRangeNames.Blocking, 0, timing.work erStart); 152 addOffsetRange(Network.RequestTimeRangeNames.Blocking, 0, timing.workerSta rt);
153 addOffsetRange( 153 addOffsetRange(
154 WebInspector.RequestTimeRangeNames.ServiceWorkerPreparation, timing.wo rkerStart, timing.workerReady); 154 Network.RequestTimeRangeNames.ServiceWorkerPreparation, timing.workerS tart, timing.workerReady);
155 addOffsetRange(WebInspector.RequestTimeRangeNames.ServiceWorker, timing.wo rkerReady, timing.sendEnd); 155 addOffsetRange(Network.RequestTimeRangeNames.ServiceWorker, timing.workerR eady, timing.sendEnd);
156 addOffsetRange(WebInspector.RequestTimeRangeNames.Waiting, timing.sendEnd, timing.receiveHeadersEnd); 156 addOffsetRange(Network.RequestTimeRangeNames.Waiting, timing.sendEnd, timi ng.receiveHeadersEnd);
157 } else if (!timing.pushStart) { 157 } else if (!timing.pushStart) {
158 var blocking = firstPositive([timing.dnsStart, timing.connectStart, timing .sendStart]) || 0; 158 var blocking = firstPositive([timing.dnsStart, timing.connectStart, timing .sendStart]) || 0;
159 addOffsetRange(WebInspector.RequestTimeRangeNames.Blocking, 0, blocking); 159 addOffsetRange(Network.RequestTimeRangeNames.Blocking, 0, blocking);
160 addOffsetRange(WebInspector.RequestTimeRangeNames.Proxy, timing.proxyStart , timing.proxyEnd); 160 addOffsetRange(Network.RequestTimeRangeNames.Proxy, timing.proxyStart, tim ing.proxyEnd);
161 addOffsetRange(WebInspector.RequestTimeRangeNames.DNS, timing.dnsStart, ti ming.dnsEnd); 161 addOffsetRange(Network.RequestTimeRangeNames.DNS, timing.dnsStart, timing. dnsEnd);
162 addOffsetRange(WebInspector.RequestTimeRangeNames.Connecting, timing.conne ctStart, timing.connectEnd); 162 addOffsetRange(Network.RequestTimeRangeNames.Connecting, timing.connectSta rt, timing.connectEnd);
163 addOffsetRange(WebInspector.RequestTimeRangeNames.SSL, timing.sslStart, ti ming.sslEnd); 163 addOffsetRange(Network.RequestTimeRangeNames.SSL, timing.sslStart, timing. sslEnd);
164 addOffsetRange(WebInspector.RequestTimeRangeNames.Sending, timing.sendStar t, timing.sendEnd); 164 addOffsetRange(Network.RequestTimeRangeNames.Sending, timing.sendStart, ti ming.sendEnd);
165 addOffsetRange(WebInspector.RequestTimeRangeNames.Waiting, timing.sendEnd, timing.receiveHeadersEnd); 165 addOffsetRange(Network.RequestTimeRangeNames.Waiting, timing.sendEnd, timi ng.receiveHeadersEnd);
166 } 166 }
167 167
168 if (request.endTime !== -1) 168 if (request.endTime !== -1)
169 addRange( 169 addRange(
170 timing.pushStart ? WebInspector.RequestTimeRangeNames.ReceivingPush : 170 timing.pushStart ? Network.RequestTimeRangeNames.ReceivingPush :
171 WebInspector.RequestTimeRangeNames.Receiving, 171 Network.RequestTimeRangeNames.Receiving,
172 request.responseReceivedTime, endTime); 172 request.responseReceivedTime, endTime);
173 173
174 return result; 174 return result;
175 } 175 }
176 176
177 /** 177 /**
178 * @param {!WebInspector.NetworkRequest} request 178 * @param {!SDK.NetworkRequest} request
179 * @param {number} navigationStart 179 * @param {number} navigationStart
180 * @return {!Element} 180 * @return {!Element}
181 */ 181 */
182 static createTimingTable(request, navigationStart) { 182 static createTimingTable(request, navigationStart) {
183 var tableElement = createElementWithClass('table', 'network-timing-table'); 183 var tableElement = createElementWithClass('table', 'network-timing-table');
184 var colgroup = tableElement.createChild('colgroup'); 184 var colgroup = tableElement.createChild('colgroup');
185 colgroup.createChild('col', 'labels'); 185 colgroup.createChild('col', 'labels');
186 colgroup.createChild('col', 'bars'); 186 colgroup.createChild('col', 'bars');
187 colgroup.createChild('col', 'duration'); 187 colgroup.createChild('col', 'duration');
188 188
189 var timeRanges = WebInspector.RequestTimingView.calculateRequestTimeRanges(r equest, navigationStart); 189 var timeRanges = Network.RequestTimingView.calculateRequestTimeRanges(reques t, navigationStart);
190 var startTime = timeRanges.map(r => r.start).reduce((a, b) => Math.min(a, b) ); 190 var startTime = timeRanges.map(r => r.start).reduce((a, b) => Math.min(a, b) );
191 var endTime = timeRanges.map(r => r.end).reduce((a, b) => Math.max(a, b)); 191 var endTime = timeRanges.map(r => r.end).reduce((a, b) => Math.max(a, b));
192 var scale = 100 / (endTime - startTime); 192 var scale = 100 / (endTime - startTime);
193 193
194 var connectionHeader; 194 var connectionHeader;
195 var dataHeader; 195 var dataHeader;
196 var totalDuration = 0; 196 var totalDuration = 0;
197 197
198 for (var i = 0; i < timeRanges.length; ++i) { 198 for (var i = 0; i < timeRanges.length; ++i) {
199 var range = timeRanges[i]; 199 var range = timeRanges[i];
200 var rangeName = range.name; 200 var rangeName = range.name;
201 if (rangeName === WebInspector.RequestTimeRangeNames.Total) { 201 if (rangeName === Network.RequestTimeRangeNames.Total) {
202 totalDuration = range.end - range.start; 202 totalDuration = range.end - range.start;
203 continue; 203 continue;
204 } 204 }
205 if (rangeName === WebInspector.RequestTimeRangeNames.Push) { 205 if (rangeName === Network.RequestTimeRangeNames.Push) {
206 createHeader(WebInspector.UIString('Server Push')); 206 createHeader(Common.UIString('Server Push'));
207 } else if (WebInspector.RequestTimingView.ConnectionSetupRangeNames.has(ra ngeName)) { 207 } else if (Network.RequestTimingView.ConnectionSetupRangeNames.has(rangeNa me)) {
208 if (!connectionHeader) 208 if (!connectionHeader)
209 connectionHeader = createHeader(WebInspector.UIString('Connection Setu p')); 209 connectionHeader = createHeader(Common.UIString('Connection Setup'));
210 } else { 210 } else {
211 if (!dataHeader) 211 if (!dataHeader)
212 dataHeader = createHeader(WebInspector.UIString('Request/Response')); 212 dataHeader = createHeader(Common.UIString('Request/Response'));
213 } 213 }
214 214
215 var left = (scale * (range.start - startTime)); 215 var left = (scale * (range.start - startTime));
216 var right = (scale * (endTime - range.end)); 216 var right = (scale * (endTime - range.end));
217 var duration = range.end - range.start; 217 var duration = range.end - range.start;
218 218
219 var tr = tableElement.createChild('tr'); 219 var tr = tableElement.createChild('tr');
220 tr.createChild('td').createTextChild(WebInspector.RequestTimingView._timeR angeTitle(rangeName)); 220 tr.createChild('td').createTextChild(Network.RequestTimingView._timeRangeT itle(rangeName));
221 221
222 var row = tr.createChild('td').createChild('div', 'network-timing-row'); 222 var row = tr.createChild('td').createChild('div', 'network-timing-row');
223 var bar = row.createChild('span', 'network-timing-bar ' + rangeName); 223 var bar = row.createChild('span', 'network-timing-bar ' + rangeName);
224 bar.style.left = left + '%'; 224 bar.style.left = left + '%';
225 bar.style.right = right + '%'; 225 bar.style.right = right + '%';
226 bar.textContent = '\u200B'; // Important for 0-time items to have 0 width . 226 bar.textContent = '\u200B'; // Important for 0-time items to have 0 width .
227 var label = tr.createChild('td').createChild('div', 'network-timing-bar-ti tle'); 227 var label = tr.createChild('td').createChild('div', 'network-timing-bar-ti tle');
228 label.textContent = Number.secondsToString(duration, true); 228 label.textContent = Number.secondsToString(duration, true);
229 } 229 }
230 230
231 if (!request.finished) { 231 if (!request.finished) {
232 var cell = tableElement.createChild('tr').createChild('td', 'caution'); 232 var cell = tableElement.createChild('tr').createChild('td', 'caution');
233 cell.colSpan = 3; 233 cell.colSpan = 3;
234 cell.createTextChild(WebInspector.UIString('CAUTION: request is not finish ed yet!')); 234 cell.createTextChild(Common.UIString('CAUTION: request is not finished yet !'));
235 } 235 }
236 236
237 var footer = tableElement.createChild('tr', 'network-timing-footer'); 237 var footer = tableElement.createChild('tr', 'network-timing-footer');
238 var note = footer.createChild('td'); 238 var note = footer.createChild('td');
239 note.colSpan = 2; 239 note.colSpan = 2;
240 note.appendChild(WebInspector.linkifyDocumentationURLAsNode( 240 note.appendChild(UI.linkifyDocumentationURLAsNode(
241 'profile/network-performance/resource-loading#view-network-timing-detail s-for-a-specific-resource', 241 'profile/network-performance/resource-loading#view-network-timing-detail s-for-a-specific-resource',
242 WebInspector.UIString('Explanation'))); 242 Common.UIString('Explanation')));
243 footer.createChild('td').createTextChild(Number.secondsToString(totalDuratio n, true)); 243 footer.createChild('td').createTextChild(Number.secondsToString(totalDuratio n, true));
244 244
245 var serverTimings = request.serverTimings; 245 var serverTimings = request.serverTimings;
246 if (!serverTimings) 246 if (!serverTimings)
247 return tableElement; 247 return tableElement;
248 248
249 var lastTimingRightEdge = right === undefined ? 100 : right; 249 var lastTimingRightEdge = right === undefined ? 100 : right;
250 250
251 var breakElement = tableElement.createChild('tr', 'network-timing-table-head er').createChild('td'); 251 var breakElement = tableElement.createChild('tr', 'network-timing-table-head er').createChild('td');
252 breakElement.colSpan = 3; 252 breakElement.colSpan = 3;
253 breakElement.createChild('hr', 'break'); 253 breakElement.createChild('hr', 'break');
254 254
255 var serverHeader = tableElement.createChild('tr', 'network-timing-table-head er'); 255 var serverHeader = tableElement.createChild('tr', 'network-timing-table-head er');
256 serverHeader.createChild('td').createTextChild(WebInspector.UIString('Server Timing')); 256 serverHeader.createChild('td').createTextChild(Common.UIString('Server Timin g'));
257 serverHeader.createChild('td'); 257 serverHeader.createChild('td');
258 serverHeader.createChild('td').createTextChild(WebInspector.UIString('TIME') ); 258 serverHeader.createChild('td').createTextChild(Common.UIString('TIME'));
259 259
260 serverTimings.filter(item => item.metric.toLowerCase() !== 'total') 260 serverTimings.filter(item => item.metric.toLowerCase() !== 'total')
261 .forEach(item => addTiming(item, lastTimingRightEdge)); 261 .forEach(item => addTiming(item, lastTimingRightEdge));
262 serverTimings.filter(item => item.metric.toLowerCase() === 'total') 262 serverTimings.filter(item => item.metric.toLowerCase() === 'total')
263 .forEach(item => addTiming(item, lastTimingRightEdge)); 263 .forEach(item => addTiming(item, lastTimingRightEdge));
264 264
265 return tableElement; 265 return tableElement;
266 266
267 /** 267 /**
268 * @param {!WebInspector.ServerTiming} serverTiming 268 * @param {!SDK.ServerTiming} serverTiming
269 * @param {number} right 269 * @param {number} right
270 */ 270 */
271 function addTiming(serverTiming, right) { 271 function addTiming(serverTiming, right) {
272 var colorGenerator = 272 var colorGenerator =
273 new WebInspector.FlameChart.ColorGenerator({min: 0, max: 360, count: 3 6}, {min: 50, max: 80}, 80); 273 new UI.FlameChart.ColorGenerator({min: 0, max: 360, count: 36}, {min: 50, max: 80}, 80);
274 var isTotal = serverTiming.metric.toLowerCase() === 'total'; 274 var isTotal = serverTiming.metric.toLowerCase() === 'total';
275 var tr = tableElement.createChild('tr', isTotal ? 'network-timing-footer' : ''); 275 var tr = tableElement.createChild('tr', isTotal ? 'network-timing-footer' : '');
276 var metric = tr.createChild('td', 'network-timing-metric'); 276 var metric = tr.createChild('td', 'network-timing-metric');
277 metric.createTextChild(serverTiming.description || serverTiming.metric); 277 metric.createTextChild(serverTiming.description || serverTiming.metric);
278 var row = tr.createChild('td').createChild('div', 'network-timing-row'); 278 var row = tr.createChild('td').createChild('div', 'network-timing-row');
279 var left = scale * (endTime - startTime - serverTiming.value); 279 var left = scale * (endTime - startTime - serverTiming.value);
280 if (serverTiming.value && left >= 0) { // don't chart values too big or t oo small 280 if (serverTiming.value && left >= 0) { // don't chart values too big or t oo small
281 var bar = row.createChild('span', 'network-timing-bar server-timing'); 281 var bar = row.createChild('span', 'network-timing-bar server-timing');
282 bar.style.left = left + '%'; 282 bar.style.left = left + '%';
283 bar.style.right = right + '%'; 283 bar.style.right = right + '%';
284 bar.textContent = '\u200B'; // Important for 0-time items to have 0 wid th. 284 bar.textContent = '\u200B'; // Important for 0-time items to have 0 wid th.
285 if (!isTotal) 285 if (!isTotal)
286 bar.style.backgroundColor = colorGenerator.colorForID(serverTiming.met ric); 286 bar.style.backgroundColor = colorGenerator.colorForID(serverTiming.met ric);
287 } 287 }
288 var label = tr.createChild('td').createChild('div', 'network-timing-bar-ti tle'); 288 var label = tr.createChild('td').createChild('div', 'network-timing-bar-ti tle');
289 if (typeof serverTiming.value === 'number') // a metric timing value is o ptional 289 if (typeof serverTiming.value === 'number') // a metric timing value is o ptional
290 label.textContent = Number.secondsToString(serverTiming.value, true); 290 label.textContent = Number.secondsToString(serverTiming.value, true);
291 } 291 }
292 292
293 /** 293 /**
294 * param {string} title 294 * param {string} title
295 */ 295 */
296 function createHeader(title) { 296 function createHeader(title) {
297 var dataHeader = tableElement.createChild('tr', 'network-timing-table-head er'); 297 var dataHeader = tableElement.createChild('tr', 'network-timing-table-head er');
298 dataHeader.createChild('td').createTextChild(title); 298 dataHeader.createChild('td').createTextChild(title);
299 dataHeader.createChild('td').createTextChild(''); 299 dataHeader.createChild('td').createTextChild('');
300 dataHeader.createChild('td').createTextChild(WebInspector.UIString('TIME') ); 300 dataHeader.createChild('td').createTextChild(Common.UIString('TIME'));
301 return dataHeader; 301 return dataHeader;
302 } 302 }
303 } 303 }
304 304
305 /** 305 /**
306 * @override 306 * @override
307 */ 307 */
308 wasShown() { 308 wasShown() {
309 this._request.addEventListener(WebInspector.NetworkRequest.Events.TimingChan ged, this._refresh, this); 309 this._request.addEventListener(SDK.NetworkRequest.Events.TimingChanged, this ._refresh, this);
310 this._request.addEventListener(WebInspector.NetworkRequest.Events.FinishedLo ading, this._refresh, this); 310 this._request.addEventListener(SDK.NetworkRequest.Events.FinishedLoading, th is._refresh, this);
311 this._calculator.addEventListener(WebInspector.NetworkTimeCalculator.Events. BoundariesChanged, this._refresh, this); 311 this._calculator.addEventListener(Network.NetworkTimeCalculator.Events.Bound ariesChanged, this._refresh, this);
312 this._refresh(); 312 this._refresh();
313 } 313 }
314 314
315 /** 315 /**
316 * @override 316 * @override
317 */ 317 */
318 willHide() { 318 willHide() {
319 this._request.removeEventListener(WebInspector.NetworkRequest.Events.TimingC hanged, this._refresh, this); 319 this._request.removeEventListener(SDK.NetworkRequest.Events.TimingChanged, t his._refresh, this);
320 this._request.removeEventListener(WebInspector.NetworkRequest.Events.Finishe dLoading, this._refresh, this); 320 this._request.removeEventListener(SDK.NetworkRequest.Events.FinishedLoading, this._refresh, this);
321 this._calculator.removeEventListener( 321 this._calculator.removeEventListener(
322 WebInspector.NetworkTimeCalculator.Events.BoundariesChanged, this._refre sh, this); 322 Network.NetworkTimeCalculator.Events.BoundariesChanged, this._refresh, t his);
323 } 323 }
324 324
325 _refresh() { 325 _refresh() {
326 if (this._tableElement) 326 if (this._tableElement)
327 this._tableElement.remove(); 327 this._tableElement.remove();
328 328
329 this._tableElement = 329 this._tableElement =
330 WebInspector.RequestTimingView.createTimingTable(this._request, this._ca lculator.minimumBoundary()); 330 Network.RequestTimingView.createTimingTable(this._request, this._calcula tor.minimumBoundary());
331 this.element.appendChild(this._tableElement); 331 this.element.appendChild(this._tableElement);
332 } 332 }
333 }; 333 };
334 334
335 /** @enum {string} */ 335 /** @enum {string} */
336 WebInspector.RequestTimeRangeNames = { 336 Network.RequestTimeRangeNames = {
337 Push: 'push', 337 Push: 'push',
338 Queueing: 'queueing', 338 Queueing: 'queueing',
339 Blocking: 'blocking', 339 Blocking: 'blocking',
340 Connecting: 'connecting', 340 Connecting: 'connecting',
341 DNS: 'dns', 341 DNS: 'dns',
342 Proxy: 'proxy', 342 Proxy: 'proxy',
343 Receiving: 'receiving', 343 Receiving: 'receiving',
344 ReceivingPush: 'receiving-push', 344 ReceivingPush: 'receiving-push',
345 Sending: 'sending', 345 Sending: 'sending',
346 ServiceWorker: 'serviceworker', 346 ServiceWorker: 'serviceworker',
347 ServiceWorkerPreparation: 'serviceworker-preparation', 347 ServiceWorkerPreparation: 'serviceworker-preparation',
348 SSL: 'ssl', 348 SSL: 'ssl',
349 Total: 'total', 349 Total: 'total',
350 Waiting: 'waiting' 350 Waiting: 'waiting'
351 }; 351 };
352 352
353 WebInspector.RequestTimingView.ConnectionSetupRangeNames = new Set([ 353 Network.RequestTimingView.ConnectionSetupRangeNames = new Set([
354 WebInspector.RequestTimeRangeNames.Queueing, WebInspector.RequestTimeRangeName s.Blocking, 354 Network.RequestTimeRangeNames.Queueing, Network.RequestTimeRangeNames.Blocking ,
355 WebInspector.RequestTimeRangeNames.Connecting, WebInspector.RequestTimeRangeNa mes.DNS, 355 Network.RequestTimeRangeNames.Connecting, Network.RequestTimeRangeNames.DNS,
356 WebInspector.RequestTimeRangeNames.Proxy, WebInspector.RequestTimeRangeNames.S SL 356 Network.RequestTimeRangeNames.Proxy, Network.RequestTimeRangeNames.SSL
357 ]); 357 ]);
358 358
359 /** @typedef {{name: !WebInspector.RequestTimeRangeNames, start: number, end: nu mber}} */ 359 /** @typedef {{name: !Network.RequestTimeRangeNames, start: number, end: number} } */
360 WebInspector.RequestTimeRange; 360 Network.RequestTimeRange;
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698