Home | History | Annotate | Download | only in base
      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="/tracing/ui/base/pie_chart.html">
      8 <script>
      9 'use strict';
     10 
     11 tr.b.unittest.testSuite(function() {
     12   test('simple', function() {
     13     var chart = new tr.ui.b.PieChart();
     14     chart.width = 400;
     15     chart.height = 200;
     16     assert.equal(chart.getAttribute('width'), '400');
     17     assert.equal(chart.getAttribute('height'), '200');
     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     assert.equal(chart.currentHighlightedLegendKey, 'b');
     29     chart.popTempHighlightedLegendKey('b');
     30     assert.equal(chart.highlightedLegendKey, 'c');
     31     this.addHTMLOutput(chart);
     32   });
     33 
     34   test('withValueText', function() {
     35     var chart = new tr.ui.b.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 tr.ui.b.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       assert.equal(event.index, 1);
     62       assert.equal(event.data.foo, 43);
     63       didGetClick = true;
     64     });
     65 
     66     var arc0 = Polymer.dom(chart).querySelectorAll('.paths > path')[1];
     67     tr.b.dispatchSimpleEvent(arc0, 'click');
     68     assert.isTrue(didGetClick);
     69   });
     70 
     71   test('lotsOfValues', function() {
     72     var chart = new tr.ui.b.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 tr.ui.b.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>
    208