Skip to content

Commit 62f80c6

Browse files
author
Daniel Herzog
committed
Some rough tweaks to the network-details view, mainly minimizing differences between parsed and raw mode. A bit in drawing-board mode.
1 parent 64a5c40 commit 62f80c6

File tree

4 files changed

+106
-50
lines changed

4 files changed

+106
-50
lines changed

‎src/network/network_details_templates.js‎

Lines changed: 86 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -56,25 +56,17 @@ templates._details_content = function(entry, do_raw)
5656
var requests_responses = entry.requests_responses.map(do_raw ? this._requests_responses_raw_bound
5757
: this._requests_responses_parsed_bound);
5858
if (do_raw)
59-
return requests_responses;
60-
61-
var responsecode = entry.current_responsecode;
62-
if (responsecode && responsecode in cls.ResourceUtil.http_status_codes)
63-
responsecode = responsecode + " " + cls.ResourceUtil.http_status_codes[responsecode];
64-
59+
{
60+
return [
61+
templates.details_headline(entry),
62+
requests_responses
63+
];
64+
}
6565
return (
6666
["table",
6767
["tbody",
6868
this._col_or_row(
69-
["h1",
70-
[
71-
["span",
72-
entry.touched_network && responsecode ? String(responsecode) + " – " : "",
73-
"data-spec", "http#" + entry.current_responsecode
74-
],
75-
["span", entry.url]
76-
]
77-
]
69+
templates.details_headline(entry)
7870
)
7971
],
8072
entry.touched_network ? [] : this.did_not_touch_network(entry),
@@ -83,6 +75,27 @@ templates._details_content = function(entry, do_raw)
8375
);
8476
};
8577

78+
templates.details_headline = function(entry)
79+
{
80+
/*
81+
var responsecode = entry.current_responsecode;
82+
if (responsecode && responsecode in cls.ResourceUtil.http_status_codes)
83+
responsecode = responsecode + " " + cls.ResourceUtil.http_status_codes[responsecode];
84+
*/
85+
return ["h2", entry.url, "class", "url"];
86+
/*
87+
["h2",
88+
[
89+
["span",
90+
entry.touched_network && responsecode ? String(responsecode) + " – " : "",
91+
"data-spec", "http#" + entry.current_responsecode
92+
],
93+
["span", entry.url ]
94+
]
95+
]
96+
*/
97+
};
98+
8699
templates.did_not_touch_network = function(entry)
87100
{
88101
var local_url_types = [
@@ -146,7 +159,7 @@ templates._header_token_templ = function(state, token)
146159
{
147160
var TYPE = 0;
148161
var STR = 1;
149-
var attrs = ["class", "header-token-type-" + cls.HTTPHeaderTokenizer.classnames[token[TYPE]]];
162+
var attrs = ["class", cls.HTTPHeaderTokenizer.classnames[token[TYPE]]];
150163

151164
if (token[TYPE] === cls.HTTPHeaderTokenizer.types.NAME)
152165
{
@@ -171,6 +184,17 @@ templates._token_receiver = function(tokens, token_type, token)
171184

172185
templates._request_headers = function(req, do_raw)
173186
{
187+
/*
188+
var method_str = req.method || "";
189+
if (method_str)
190+
method_str = " – " + method_str;
191+
*/
192+
var headline;
193+
if (req.request_body && req.request_body.partList && req.request_body.partList.length)
194+
headline = ["h2", ui_strings.S_NETWORK_MULTIPART_REQUEST_TITLE /* + method_str */];
195+
else
196+
headline = ["h2", ui_strings.S_NETWORK_REQUEST_DETAIL_REQUEST_TITLE /* + method_str */];
197+
174198
if (do_raw)
175199
{
176200
if (req.request_headers_raw)
@@ -188,7 +212,7 @@ templates._request_headers = function(req, do_raw)
188212
var state_holder = new cls.HTTPHeaderTokenizer.TokenStateholder(data_spec_firstline_tokens);
189213
var map_func = this._header_token_templ.bind(this, state_holder);
190214
return [
191-
["h2", ui_strings.S_NETWORK_REQUEST_DETAIL_REQUEST_TITLE],
215+
headline,
192216
this._pre(req.header_tokens.map(map_func))
193217
];
194218
}
@@ -197,19 +221,26 @@ templates._request_headers = function(req, do_raw)
197221
}
198222

199223
var ret = [];
200-
var method_str = req.method || "";
201-
if (method_str)
202-
method_str = " – " + method_str;
203-
204-
if (req.request_body && req.request_body.partList && req.request_body.partList.length)
205-
ret.push(["h2", ui_strings.S_NETWORK_MULTIPART_REQUEST_TITLE + method_str]);
206-
else
207-
ret.push(["h2", ui_strings.S_NETWORK_REQUEST_DETAIL_REQUEST_TITLE + method_str]);
208-
209224
if (!req.request_headers)
225+
{
210226
ret.push(ui_strings.S_NETWORK_REQUEST_NO_HEADERS_LABEL);
227+
}
211228
else
229+
{
212230
ret.extend(this.headers_list(req.request_headers));
231+
if (req.first_line)
232+
{
233+
// todo: make nice, add speclinks
234+
var classname = "mono " + cls.HTTPHeaderTokenizer.classnames[
235+
cls.HTTPHeaderTokenizer.types.FIRST_LINE_PART
236+
];
237+
ret.unshift([
238+
"pre", req.first_line,
239+
"class", classname
240+
]);
241+
}
242+
}
243+
ret.unshift(headline);
213244

214245
return ["tbody", ret.map(this._col_or_row)];
215246
};
@@ -243,38 +274,54 @@ templates._response_headers = function(resp, do_raw)
243274
}
244275

245276
var ret = [];
246-
277+
/*
247278
var responsecode = resp.responsecode || "";
248279
var status_code = cls.ResourceUtil.http_status_codes[responsecode];
249280
if (status_code)
250281
responsecode = responsecode + " " + status_code;
251282
252283
if (responsecode)
253284
responsecode = " – " + responsecode;
285+
*/
286+
287+
ret.extend(this.headers_list(resp.response_headers));
288+
if (resp.first_line)
289+
{
290+
// todo: make nice, add speclinks
291+
var classname = "mono " + cls.HTTPHeaderTokenizer.classnames[
292+
cls.HTTPHeaderTokenizer.types.FIRST_LINE_PART
293+
];
294+
ret.unshift([
295+
"pre", resp.first_line,
296+
"class", classname
297+
]);
298+
}
254299

255300
if (resp.logger_entry_touched_network)
256301
{
257-
var head = ["h2", ui_strings.S_NETWORK_REQUEST_DETAIL_RESPONSE_TITLE + responsecode];
302+
var head = ["h2", ui_strings.S_NETWORK_REQUEST_DETAIL_RESPONSE_TITLE /* + responsecode */];
303+
/*
258304
if (responsecode)
259305
{
260306
head.extend(["data-spec", "http#" + resp.responsecode]);
261307
}
262-
ret.push(head);
308+
*/
309+
ret.unshift(head);
263310
}
264-
265-
ret.extend(this.headers_list(resp.response_headers));
266311
return ["tbody", ret.map(this._col_or_row)];
267312
};
268313

269314
templates._headers_pseudo_raw = function(header)
270315
{
271316
var template = [
272-
["span", header.name + ":",
273-
"data-spec", "http#" + header.name.trim()
274-
],
275-
["span", " " + header.value]
276-
];
277-
return this._pre(template);
317+
["span", header.name + ":",
318+
"data-spec", "http#" + header.name.trim(),
319+
"class", cls.HTTPHeaderTokenizer.classnames[cls.HTTPHeaderTokenizer.types.NAME]
320+
],
321+
["span", " " + header.value,
322+
"class", cls.HTTPHeaderTokenizer.classnames[cls.HTTPHeaderTokenizer.types.VALUE]]
323+
];
324+
return templates._pre(template);
278325
};
279326

280327
templates._headers = function(header) {
@@ -288,7 +335,8 @@ templates._headers = function(header) {
288335

289336
templates.headers_list = function(headers, do_raw)
290337
{
291-
return headers.map(do_raw ? this._headers_pseudo_raw : this._headers, this);
338+
// return headers.map(do_raw ? this._headers_pseudo_raw : this._headers, this);
339+
return headers.map(this._headers_pseudo_raw);
292340
};
293341

294342
templates.param_cells = function(name_value)

‎src/network/network_service.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1038,7 +1038,8 @@ cls.NetworkLoggerRequestPrototype = function()
10381038
this._update_event_requestheader = function(event)
10391039
{
10401040
this.request_headers = event.headerList;
1041-
1041+
// todo: check spdy requests
1042+
this.first_line = event.raw && event.raw.split("\n")[0];
10421043
for (var n = 0, header; header = this.request_headers[n]; n++)
10431044
{
10441045
if (header.name.toLowerCase() == "content-type")
@@ -1104,6 +1105,7 @@ cls.NetworkLoggerResponsePrototype = function()
11041105
// At the time of the this event, it's possible that more than the header
11051106
// has been read from the socket already.
11061107
this.response_headers_raw = event.raw.split("\r\n\r\n")[0];
1108+
this.first_line = this.response_headers_raw.split("\n")[0];
11071109
};
11081110

11091111
this.update_event_responsefinished = function(event)

‎src/network/network_style.css‎

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -295,26 +295,29 @@
295295
color: #006C0E;
296296
}
297297

298-
.network_logger .network-summary,
299-
.network-details-container h1
298+
.network_logger .network-summary
300299
{
301300
text-align: center;
302301
font-size: 1.4em;
303302
margin: 18px 0;
304303
color: #808080;
305304
}
306305

307-
.network-details-container h1
306+
.network-details-container h2
308307
{
309-
color: #444444;
310-
margin: 9px 0;
311-
background-color: transparent;
308+
padding: 9px 0;
309+
}
310+
311+
.entry-details .url
312+
{
313+
font-weight: normal;
312314
}
313315

314316
.network-details-container pre,
315317
.network-details-container p
316318
{
317319
margin: 0;
320+
word-wrap: break-word;
318321
}
319322

320323
.network-details-container table
@@ -325,6 +328,7 @@
325328
.network-details-container td,
326329
.network-details-container th
327330
{
331+
padding: 0;
328332
vertical-align: top;
329333
word-wrap: break-word;
330334
}
@@ -352,7 +356,7 @@
352356
.network-options h2
353357
{
354358
font-size: 125%;
355-
margin: 15px 0 10px 0;
359+
padding: 15px 0 10px 0;
356360
}
357361

358362
.network_logger .network-main-container .sortable-table .network-graph-column
@@ -566,4 +570,5 @@ table .network-body
566570
/* work-around CORE-46966: Big pre element breaks layout in a table */
567571
float: left;
568572
margin-right: -10000000px;
573+
width: 100%;
569574
}

‎src/syntaxhighlight/http-header/tokenizer.js‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -117,10 +117,11 @@ cls.HTTPHeaderTokenizer.types = {
117117

118118
(function(types) {
119119
var classnames = cls.HTTPHeaderTokenizer.classnames = {};
120-
classnames[types.FIRST_LINE_PART] = "first_line_part";
121-
classnames[types.NAME] = "name";
122-
classnames[types.VALUE] = "value";
123-
classnames[types.PUNCTUATOR] = "punctuator";
120+
var base = "header-token-type-";
121+
classnames[types.FIRST_LINE_PART] = base + "first_line_part";
122+
classnames[types.NAME] = base + "name";
123+
classnames[types.VALUE] = base + "value";
124+
classnames[types.PUNCTUATOR] = base + "punctuator";
124125
})(cls.HTTPHeaderTokenizer.types);
125126

126127
cls.HTTPHeaderTokenizer.TokenStateholder = function(data_spec_firstline_tokens)

0 commit comments

Comments
 (0)