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