chrome/browser/resources/net_internals/test_view.js

   1 // Copyright (c) 2012 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 var TestView = (function() {
  14   'use strict';
  15
  16   // We inherit from DivView.
  17   var superClass = DivView;
  18
  19   /**
  20    * @constructor
  21    */
  22   function TestView() {
  23     assertFirstConstructorCall(TestView);
  24
  25     // Call superclass's constructor.
  26     superClass.call(this, TestView.MAIN_BOX_ID);
  27
  28     this.urlInput_ = $(TestView.URL_INPUT_ID);
  29     this.summaryDiv_ = $(TestView.SUMMARY_DIV_ID);
  30
  31     var form = $(TestView.FORM_ID);
  32     form.addEventListener('submit', this.onSubmitForm_.bind(this), false);
  33
  34     // Register to test information as it's received.
  35     g_browser.addConnectionTestsObserver(this);
  36   }
  37
  38   // ID for special HTML element in category_tabs.html
  39   TestView.TAB_HANDLE_ID = 'tab-handle-tests';
  40
  41   // IDs for special HTML elements in test_view.html
  42   TestView.MAIN_BOX_ID = 'test-view-tab-content';
  43   TestView.FORM_ID = 'test-view-connection-tests-form';
  44   TestView.URL_INPUT_ID = 'test-view-url-input';
  45   TestView.SUMMARY_DIV_ID = 'test-view-summary';
  46   // Needed by tests.
  47   TestView.SUBMIT_BUTTON_ID = 'test-view-connection-tests-submit';
  48
  49
  50   cr.addSingletonGetter(TestView);
  51
  52   TestView.prototype = {
  53     // Inherit the superclass's methods.
  54     __proto__: superClass.prototype,
  55
  56     onSubmitForm_: function(event) {
  57       g_browser.sendStartConnectionTests(this.urlInput_.value);
  58       event.preventDefault();
  59     },
  60
  61     /**
  62      * Callback for when the connection tests have begun.
  63      */
  64     onStartedConnectionTestSuite: function() {
  65       this.summaryDiv_.innerHTML = '';
  66
  67       var p = addNode(this.summaryDiv_, 'p');
  68       addTextNode(p, 'Started connection test suite suite on ');
  69       timeutil.addNodeWithDate(p, new Date());
  70
  71       // Add a table that will hold the individual test results.
  72       var table = addNode(this.summaryDiv_, 'table');
  73       table.className = 'styled-table';
  74       var thead = addNode(table, 'thead');
  75       thead.innerHTML = '<tr><th>Result</th><th>Experiment</th>' +
  76                         '<th>Error</th><th>Time (ms)</th></tr>';
  77
  78       this.tbody_ = addNode(table, 'tbody');
  79     },
  80
  81     /**
  82      * Callback for when an individual test in the suite has begun.
  83      */
  84     onStartedConnectionTestExperiment: function(experiment) {
  85       var tr = addNode(this.tbody_, 'tr');
  86
  87       var passFailCell = addNode(tr, 'td');
  88
  89       var experimentCell = addNode(tr, 'td');
  90
  91       var resultCell = addNode(tr, 'td');
  92       addTextNode(resultCell, '?');
  93
  94       var dtCell = addNode(tr, 'td');
  95       addTextNode(dtCell, '?');
  96
  97       // We will fill in result cells with actual values (to replace the
  98       // placeholder '?') once the test has completed. For now we just
  99       // save references to these cells.
 100       this.currentExperimentRow_ = {
 101         experimentCell: experimentCell,
 102         dtCell: dtCell,
 103         resultCell: resultCell,
 104         passFailCell: passFailCell,
 105         startTime: timeutil.getCurrentTime()
 106       };
 107
 108       addTextNode(experimentCell, 'Fetch ' + experiment.url);
 109
 110       if (experiment.proxy_settings_experiment ||
 111           experiment.host_resolver_experiment) {
 112         var ul = addNode(experimentCell, 'ul');
 113
 114         if (experiment.proxy_settings_experiment) {
 115           var li = addNode(ul, 'li');
 116           addTextNode(li, experiment.proxy_settings_experiment);
 117         }
 118
 119         if (experiment.host_resolver_experiment) {
 120           var li = addNode(ul, 'li');
 121           addTextNode(li, experiment.host_resolver_experiment);
 122         }
 123       }
 124     },
 125
 126     /**
 127      * Callback for when an individual test in the suite has finished.
 128      */
 129     onCompletedConnectionTestExperiment: function(experiment, result) {
 130       var r = this.currentExperimentRow_;
 131
 132       var endTime = timeutil.getCurrentTime();
 133
 134       r.dtCell.innerHTML = '';
 135       addTextNode(r.dtCell, (endTime - r.startTime));
 136
 137       r.resultCell.innerHTML = '';
 138
 139       if (result == 0) {
 140         r.passFailCell.style.color = 'green';
 141         addTextNode(r.passFailCell, 'PASS');
 142       } else {
 143         addTextNode(r.resultCell,
 144                     netErrorToString(result) + ' (' + result + ')');
 145         r.passFailCell.style.color = 'red';
 146         addTextNode(r.passFailCell, 'FAIL');
 147       }
 148
 149       this.currentExperimentRow_ = null;
 150     },
 151
 152     /**
 153      * Callback for when the last test in the suite has finished.
 154      */
 155     onCompletedConnectionTestSuite: function() {
 156       var p = addNode(this.summaryDiv_, 'p');
 157       addTextNode(p, 'Completed connection test suite suite');
 158     }
 159   };
 160
 161   return TestView;
 162 })();