Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(373)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: tracing/tracing/value/ui/histogram_set_controls_test.html

Issue 2747453003: Refactor histogram-set-view to an MVC pattern. (Closed)
Patch Set: Created 3 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « tracing/tracing/value/ui/histogram_set_controls.html ('k') | tracing/tracing/value/ui/histogram_set_table.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <!-- 2 <!--
3 Copyright 2016 The Chromium Authors. All rights reserved. 3 Copyright 2016 The Chromium Authors. All rights reserved.
4 Use of this source code is governed by a BSD-style license that can be 4 Use of this source code is governed by a BSD-style license that can be
5 found in the LICENSE file. 5 found in the LICENSE file.
6 --> 6 -->
7 7
8 <link rel="import" href="/tracing/ui/base/deep_utils.html"> 8 <link rel="import" href="/tracing/ui/base/deep_utils.html">
9 <link rel="import" href="/tracing/value/histogram_set.html"> 9 <link rel="import" href="/tracing/value/histogram_set.html">
10 <link rel="import" href="/tracing/value/ui/histogram_set_controls.html"> 10 <link rel="import" href="/tracing/value/ui/histogram_set_controls.html">
11 11
12 <script> 12 <script>
13 'use strict'; 13 'use strict';
14 tr.b.unittest.testSuite(function() {
15 function buildControls(test) {
16 const controls = document.createElement('tr-v-ui-histogram-set-controls');
17 controls.viewState = new tr.v.ui.HistogramSetViewState();
18 test.addHTMLOutput(controls);
19 return controls;
20 }
14 21
15 tr.b.unittest.testSuite(function() {
16 test('helpHref', function() { 22 test('helpHref', function() {
17 const controls = document.createElement('tr-v-ui-histogram-set-controls'); 23 const controls = buildControls(this);
18 this.addHTMLOutput(controls);
19 controls.helpHref = 'data:text/html,hello'; 24 controls.helpHref = 'data:text/html,hello';
20 const help = tr.b.findDeepElementMatchingPredicate( 25 const help = tr.b.findDeepElementMatchingPredicate(
21 controls, e => e.id === 'help'); 26 controls, e => e.id === 'help');
22 assert.strictEqual(help.style.display, 'inline'); 27 assert.strictEqual(help.style.display, 'inline');
23 assert.strictEqual(help.href, 'data:text/html,hello'); 28 assert.strictEqual(help.href, 'data:text/html,hello');
24 }); 29 });
25 30
26 test('displayLabels', function() { 31 test('displayLabels', function() {
27 const controls = document.createElement('tr-v-ui-histogram-set-controls'); 32 const controls = buildControls(this);
28 this.addHTMLOutput(controls);
29 const selector = tr.b.findDeepElementMatchingPredicate(controls, e => 33 const selector = tr.b.findDeepElementMatchingPredicate(controls, e =>
30 e.id === 'reference_display_label'); 34 e.id === 'reference_display_label');
31 assert.strictEqual('none', getComputedStyle(selector).display); 35 assert.strictEqual('none', getComputedStyle(selector).display);
32 36
33 controls.displayLabels = []; 37 controls.displayLabels = [];
34 assert.strictEqual('none', getComputedStyle(selector).display); 38 assert.strictEqual('none', getComputedStyle(selector).display);
35 39
36 controls.displayLabels = ['Value']; 40 controls.displayLabels = ['Value'];
37 assert.strictEqual('none', getComputedStyle(selector).display); 41 assert.strictEqual('none', getComputedStyle(selector).display);
38 42
39 controls.displayLabels = ['a', 'b']; 43 controls.displayLabels = ['a', 'b'];
40 assert.strictEqual('inline-block', getComputedStyle(selector).display); 44 assert.strictEqual('inline-block', getComputedStyle(selector).display);
41 assert.strictEqual('', selector.children[0].value); 45 assert.strictEqual('', selector.children[0].value);
42 assert.strictEqual('a', selector.children[1].value); 46 assert.strictEqual('a', selector.children[1].value);
43 assert.strictEqual('b', selector.children[2].value); 47 assert.strictEqual('b', selector.children[2].value);
44 assert.strictEqual('a', selector.children[1].textContent); 48 assert.strictEqual('a', selector.children[1].textContent);
45 assert.strictEqual('b', selector.children[2].textContent); 49 assert.strictEqual('b', selector.children[2].textContent);
46 50
47 controls.displayLabels = ['Value']; 51 controls.displayLabels = ['Value'];
48 assert.strictEqual('none', getComputedStyle(selector).display); 52 assert.strictEqual('none', getComputedStyle(selector).display);
49 53
50 controls.displayLabels = ['a', 'b']; 54 controls.displayLabels = ['a', 'b'];
51 }); 55 });
52 56
53 test('possibleStatisticNames', function() { 57 test('baseStatisticNames', function() {
54 const controls = document.createElement('tr-v-ui-histogram-set-controls'); 58 const controls = buildControls(this);
55 this.addHTMLOutput(controls); 59 controls.baseStatisticNames = ['avg', 'std'];
56 controls.possibleStatisticNames = ['avg', 'std'];
57 const selector = tr.b.findDeepElementMatchingPredicate(controls, e => 60 const selector = tr.b.findDeepElementMatchingPredicate(controls, e =>
58 e.id === 'statistic'); 61 e.id === 'statistic');
59 assert.strictEqual('inline-block', getComputedStyle(selector).display); 62 assert.strictEqual('inline-block', getComputedStyle(selector).display);
60 assert.lengthOf(selector.children, 2); 63 assert.lengthOf(selector.children, 2);
61 assert.strictEqual('avg', selector.children[0].value); 64 assert.strictEqual('avg', selector.children[0].value);
62 assert.strictEqual('avg', selector.children[0].textContent); 65 assert.strictEqual('avg', selector.children[0].textContent);
63 assert.strictEqual('std', selector.children[1].value); 66 assert.strictEqual('std', selector.children[1].value);
64 assert.strictEqual('std', selector.children[1].textContent); 67 assert.strictEqual('std', selector.children[1].textContent);
65 assert.strictEqual('avg', selector.value); 68 assert.strictEqual('avg', selector.value);
66 }); 69 });
67 70
68 test('viewDisplayStatisticName', function() { 71 test('viewDisplayStatisticName', function() {
69 const controls = document.createElement('tr-v-ui-histogram-set-controls'); 72 const controls = buildControls(this);
70 this.addHTMLOutput(controls); 73 controls.baseStatisticNames = ['avg', 'std'];
71 controls.possibleStatisticNames = ['avg', 'std'];
72 const selector = tr.b.findDeepElementMatchingPredicate(controls, e => 74 const selector = tr.b.findDeepElementMatchingPredicate(controls, e =>
73 e.id === 'statistic'); 75 e.id === 'statistic');
74 controls.viewState.displayStatisticName = 'std'; 76 controls.viewState.displayStatisticName = 'std';
75 assert.strictEqual('std', selector.value); 77 assert.strictEqual('std', selector.value);
76 }); 78 });
77 79
78 test('controlDisplayStatisticName', function() { 80 test('controlDisplayStatisticName', function() {
79 const controls = document.createElement('tr-v-ui-histogram-set-controls'); 81 const controls = buildControls(this);
80 this.addHTMLOutput(controls); 82 controls.baseStatisticNames = ['avg', 'std'];
81 controls.possibleStatisticNames = ['avg', 'std'];
82 const selector = tr.b.findDeepElementMatchingPredicate(controls, e => 83 const selector = tr.b.findDeepElementMatchingPredicate(controls, e =>
83 e.id === 'statistic'); 84 e.id === 'statistic');
84 selector.value = 'std'; 85 selector.value = 'std';
85 const changeEvent = document.createEvent('HTMLEvents'); 86 const changeEvent = document.createEvent('HTMLEvents');
86 changeEvent.initEvent('change', false, true); 87 changeEvent.initEvent('change', false, true);
87 selector.dispatchEvent(changeEvent); 88 selector.dispatchEvent(changeEvent);
88 assert.strictEqual('std', controls.viewState.displayStatisticName); 89 assert.strictEqual('std', controls.viewState.displayStatisticName);
89 }); 90 });
90 91
91 test('viewSearchQuery', function() { 92 test('viewSearchQuery', function() {
92 const controls = document.createElement('tr-v-ui-histogram-set-controls'); 93 const controls = buildControls(this);
93 this.addHTMLOutput(controls);
94 controls.viewState.searchQuery = 'foo'; 94 controls.viewState.searchQuery = 'foo';
95 const search = tr.b.findDeepElementMatchingPredicate( 95 const search = tr.b.findDeepElementMatchingPredicate(
96 controls, e => e.id === 'search'); 96 controls, e => e.id === 'search');
97 assert.strictEqual(search.value, 'foo'); 97 assert.strictEqual(search.value, 'foo');
98 }); 98 });
99 99
100 test('controlSearchQuery', function() { 100 test('controlSearchQuery', function() {
101 const controls = document.createElement('tr-v-ui-histogram-set-controls'); 101 const controls = buildControls(this);
102 this.addHTMLOutput(controls);
103 const search = tr.b.findDeepElementMatchingPredicate( 102 const search = tr.b.findDeepElementMatchingPredicate(
104 controls, e => e.id === 'search'); 103 controls, e => e.id === 'search');
105 search.value = 'x'; 104 search.value = 'x';
106 const keyupEvent = document.createEvent('KeyboardEvent'); 105 const keyupEvent = document.createEvent('KeyboardEvent');
107 keyupEvent.initEvent('keyup'); 106 keyupEvent.initEvent('keyup');
108 search.dispatchEvent(keyupEvent); 107 search.dispatchEvent(keyupEvent);
109 assert.strictEqual(controls.viewState.searchQuery, 'x'); 108 assert.strictEqual(controls.viewState.searchQuery, 'x');
110 }); 109 });
111 110
112 test('viewShowAll', function() { 111 test('viewShowAll', function() {
113 const controls = document.createElement('tr-v-ui-histogram-set-controls'); 112 const controls = buildControls(this);
114 this.addHTMLOutput(controls);
115 const showAll = tr.b.findDeepElementMatchingPredicate( 113 const showAll = tr.b.findDeepElementMatchingPredicate(
116 controls, e => e.id === 'show_all'); 114 controls, e => e.id === 'show_all');
117 assert.strictEqual(controls.viewState.showAll, false); 115 assert.strictEqual(controls.viewState.showAll, false);
118 assert.strictEqual(showAll.checked, false); 116 assert.strictEqual(showAll.checked, false);
119 controls.viewState.showAll = true; 117 controls.viewState.showAll = true;
120 assert.strictEqual(showAll.checked, true); 118 assert.strictEqual(showAll.checked, true);
121 }); 119 });
122 120
123 test('controlShowAll', function() { 121 test('controlShowAll', function() {
124 const controls = document.createElement('tr-v-ui-histogram-set-controls'); 122 const controls = buildControls(this);
125 this.addHTMLOutput(controls);
126 const showAll = tr.b.findDeepElementMatchingPredicate( 123 const showAll = tr.b.findDeepElementMatchingPredicate(
127 controls, e => e.id === 'show_all'); 124 controls, e => e.id === 'show_all');
128 assert.strictEqual(controls.viewState.showAll, false); 125 assert.strictEqual(controls.viewState.showAll, false);
129 assert.strictEqual(showAll.checked, false); 126 assert.strictEqual(showAll.checked, false);
130 showAll.click(); 127 showAll.click();
131 assert.strictEqual(showAll.checked, true); 128 assert.strictEqual(showAll.checked, true);
132 assert.strictEqual(controls.viewState.showAll, true); 129 assert.strictEqual(controls.viewState.showAll, true);
133 const showAllLabel = tr.b.findDeepElementMatchingPredicate( 130 const showAllLabel = tr.b.findDeepElementMatchingPredicate(
134 controls, e => e.tagName === 'LABEL' && e.htmlFor === 'show_all'); 131 controls, e => e.tagName === 'LABEL' && e.htmlFor === 'show_all');
135 showAllLabel.click(); 132 showAllLabel.click();
136 assert.strictEqual(showAll.checked, false); 133 assert.strictEqual(showAll.checked, false);
137 assert.strictEqual(controls.viewState.showAll, false); 134 assert.strictEqual(controls.viewState.showAll, false);
138 }); 135 });
139 136
140 test('viewReferenceDisplayLabel', function() { 137 test('viewReferenceDisplayLabel', function() {
141 const controls = document.createElement('tr-v-ui-histogram-set-controls'); 138 const controls = buildControls(this);
142 this.addHTMLOutput(controls);
143 controls.displayLabels = ['a', 'b']; 139 controls.displayLabels = ['a', 'b'];
144 const selector = tr.b.findDeepElementMatchingPredicate(controls, e => 140 const selector = tr.b.findDeepElementMatchingPredicate(controls, e =>
145 e.id === 'reference_display_label'); 141 e.id === 'reference_display_label');
146 142
147 assert.strictEqual('', selector.value); 143 assert.strictEqual('', selector.value);
148 assert.strictEqual('', controls.viewState.referenceDisplayLabel); 144 assert.strictEqual('', controls.viewState.referenceDisplayLabel);
149 145
150 controls.viewState.referenceDisplayLabel = 'a'; 146 controls.viewState.referenceDisplayLabel = 'a';
151 assert.strictEqual('a', selector.value); 147 assert.strictEqual('a', selector.value);
152 148
153 controls.viewState.referenceDisplayLabel = 'b'; 149 controls.viewState.referenceDisplayLabel = 'b';
154 assert.strictEqual('b', selector.value); 150 assert.strictEqual('b', selector.value);
155 151
156 controls.viewState.referenceDisplayLabel = ''; 152 controls.viewState.referenceDisplayLabel = '';
157 assert.strictEqual('', selector.value); 153 assert.strictEqual('', selector.value);
158 }); 154 });
159 155
160 test('controlReferenceDisplayLabel', function() { 156 test('controlReferenceDisplayLabel', function() {
161 const controls = document.createElement('tr-v-ui-histogram-set-controls'); 157 const controls = buildControls(this);
162 this.addHTMLOutput(controls);
163 controls.displayLabels = ['a', 'b']; 158 controls.displayLabels = ['a', 'b'];
164 const selector = tr.b.findDeepElementMatchingPredicate(controls, e => 159 const selector = tr.b.findDeepElementMatchingPredicate(controls, e =>
165 e.id === 'reference_display_label'); 160 e.id === 'reference_display_label');
166 assert.strictEqual('', selector.value); 161 assert.strictEqual('', selector.value);
167 assert.strictEqual('', controls.viewState.referenceDisplayLabel); 162 assert.strictEqual('', controls.viewState.referenceDisplayLabel);
168 163
169 selector.value = 'a'; 164 selector.value = 'a';
170 const changeEvent = document.createEvent('HTMLEvents'); 165 const changeEvent = document.createEvent('HTMLEvents');
171 changeEvent.initEvent('change', false, true); 166 changeEvent.initEvent('change', false, true);
172 selector.dispatchEvent(changeEvent); 167 selector.dispatchEvent(changeEvent);
173 assert.strictEqual('a', controls.viewState.referenceDisplayLabel); 168 assert.strictEqual('a', controls.viewState.referenceDisplayLabel);
174 169
175 selector.value = 'b'; 170 selector.value = 'b';
176 selector.dispatchEvent(changeEvent); 171 selector.dispatchEvent(changeEvent);
177 assert.strictEqual('b', controls.viewState.referenceDisplayLabel); 172 assert.strictEqual('b', controls.viewState.referenceDisplayLabel);
178 173
179 selector.value = ''; 174 selector.value = '';
180 selector.dispatchEvent(changeEvent); 175 selector.dispatchEvent(changeEvent);
181 assert.strictEqual('', controls.viewState.referenceDisplayLabel); 176 assert.strictEqual('', controls.viewState.referenceDisplayLabel);
182 }); 177 });
183 178
184 test('viewGroupings', function() { 179 test('viewGroupings', function() {
185 const controls = document.createElement('tr-v-ui-histogram-set-controls'); 180 const controls = buildControls(this);
186 this.addHTMLOutput(controls);
187 const fooGrouping = new tr.v.HistogramGrouping('foo', h => 'foo'); 181 const fooGrouping = new tr.v.HistogramGrouping('foo', h => 'foo');
188 const groupings = Object.values(tr.v.HistogramSet.GROUPINGS); 182 const groupings = Object.values(tr.v.HistogramSet.GROUPINGS);
189 groupings.push(fooGrouping); 183 groupings.push(fooGrouping);
190 controls.possibleGroupings = groupings; 184 controls.possibleGroupings = groupings;
191 const picker = tr.b.findDeepElementMatchingPredicate(controls, e => 185 const picker = tr.b.findDeepElementMatchingPredicate(controls, e =>
192 e.tagName === 'TR-UI-B-GROUPING-TABLE-GROUPBY-PICKER'); 186 e.tagName === 'TR-UI-B-GROUPING-TABLE-GROUPBY-PICKER');
193 assert.lengthOf(picker.currentGroupKeys, 0); 187 assert.lengthOf(picker.currentGroupKeys, 1);
188 assert.strictEqual(picker.currentGroupKeys[0],
189 tr.v.HistogramSet.GROUPINGS.HISTOGRAM_NAME.key);
194 190
195 controls.viewState.groupings = [ 191 controls.viewState.groupings = [
196 tr.v.HistogramSet.GROUPINGS.HISTOGRAM_NAME, 192 tr.v.HistogramSet.GROUPINGS.HISTOGRAM_NAME,
197 ]; 193 ];
198 assert.lengthOf(picker.currentGroupKeys, 1); 194 assert.lengthOf(picker.currentGroupKeys, 1);
199 assert.strictEqual(picker.currentGroupKeys[0], 195 assert.strictEqual(picker.currentGroupKeys[0],
200 tr.v.HistogramSet.GROUPINGS.HISTOGRAM_NAME.key); 196 tr.v.HistogramSet.GROUPINGS.HISTOGRAM_NAME.key);
197 assert.strictEqual('none', picker.style.display);
201 198
202 controls.viewState.groupings = [ 199 controls.viewState.groupings = [
203 tr.v.HistogramSet.GROUPINGS.STORY_NAME, 200 tr.v.HistogramSet.GROUPINGS.STORY_NAME,
204 fooGrouping, 201 fooGrouping,
205 ]; 202 ];
206 assert.lengthOf(picker.currentGroupKeys, 2); 203 assert.lengthOf(picker.currentGroupKeys, 2);
207 assert.strictEqual(picker.currentGroupKeys[0], 204 assert.strictEqual(picker.currentGroupKeys[0],
208 tr.v.HistogramSet.GROUPINGS.STORY_NAME.key); 205 tr.v.HistogramSet.GROUPINGS.STORY_NAME.key);
209 assert.strictEqual(picker.currentGroupKeys[1], 'foo'); 206 assert.strictEqual(picker.currentGroupKeys[1], 'foo');
210 }); 207 });
211 208
212 test('controlGroupings', function() { 209 test('controlGroupings', function() {
213 const controls = document.createElement('tr-v-ui-histogram-set-controls'); 210 const controls = buildControls(this);
214 this.addHTMLOutput(controls);
215 const fooGrouping = new tr.v.HistogramGrouping('foo', h => 'foo'); 211 const fooGrouping = new tr.v.HistogramGrouping('foo', h => 'foo');
216 const groupings = Object.values(tr.v.HistogramSet.GROUPINGS); 212 const groupings = Object.values(tr.v.HistogramSet.GROUPINGS);
217 groupings.push(fooGrouping); 213 groupings.push(fooGrouping);
218 controls.possibleGroupings = groupings; 214 controls.possibleGroupings = groupings;
219 const picker = tr.b.findDeepElementMatchingPredicate(controls, e => 215 const picker = tr.b.findDeepElementMatchingPredicate(controls, e =>
220 e.tagName === 'TR-UI-B-GROUPING-TABLE-GROUPBY-PICKER'); 216 e.tagName === 'TR-UI-B-GROUPING-TABLE-GROUPBY-PICKER');
221 assert.lengthOf(picker.currentGroupKeys, 0); 217 assert.lengthOf(picker.currentGroupKeys, 1);
218 assert.strictEqual(controls.viewState.groupings[0],
219 tr.v.HistogramSet.GROUPINGS.HISTOGRAM_NAME);
222 220
223 picker.currentGroupKeys = ['name']; 221 picker.currentGroupKeys = ['name'];
224 assert.lengthOf(controls.viewState.groupings, 1); 222 assert.lengthOf(controls.viewState.groupings, 1);
225 assert.strictEqual(controls.viewState.groupings[0], 223 assert.strictEqual(controls.viewState.groupings[0],
226 tr.v.HistogramSet.GROUPINGS.HISTOGRAM_NAME); 224 tr.v.HistogramSet.GROUPINGS.HISTOGRAM_NAME);
227 225
228 picker.currentGroupKeys = ['story', 'foo']; 226 picker.currentGroupKeys = ['story', 'foo'];
229 assert.lengthOf(controls.viewState.groupings, 2); 227 assert.lengthOf(controls.viewState.groupings, 2);
230 assert.strictEqual(controls.viewState.groupings[0], 228 assert.strictEqual(controls.viewState.groupings[0],
231 tr.v.HistogramSet.GROUPINGS.STORY_NAME); 229 tr.v.HistogramSet.GROUPINGS.STORY_NAME);
232 assert.strictEqual(controls.viewState.groupings[1], 230 assert.strictEqual(controls.viewState.groupings[1],
233 fooGrouping); 231 fooGrouping);
234 }); 232 });
235 233
236 test('viewOverviewLineCharts', function() { 234 test('viewIsOverviewed', function() {
237 const controls = document.createElement('tr-v-ui-histogram-set-controls'); 235 const controls = buildControls(this);
238 this.addHTMLOutput(controls);
239 const showOverview = tr.b.findDeepElementMatchingPredicate(controls, e => 236 const showOverview = tr.b.findDeepElementMatchingPredicate(controls, e =>
240 e.id === 'show_overview'); 237 e.id === 'show_overview');
241 const hideOverview = tr.b.findDeepElementMatchingPredicate(controls, e => 238 const hideOverview = tr.b.findDeepElementMatchingPredicate(controls, e =>
242 e.id === 'hide_overview'); 239 e.id === 'hide_overview');
243 controls.viewState.tableRowStates = [ 240 controls.viewState.tableRowStates = new Map([
244 new tr.v.ui.HistogramSetTableRowState(), 241 ['a', new tr.v.ui.HistogramSetTableRowState()],
245 new tr.v.ui.HistogramSetTableRowState(), 242 ['b', new tr.v.ui.HistogramSetTableRowState()],
246 ]; 243 ]);
247 assert.strictEqual('inline', showOverview.style.display); 244 assert.strictEqual('inline', showOverview.style.display);
248 assert.strictEqual('none', hideOverview.style.display); 245 assert.strictEqual('none', hideOverview.style.display);
249 246
250 controls.viewState.tableRowStates[0].isOverviewed = true; 247 controls.viewState.tableRowStates.get('a').isOverviewed = true;
251 assert.strictEqual('none', showOverview.style.display); 248 assert.strictEqual('none', showOverview.style.display);
252 assert.strictEqual('inline', hideOverview.style.display); 249 assert.strictEqual('inline', hideOverview.style.display);
253 250
254 controls.viewState.tableRowStates[0].isOverviewed = false; 251 controls.viewState.tableRowStates.get('a').isOverviewed = false;
255 assert.strictEqual('inline', showOverview.style.display); 252 assert.strictEqual('inline', showOverview.style.display);
256 assert.strictEqual('none', hideOverview.style.display); 253 assert.strictEqual('none', hideOverview.style.display);
257 }); 254 });
258 255
259 test('controlOverviewLineCharts', function() { 256 test('controlIsOverviewed', function() {
260 const controls = document.createElement('tr-v-ui-histogram-set-controls'); 257 const controls = buildControls(this);
261 this.addHTMLOutput(controls);
262 const showOverview = tr.b.findDeepElementMatchingPredicate(controls, e => 258 const showOverview = tr.b.findDeepElementMatchingPredicate(controls, e =>
263 e.id === 'show_overview'); 259 e.id === 'show_overview');
264 const hideOverview = tr.b.findDeepElementMatchingPredicate(controls, e => 260 const hideOverview = tr.b.findDeepElementMatchingPredicate(controls, e =>
265 e.id === 'hide_overview'); 261 e.id === 'hide_overview');
266 controls.viewState.tableRowStates = [ 262 controls.viewState.tableRowStates = new Map([
267 new tr.v.ui.HistogramSetTableRowState(), 263 ['a', new tr.v.ui.HistogramSetTableRowState()],
268 new tr.v.ui.HistogramSetTableRowState(), 264 ['b', new tr.v.ui.HistogramSetTableRowState()],
269 ]; 265 ]);
270 assert.isFalse(controls.viewState.tableRowStates[0].isOverviewed); 266 assert.isFalse(controls.viewState.tableRowStates.get('a').isOverviewed);
271 assert.isFalse(controls.viewState.tableRowStates[1].isOverviewed); 267 assert.isFalse(controls.viewState.tableRowStates.get('b').isOverviewed);
272 assert.strictEqual('inline', showOverview.style.display); 268 assert.strictEqual('inline', showOverview.style.display);
273 assert.strictEqual('none', hideOverview.style.display); 269 assert.strictEqual('none', hideOverview.style.display);
274 270
275 showOverview.dispatchEvent(new MouseEvent('click')); 271 showOverview.dispatchEvent(new MouseEvent('click'));
276 assert.strictEqual('none', showOverview.style.display); 272 assert.strictEqual('none', showOverview.style.display);
277 assert.strictEqual('inline', hideOverview.style.display); 273 assert.strictEqual('inline', hideOverview.style.display);
278 assert.isTrue(controls.viewState.tableRowStates[0].isOverviewed); 274 assert.isTrue(controls.viewState.tableRowStates.get('a').isOverviewed);
279 assert.isTrue(controls.viewState.tableRowStates[1].isOverviewed); 275 assert.isTrue(controls.viewState.tableRowStates.get('b').isOverviewed);
280 276
281 hideOverview.dispatchEvent(new MouseEvent('click')); 277 hideOverview.dispatchEvent(new MouseEvent('click'));
282 assert.strictEqual('inline', showOverview.style.display); 278 assert.strictEqual('inline', showOverview.style.display);
283 assert.strictEqual('none', hideOverview.style.display); 279 assert.strictEqual('none', hideOverview.style.display);
284 assert.isFalse(controls.viewState.tableRowStates[0].isOverviewed); 280 assert.isFalse(controls.viewState.tableRowStates.get('a').isOverviewed);
285 assert.isFalse(controls.viewState.tableRowStates[1].isOverviewed); 281 assert.isFalse(controls.viewState.tableRowStates.get('b').isOverviewed);
286 }); 282 });
287 }); 283 });
288 </script> 284 </script>
OLDNEW
« no previous file with comments | « tracing/tracing/value/ui/histogram_set_controls.html ('k') | tracing/tracing/value/ui/histogram_set_table.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698