1// Copyright (c) 2010 The Chromium Authors. All rights reserved.
2// Use of this source code is governed by a BSD-style license that can be
3// found in the LICENSE file.
4
5/**
6 * This view displays the progress and results from the "connection tester".
7 *
8 *   - Has an input box to specify the URL.
9 *   - Has a button to start running the tests.
10 *   - Shows the set of experiments that have been run so far, and their
11 *     result.
12 *
13 *  @constructor
14 */
15function TestView(mainBoxId, urlInputId, formId, summaryDivId) {
16  DivView.call(this, mainBoxId);
17
18  this.urlInput_ = document.getElementById(urlInputId);
19  this.summaryDiv_ = document.getElementById(summaryDivId);
20
21  var form = document.getElementById(formId);
22  form.addEventListener('submit', this.onSubmitForm_.bind(this), false);
23
24  g_browser.addConnectionTestsObserver(this);
25}
26
27inherits(TestView, DivView);
28
29TestView.prototype.onSubmitForm_ = function(event) {
30  g_browser.sendStartConnectionTests(this.urlInput_.value);
31  event.preventDefault();
32};
33
34/**
35 * Callback for when the connection tests have begun.
36 */
37TestView.prototype.onStartedConnectionTestSuite = function() {
38  this.summaryDiv_.innerHTML = '';
39
40  var p = addNode(this.summaryDiv_, 'p');
41  addTextNode(p, 'Started connection test suite suite on ' +
42                 (new Date()).toLocaleString());
43
44  // Add a table that will hold the individual test results.
45  var table = addNode(this.summaryDiv_, 'table');
46  table.className = 'styledTable';
47  var thead = addNode(table, 'thead');
48  thead.innerHTML = '<tr><th>Result</th><th>Experiment</th>' +
49                    '<th>Error</th><th>Time (ms)</th></tr>';
50
51  this.tbody_ = addNode(table, 'tbody');
52};
53
54/**
55 * Callback for when an individual test in the suite has begun.
56 */
57TestView.prototype.onStartedConnectionTestExperiment = function(experiment) {
58  var tr = addNode(this.tbody_, 'tr');
59
60  var passFailCell = addNode(tr, 'td');
61
62  var experimentCell = addNode(tr, 'td');
63
64  var resultCell = addNode(tr, 'td');
65  addTextNode(resultCell, '?');
66
67  var dtCell = addNode(tr, 'td');
68  addTextNode(dtCell, '?');
69
70  // We will fill in result cells with actual values (to replace the
71  // placeholder '?') once the test has completed. For now we just
72  // save references to these cells.
73  this.currentExperimentRow_ = {
74    experimentCell: experimentCell,
75    dtCell: dtCell,
76    resultCell: resultCell,
77    passFailCell: passFailCell,
78    startTime: (new Date()).getTime()
79  };
80
81  addTextNode(experimentCell, 'Fetch ' + experiment.url);
82
83  if (experiment.proxy_settings_experiment ||
84      experiment.host_resolver_experiment) {
85    var ul = addNode(experimentCell, 'ul');
86
87    if (experiment.proxy_settings_experiment) {
88      var li = addNode(ul, 'li');
89      addTextNode(li, experiment.proxy_settings_experiment);
90    }
91
92    if (experiment.host_resolver_experiment) {
93      var li = addNode(ul, 'li');
94      addTextNode(li, experiment.host_resolver_experiment);
95    }
96  }
97};
98
99/**
100 * Callback for when an individual test in the suite has finished.
101 */
102TestView.prototype.onCompletedConnectionTestExperiment = function(
103    experiment, result) {
104  var r = this.currentExperimentRow_;
105
106  var endTime = (new Date()).getTime();
107
108  r.dtCell.innerHTML = '';
109  addTextNode(r.dtCell, (endTime - r.startTime));
110
111  r.resultCell.innerHTML = '';
112
113  if (result == 0) {
114    r.passFailCell.style.color = 'green';
115    addTextNode(r.passFailCell, 'PASS');
116  } else {
117    // TODO(eroman): stringize the error code.
118    addTextNode(r.resultCell, result);
119    r.passFailCell.style.color = 'red';
120    addTextNode(r.passFailCell, 'FAIL');
121  }
122
123  this.currentExperimentRow_ = null;
124};
125
126/**
127 * Callback for when the last test in the suite has finished.
128 */
129TestView.prototype.onCompletedConnectionTestSuite = function() {
130  var p = addNode(this.summaryDiv_, 'p');
131  addTextNode(p, 'Completed connection test suite suite');
132};
133
134