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