1<!DOCTYPE HTML>
2<head i18n-values="dir:textdirection;">
3<!--
4Copyright (c) 2011 The Chromium Authors. All rights reserved.
5Use of this source code is governed by a BSD-style license that can be
6found in the LICENSE file.
7-->
8  <head>
9    <link rel="stylesheet" href="main.css">
10    <link rel="stylesheet" href="tabswitcherview.css">
11    <script src="util.js"></script>
12    <script src="view.js"></script>
13    <script src="tabswitcherview.js"></script>
14    <script src="dataview.js"></script>
15    <script src="httpcacheview.js"></script>
16    <script src="testview.js"></script>
17    <script src="hstsview.js"></script>
18    <script src="main.js"></script>
19    <script src="dnsview.js"></script>
20    <script src="eventsview.js"></script>
21    <script src="detailsview.js"></script>
22    <script src="sourceentry.js"></script>
23    <script src="resizableverticalsplitview.js"></script>
24    <script src="topmidbottomview.js"></script>
25    <script src="timelineviewpainter.js"></script>
26    <script src="logviewpainter.js"></script>
27    <script src="loggrouper.js"></script>
28    <script src="proxyview.js"></script>
29    <script src="socketpoolwrapper.js"></script>
30    <script src="socketsview.js"></script>
31    <script src="spdyview.js"></script>
32    <script src="serviceprovidersview.js"></script>
33    <script src="httpthrottlingview.js"></script>
34  </head>
35  <body onload="onLoaded()">
36    <!-- Tab switcher for main categories. -->
37    <div id=categoryTabHandles>
38      <ul>
39        <li><a href="#data" id=dataTab>Data</a></li>
40        <li><a href="#proxy" id=proxyTab>Proxy</a></li>
41        <li><a href="#events" id=eventsTab>Events</a></li>
42        <li><a href="#dns" id=dnsTab>DNS</a></li>
43        <li><a href="#sockets" id=socketsTab>Sockets</a></li>
44        <li><a href="#spdy" id=spdyTab>SPDY</a></li>
45        <li><a href="#httpCache" id=httpCacheTab>HTTP Cache</a></li>
46        <li><a href="#httpThrottling" id=httpThrottlingTab>HTTP Throttling</a></li>
47        <!-- Tab is only shown on Windows -->
48        <li><a href="#serviceProviders" id=serviceProvidersTab style="display: none;">SPIs</a></li>
49        <li><a href="#tests" id=testTab>Tests</a></li>
50        <li><a href="#hsts" id=hstsTab>HSTS</a></li>
51      </ul>
52      <div style="clear: both;"></div>
53    </div>
54    <!-- Proxy info -->
55    <div id=proxyTabContent>
56      <h4>
57        Current proxy settings
58        <input type=button value="Re-apply settings" id=proxyReloadSettings />
59      </h4>
60
61      <table><tr>
62
63      <td valign=top>
64      <h3>Effective settings</h3>
65      <pre id=proxyEffectiveSettings></pre>
66      </pre>
67      </td>
68
69      <td style='width: 30px'>&nbsp;</td>
70
71      <td valign=top>
72      <h3>Original settings</h3>
73      <pre id=proxyOriginalSettings></pre>
74      </td>
75
76      </tr></table>
77
78      <h4>Proxy auto-config initialization</h4>
79      <ul>
80        <li>
81          <a href='#events&q=type:INIT_PROXY_RESOLVER'>View all events</a>
82        </li>
83        <li>
84          Latest proxy resolver event:
85          <pre id=proxyResolverLog></pre>
86        </li>
87      </ul>
88
89      <h4>
90        Proxies which have failed recently, and are marked as bad
91        <input type=button value="Clear bad proxies" id=clearBadProxies />
92      </h4>
93      <table class="styledTable">
94        <thead>
95          <tr>
96            <th>Bad proxy server</th>
97            <th>Time for next retry</th>
98          </tr>
99        </thead>
100        <tbody id=badProxiesTableBody></tbody>
101      </table>
102    </div>
103    <!-- Host resolver info -->
104    <div id=dnsTabContent>
105      <h4>Host resolver</h4>
106      <ul>
107        <li><a href='#events&q=type:HOST_RESOLVER_IMPL_REQUEST%20type:HOST_RESOLVER_IMPL_JOB%20is:active'>View pending lookups</a></li>
108        <li>Default address family: <span id=hostResolverDefaultFamily></span>
109          <span id=hostResolverIPv6Disabled class=warningText style="display: none;">
110            (IPv6 disabled)
111            <input type=button value="Enable IPv6" id=hostResolverEnableIPv6 />
112          </span>
113        </li>
114      </ul>
115
116      <h4>
117        Host resolver cache
118        <input type=button value="Clear host cache" id=clearHostResolverCache />
119      </h4>
120      <ul>
121        <li>Capacity: <span id=hostResolverCacheCapacity></span></li>
122        <li>Time to live (ms) for success entries:
123            <span id=hostResolverCacheTTLSuccess></span></li>
124        <li>Time to live (ms) for failure entries:
125            <span id=hostResolverCacheTTLFailure></span></li>
126      </ul>
127
128      <table class="styledTable">
129        <thead>
130          <tr>
131            <th>Hostname</th>
132            <th>Family</th>
133            <th>Addresses</th>
134            <th>Expires</th>
135          </tr>
136        </thead>
137        <tbody id=hostResolverCacheTbody>
138        </tbody>
139      </table>
140    </div>
141    <div id=socketsTabContent>
142      <h4>Socket pools</h4>
143      <ul>
144        <li><input type=button value="Close idle sockets" id=socketPoolCloseIdleButton />
145        </li>
146        <li><input type=button value="Flush socket pools" id=socketPoolFlushButton />
147          <span class=warningText >May break pages with active connections</span>
148        </li>
149        <li><a href='#events&q=type:SOCKET%20is:active'>View live sockets</a>
150        </li>
151      </ul>
152      <p>
153        <div id=socketPoolDiv>
154        </div>
155      </p>
156      <p>
157        <div id=socketPoolGroupsDiv>
158        </div>
159      </p>
160    </div>
161    <div id=spdyTabContent>
162      <h4>SPDY Status</h4>
163      <ul>
164        <li>SPDY Enabled: <span id=spdyEnabledSpan>????</span></li>
165        <li>Use Alternate Protocol: <span id=spdyUseAlternateProtocolSpan>????</span></li>
166        <li>Force SPDY Always: <span id=spdyForceAlwaysSpan>????</span></li>
167        <li>Force SPDY Over SSL: <span id=spdyForceOverSslSpan>????</span></li>
168        <li>Next Protocols: <span id=spdyNextProtocolsSpan>????</span></li>
169      </ul>
170
171      <h4>SPDY sessions</h4>
172        <!-- Only one of these two are shown -->
173        <span id=spdySessionNoneSpan>None</span>
174        <span id=spdySessionLinkSpan style="display: none;">
175          <a href='#events&q=type:SPDY_SESSION%20is:active'>View live SPDY sessions</a>
176        </span>
177      <p>
178        <div id=spdySessionDiv>
179        </div>
180      </p>
181
182      <h4>Alternate Protocol Mappings</h4>
183      <p />
184        <div id=spdyAlternateProtocolMappingsDiv>
185        </div>
186    </div>
187    <div id=httpCacheTabContent>
188      <h4>Entries</h4>
189      <a href="chrome://view-http-cache" target=_blank>Explore cache entries</a>
190
191      <h4>Statistics</h4>
192      <div id=httpCacheStats>Nothing loaded yet.</div>
193    </div>
194    <div id=httpThrottlingTabContent>
195      <p>
196      In order to prevent Distributed Denial of Service (DDoS) attacks from
197      being perpetrated by web pages and extensions that run within Chrome, the
198      HTTP throttling mechanism keeps track of errors requesting a given URL
199      (minus the query parameters), and after a few 5xx errors in a row, starts
200      exponentially increasing an interval during which requests to the
201      given URL are disallowed.
202      </p><p>
203      You may enable or disable the feature below.  Please let us know if the
204      feature is causing problems for your web site.  More details and contact
205      information at 
206      <a href="http://dev.chromium.org/throttling">http://dev.chromium.org/throttling</a>.
207      </p>
208      <p><input id=enableHttpThrottlingCheckbox type=checkbox />
209        Throttle HTTP requests if the server has been overloaded or encountered an error.
210      </p>
211    </div>
212    <!-- Only shown on Windows -->
213    <div id=serviceProvidersTabContent style="display: none;">
214      <h4>Layered Service Providers</h4>
215      <table class="styledTable">
216        <thead>
217          <tr>
218            <th>Name</th>
219            <th>Version</th>
220            <th>Type</th>
221            <th>Socket Type</th>
222            <th>Protocol</th>
223            <th>Path</th>
224          </tr>
225        </thead>
226        <tbody id=serviceProvidersTbody>
227        </tbody>
228      </table>
229      <h4>Namespace Providers</h4>
230      <table class="styledTable">
231        <thead>
232          <tr>
233            <th>Name</th>
234            <th>Version</th>
235            <th>Namespace</th>
236            <th>Active</th>
237          </tr>
238        </thead>
239        <tbody id=namespaceProvidersTbody>
240        </tbody>
241      </table>
242    </div>
243    <!-- Import/Export data -->
244    <div id=dataTabContent>
245
246    <table width=100%>
247    <tr>
248    <td valign=top>
249      <div id=dataViewDumpDataDiv>
250        <h2>Dump data</h2>
251        <div style="margin: 8px">
252          <p><input id=securityStrippingCheckbox type=checkbox checked=yes>
253             Strip private information (cookies and credentials).
254          </p>
255          <p>
256            <a href="javascript:displayHelpForBugDump()">
257              Help: How to get data for bug reports?
258            </a>
259          </p>
260          <button id=exportToText class=bigButton>Dump to text</button>
261        </div>
262      </div>
263      <div id=dataViewLoadDataDiv>
264        <h2>Load data</h2>
265        <div style="margin: 8px">
266          <p><input type=button value="Load log from file" id=dataViewLoadLogFile /></p>
267          <p>Only works with log files created with "--log-net-log=file_name".</p>
268          <p>Once a log is loaded, this page will stop collecting data, and will
269             only start gathering data again when the page is
270             <a href="javascript:history.go(0);">reloaded</a>.<BR>
271          </p>
272        </div>
273      </div>
274    </td>
275
276    <td align=right valign=top>
277      <div class="capturingBox" id=dataViewCapturingBox>
278        <span id=dataViewCapturingTextSpan>
279          <b>Capturing all events...</b>
280        </span>
281        <span id=dataViewLoggingTextSpan style="display: none;">
282          <b>Viewing loaded log file.</b>
283        </span>
284        <table style="margin: 8px">
285          <tr>
286            <td>Passively captured:</td>
287            <td align=right id=passivelyCapturedCount></td>
288          </tr>
289          <tr>
290            <td>Actively captured:</td>
291            <td align=right id=activelyCapturedCount></td>
292          </tr>
293        </table>
294        <p><input type=button value="Delete all" id=dataViewDeleteAll /></p>
295        <p><input id=byteLoggingCheckbox type=checkbox>
296            Log actual bytes sent/received.
297        </p>
298      </div>
299    </td>
300
301    </tr>
302    </table>
303
304    <pre id=exportedDataText></pre>
305    </div>
306
307<!-- START OF HELP TEXT -->
308<script>
309function displayHelpForBugDump() {
310  // We can't access the popups loaded from WebUI pages, so we instead populate
311  // its contents using a data:URL. YUCK!
312  // TODO(eroman): do something less hacky, like exposing a new URL.
313  var helpContents =
314      document.getElementById('howtoDumpForBugsHelpContent').innerHTML;
315  window.open('data:text/html,' + encodeURIComponent(helpContents));
316}
317</script>
318<div id=howtoDumpForBugsHelpContent style="display: none">
319<h2>How to get data for bug reports</h2>
320
321<ol>
322<li>Reproduce the network problem.</li>
323<li>Click the <i>Dump to text</i> button in the <i>Data</i> tab.</li>
324
325<li>Copy-paste the resulting selected text to a file.</li>
326
327<li>Email the text file to the bug investigator,
328  <b>along with an explanation of what went wrong.</b>
329</li>
330
331</ol>
332
333
334<ul>
335<li>The network log <b>may contain personally identifying information</b> like
336  IP addresses, URLs, and cookies.</li>
337<ul>
338<li>You can edit the log to obscure information if you like, but sometimes it
339  is relevant to the bug.</li>
340<li>If you choose not to have cookies removed from the log, you must toggle
341  the checkbox before clicking the button.</li>
342</ul>
343<li>Ideally you would have the tool running <b>before</b> you reproduce the
344  bug.
345  If that isn't possible (perhaps the bug happens unpredictably), then the
346  next best thing is to load chrome://net-internals/ <b>as soon as you can
347  after</b> the problem has occurred.</li>
348</ul>
349
350<h2>How it works</h2>
351
352<ul>
353  <li>While the net-internals page is open, it will capture the network events
354  that are happening in Chrome. You can view that in real-time by going to
355  the <i>Events</i> tab.</li>
356  <li>Once you close the net-internals window, the data it had captured will be
357  discarded.</li>
358<li>Chrome keeps around a small buffer of the most recent network events
359  even when the net-internals window is not open. That way if you open
360  chrome://net-internals/ <b>shortly after</b> encountering a problem,
361  you may still find the relevant data.
362  These <i>passively captured</i> events are less accurate however, and will
363  be prefixed in the log with <span style="font-family: monospace;">(P)</span>.
364</li>
365</ul>
366
367<button onclick='window.close()'>Close this popup</button>
368<!-- END OF HELP TEXT -->
369</div>
370
371    <!-- Connection tests -->
372    <div id=testTabContent>
373      <p>Input a URL which failed to load, and then click the button to run some
374         tests for why it failed.</p>
375      <form id=connectionTestsForm>
376        URL: <input type=text id=testUrlInput />
377        <input type=submit value="Start tests" />
378      </form>
379      <div id=testSummary></div>
380    </div>
381
382    <!-- HSTS tab -->
383    <div id=hstsTabContent>
384      <p>
385        HSTS is HTTPS Strict Transport Security: a way for sites to elect to
386        always use HTTPS. See <a href="http://dev.chromium.org/sts">
387        http://dev.chromium.org/sts</a>.</p>
388
389        <!-- This UI allows a user to query and update the browser's list of
390             HSTS domains. -->
391
392      <h4>Add domain</h4>
393
394      <p>Input a domain name to add it to the HSTS set:</p>
395      <form id=hstsAddForm>
396        Domain: <input type=text id=hstsAddInput type="url"
397                 placeholder="example.com"/><br/>
398        Include subdomains: <input type="checkbox" id=hstsCheckInput /><br/>
399        Public key fingerprints: <input type=text id=hstsAddPins style="width: 25em;"/><br/>
400        <p style="font-size: small; color: gray; font-style: italic; margin-left: 2em; max-width: 40em;">(public key fingerprints are comma separated and consist of the hash function followed by a foreslash and the base64 encoded fingerprint, for example <tt>sha1/Guzek9lMwR3KeIS8wwS9gBvVtIg=</tt>)</p>
401        <input type=submit value="Add" />
402      </form>
403
404      <h4>Delete domain</h4>
405
406      <p>
407        Input a domain name to delete it from the HSTS set
408        (<i>you cannot delete preloaded entries</i>):
409      </p>
410      <form id=hstsDeleteForm>
411        Domain: <input type=text id=hstsDeleteInput type="url"
412                 placeholder="example.com"/>
413        <input type=submit value="Delete" />
414      </form>
415
416      <h4>Query domain</h4>
417
418      <p>Input a domain name to query the current HSTS set:</p>
419      <form id=hstsQueryForm>
420        Domain: <input type=text id=hstsQueryInput type="url"
421                 placeholder="example.com"/>
422        <input type=submit value="Query" />
423      </form>
424      <div style="margin-top: 1em; margin-left: 2em;" id=hstsQueryOutput></div>
425    </div>
426
427    <!-- ================= Events view =================== -->
428
429    <!-- Filter Box: This the top bar which contains the search box.  -->
430    <div id=filterBox>
431      <table width=100%>
432        <tr>
433          <td width=1%>Filter:</td>
434          <td width=98%><input type="search" incremental id=filterInput /></td>
435          <td width=1% id=filterCount>(1 of 34)</td>
436        </tr>
437      </table>
438    </div>
439    <!-- Events Box: This the panel on the left which lists the sources -->
440    <div id=eventsBox>
441      <table id=eventsListTable cellspacing=0 cellpadding=0 width=100%>
442        <thead>
443          <tr>
444            <td><input type=checkbox id=selectAll /></td>
445            <td id=sortById>ID</td>
446            <td id=sortBySource>Source</td>
447            <td id=sortByDescription width=99%>Description</td>
448          </tr>
449        </thead>
450        <!-- Events table body: This is where request rows go into -->
451        <tbody id=eventsListTableBody></tbody>
452      </table>
453    </div>
454    <!-- Action Box: This is a button bar along the bottom -->
455    <div id=actionBox>
456      <input type=button value="Delete selected" id=deleteSelected />
457      <input type=button value="Delete all" id=deleteAll />
458    </div>
459    <!-- Splitter Box: This is a handle to resize the vertical divider -->
460    <div id=splitterBox></div>
461    <!-- Details box: This is the panel on the right which shows information -->
462    <div id=detailsTabHandles>
463      <table class=tabSwitcher cellspacing=0>
464        <tr>
465          <th id=detailsLogTab>Log</th>
466          <td class=tabSwitcherSpacer>&nbsp;</td>
467          <th id=detailsTimelineTab>Timeline</th>
468        </tr>
469      </table>
470      <div class=tabSwitcherLine></div>
471    </div>
472    <div id=detailsLogBox></div>
473    <div id=detailsTimelineBox></div>
474  </body>
475</html>
476