src/third_party/trace-viewer/third_party/tvcm/src/tvcm/ui/pie_chart_test.html

   1 <!DOCTYPE html>
   2 <!--
   3 Copyright (c) 2014 The Chromium Authors. All rights reserved.
   4 Use of this source code is governed by a BSD-style license that can be
   5 found in the LICENSE file.
   6 -->
   7 <link rel="import" href="/tvcm/ui/pie_chart.html">
   8 <script>
   9 'use strict';
  10
  11 tvcm.unittest.testSuite(function() {
  12   test('simple', function() {
  13     var chart = new tvcm.ui.PieChart();
  14     chart.width = 400;
  15     chart.height = 200;
  16     assertEquals('400', chart.getAttribute('width'));
  17     assertEquals('200', chart.getAttribute('height'));
  18     chart.chartTitle = 'Chart title';
  19     var data = [
  20       {label: 'a', value: 100},
  21       {label: 'b', value: 200},
  22       {label: 'c', value: 300}
  23     ];
  24     chart.data = data;
  25     chart.highlightedLegendKey = 'a';
  26     chart.pushTempHighlightedLegendKey('b');
  27     chart.highlightedLegendKey = 'c';
  28     assertEquals('b', chart.currentHighlightedLegendKey);
  29     chart.popTempHighlightedLegendKey('b');
  30     assertEquals('c', chart.highlightedLegendKey);
  31     this.addHTMLOutput(chart);
  32   });
  33
  34   test('withValueText', function() {
  35     var chart = new tvcm.ui.PieChart();
  36     chart.width = 400;
  37     chart.height = 200;
  38     chart.chartTitle = 'Chart title';
  39     var data = [
  40       {label: 'a', value: 100, valueText: '100ms'},
  41       {label: 'b', value: 200, valueText: '200ms'},
  42       {label: 'c', value: 300, valueText: '300ms'}
  43     ];
  44     chart.data = data;
  45     this.addHTMLOutput(chart);
  46   });
  47
  48   test('clickEvent', function() {
  49     var chart = new tvcm.ui.PieChart();
  50     chart.width = 400;
  51     chart.height = 200;
  52     chart.chartTitle = 'Chart title';
  53     var data = [
  54       {label: 'a', value: 100, foo: 42},
  55       {label: 'b', value: 200, foo: 43}
  56     ];
  57     chart.data = data;
  58
  59     var didGetClick = false;
  60     chart.addEventListener('item-click', function(event) {
  61       assertEquals(1, event.index);
  62       assertEquals(43, event.data.foo);
  63       didGetClick = true;
  64     });
  65
  66     var arc0 = chart.querySelectorAll('.paths > path')[1];
  67     tvcm.dispatchSimpleEvent(arc0, 'click');
  68     assertTrue(didGetClick);
  69   });
  70
  71   test('lotsOfValues', function() {
  72     var chart = new tvcm.ui.PieChart();
  73     chart.chartTitle = 'Chart title';
  74     var data = [
  75       {label: 'a', value: 100},
  76       {label: 'bb', value: 200},
  77       {label: 'cccc', value: 300},
  78       {label: 'dd', value: 50},
  79       {label: 'eeeee', value: 250},
  80       {label: 'fffffff', value: 120},
  81       {label: 'ggg', value: 90},
  82       {label: 'hhhh', value: 175},
  83       {label: 'toolongiiiiiiiiiiiiiiiiiiiiiiiii', value: 325},
  84       {label: 'jjjjjj', value: 140},
  85       {label: 'kkkkkkkkk', value: 170},
  86       {label: 'lll', value: 220}
  87     ];
  88     chart.data = data;
  89     this.addHTMLOutput(chart);
  90
  91     var minSize = chart.getMinSize();
  92     chart.setSize(chart.getMinSize());
  93   });
  94
  95   test('denseValues', function() {
  96     var chart = new tvcm.ui.PieChart();
  97     chart.chartTitle = 'Chart title';
  98     var data = [
  99       {
 100         valueText: '2.855ms',
 101         value: 2.854999999999997,
 102         label: '156959'
 103       },
 104       {
 105         valueText: '9.949ms',
 106         value: 9.948999999999998,
 107         label: '16131'
 108       },
 109       {
 110         valueText: '42.314ms',
 111         value: 42.314000000000725,
 112         label: '51511'
 113       },
 114       {
 115         valueText: '31.069ms',
 116         value: 31.06900000000028,
 117         label: 'AudioOutputDevice'
 118       },
 119       {
 120         valueText: '1.418ms',
 121         value: 1.418,
 122         label: 'BrowserBlockingWorker2/50951'
 123       },
 124       {
 125         valueText: '0.044ms',
 126         value: 0.044,
 127         label: 'BrowserBlockingWorker3/50695'
 128       },
 129       {
 130         valueText: '18.526ms',
 131         value: 18.52599999999993,
 132         label: 'Chrome_ChildIOThread'
 133       },
 134       {
 135         valueText: '2.888ms',
 136         value: 2.888,
 137         label: 'Chrome_FileThread'
 138       },
 139       {
 140         valueText: '0.067ms',
 141         value: 0.067,
 142         label: 'Chrome_HistoryThread'
 143       },
 144       {
 145         valueText: '25.421ms',
 146         value: 25.421000000000046,
 147         label: 'Chrome_IOThread'
 148       },
 149       {
 150         valueText: '0.019ms',
 151         value: 0.019,
 152         label: 'Chrome_ProcessLauncherThread'
 153       },
 154       {
 155         valueText: '643.088ms',
 156         value: 643.087999999995,
 157         label: 'Compositor'
 158       },
 159       {
 160         valueText: '4.05ms',
 161         value: 4.049999999999973,
 162         label: 'CompositorRasterWorker1/22031'
 163       },
 164       {
 165         valueText: '50.04ms',
 166         value: 50.040000000000106,
 167         label: 'CrBrowserMain'
 168       },
 169       {
 170         valueText: '1256.513ms',
 171         value: 1256.5130000000042,
 172         label: 'CrGpuMain'
 173       },
 174       {
 175         valueText: '5502.195ms',
 176         value: 5502.19499999999,
 177         label: 'CrRendererMain'
 178       },
 179       {
 180         valueText: '15.553ms',
 181         value: 15.552999999999862,
 182         label: 'FFmpegDemuxer'
 183       },
 184       {
 185         valueText: '63.706ms',
 186         value: 63.706000000001524,
 187         label: 'Media'
 188       },
 189       {
 190         valueText: '2.742ms',
 191         value: 2.7419999999999987,
 192         label: 'PowerSaveBlocker'
 193       },
 194       {
 195         valueText: '0.115ms',
 196         value: 0.11500000000000005,
 197         label: 'Watchdog'
 198       }
 199     ];
 200     chart.data = data;
 201     this.addHTMLOutput(chart);
 202
 203     var minSize = chart.getMinSize();
 204     chart.setSize(chart.getMinSize());
 205   });
 206 });
 207 </script>