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

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

Issue 2771723003: [tracing] Move math utilities from base into their own subdirectory (attempt 2) (Closed)
Patch Set: rebase Created 3 years, 9 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/scalar_span.html ('k') | no next file » | 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 2015 The Chromium Authors. All rights reserved. 3 Copyright 2015 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/base/math/range.html">
8 <link rel="import" href="/tracing/base/raf.html"> 9 <link rel="import" href="/tracing/base/raf.html">
9 <link rel="import" href="/tracing/base/range.html">
10 <link rel="import" href="/tracing/base/time_display_modes.html"> 10 <link rel="import" href="/tracing/base/time_display_modes.html">
11 <link rel="import" href="/tracing/base/unit.html"> 11 <link rel="import" href="/tracing/base/unit.html">
12 <link rel="import" href="/tracing/base/unit_scale.html"> 12 <link rel="import" href="/tracing/base/unit_scale.html">
13 <link rel="import" href="/tracing/value/histogram.html"> 13 <link rel="import" href="/tracing/value/histogram.html">
14 <link rel="import" href="/tracing/value/ui/scalar_context_controller.html"> 14 <link rel="import" href="/tracing/value/ui/scalar_context_controller.html">
15 <link rel="import" href="/tracing/value/ui/scalar_span.html"> 15 <link rel="import" href="/tracing/value/ui/scalar_span.html">
16 16
17 <script> 17 <script>
18 'use strict'; 18 'use strict';
19 19
(...skipping 41 matching lines...) Expand 10 before | Expand all | Expand 10 after
61 } 61 }
62 62
63 test('instantiate_significance', function() { 63 test('instantiate_significance', function() {
64 let countD = Unit.byName.count.correspondingDeltaUnit; 64 let countD = Unit.byName.count.correspondingDeltaUnit;
65 let countSIBD = Unit.byName.count_smallerIsBetter.correspondingDeltaUnit; 65 let countSIBD = Unit.byName.count_smallerIsBetter.correspondingDeltaUnit;
66 let countBIBD = Unit.byName.count_biggerIsBetter.correspondingDeltaUnit; 66 let countBIBD = Unit.byName.count_biggerIsBetter.correspondingDeltaUnit;
67 67
68 let zero = String.fromCharCode(177) + '0'; 68 let zero = String.fromCharCode(177) + '0';
69 69
70 checkScalarSpan(this, 0, countSIBD, zero, { 70 checkScalarSpan(this, 0, countSIBD, zero, {
71 significance: tr.b.Statistics.Significance.DONT_CARE, 71 significance: tr.b.math.Statistics.Significance.DONT_CARE,
72 expectedTitle: 'no change', 72 expectedTitle: 'no change',
73 expectedEmoji: '' 73 expectedEmoji: ''
74 }); 74 });
75 75
76 checkScalarSpan(this, 0, countSIBD, zero, { 76 checkScalarSpan(this, 0, countSIBD, zero, {
77 expectedEmoji: 'insignificant', 77 expectedEmoji: 'insignificant',
78 significance: tr.b.Statistics.Significance.INSIGNIFICANT, 78 significance: tr.b.math.Statistics.Significance.INSIGNIFICANT,
79 expectedEmojiColor: 'rgb(0, 0, 0)', 79 expectedEmojiColor: 'rgb(0, 0, 0)',
80 expectedTitle: 'no change' 80 expectedTitle: 'no change'
81 }); 81 });
82 82
83 assert.throws(() => checkScalarSpan(this, 0, countSIBD, zero, 83 assert.throws(() => checkScalarSpan(this, 0, countSIBD, zero,
84 {significance: tr.b.Statistics.Significance.SIGNIFICANT})); 84 {significance: tr.b.math.Statistics.Significance.SIGNIFICANT}));
85 85
86 checkScalarSpan(this, 0, countBIBD, zero, { 86 checkScalarSpan(this, 0, countBIBD, zero, {
87 significance: tr.b.Statistics.Significance.DONT_CARE, 87 significance: tr.b.math.Statistics.Significance.DONT_CARE,
88 expectedTitle: 'no change', 88 expectedTitle: 'no change',
89 expectedEmoji: '' 89 expectedEmoji: ''
90 }); 90 });
91 91
92 checkScalarSpan(this, 0, countBIBD, zero, { 92 checkScalarSpan(this, 0, countBIBD, zero, {
93 expectedEmoji: 'insignificant', 93 expectedEmoji: 'insignificant',
94 significance: tr.b.Statistics.Significance.INSIGNIFICANT, 94 significance: tr.b.math.Statistics.Significance.INSIGNIFICANT,
95 expectedEmojiColor: 'rgb(0, 0, 0)', 95 expectedEmojiColor: 'rgb(0, 0, 0)',
96 expectedTitle: 'no change' 96 expectedTitle: 'no change'
97 }); 97 });
98 98
99 assert.throws(() => checkScalarSpan(this, 0, countSIBD, zero, 99 assert.throws(() => checkScalarSpan(this, 0, countSIBD, zero,
100 {significance: tr.b.Statistics.Significance.SIGNIFICANT})); 100 {significance: tr.b.math.Statistics.Significance.SIGNIFICANT}));
101 101
102 checkScalarSpan(this, 1, countSIBD, '+1', { 102 checkScalarSpan(this, 1, countSIBD, '+1', {
103 significance: tr.b.Statistics.Significance.DONT_CARE, 103 significance: tr.b.math.Statistics.Significance.DONT_CARE,
104 expectedColor: 'rgb(255, 0, 0)', 104 expectedColor: 'rgb(255, 0, 0)',
105 expectedTitle: 'regression', 105 expectedTitle: 'regression',
106 expectedEmoji: '' 106 expectedEmoji: ''
107 }); 107 });
108 108
109 checkScalarSpan(this, 1, countSIBD, '+1', { 109 checkScalarSpan(this, 1, countSIBD, '+1', {
110 significance: tr.b.Statistics.Significance.INSIGNIFICANT, 110 significance: tr.b.math.Statistics.Significance.INSIGNIFICANT,
111 expectedColor: 'rgb(255, 0, 0)', 111 expectedColor: 'rgb(255, 0, 0)',
112 expectedEmoji: 'insignificant', 112 expectedEmoji: 'insignificant',
113 expectedEmojiColor: 'rgb(0, 0, 0)', 113 expectedEmojiColor: 'rgb(0, 0, 0)',
114 expectedTitle: 'insignificant regression' 114 expectedTitle: 'insignificant regression'
115 }); 115 });
116 116
117 checkScalarSpan(this, 1, countSIBD, '+1', { 117 checkScalarSpan(this, 1, countSIBD, '+1', {
118 significance: tr.b.Statistics.Significance.SIGNIFICANT, 118 significance: tr.b.math.Statistics.Significance.SIGNIFICANT,
119 expectedColor: 'rgb(255, 0, 0)', 119 expectedColor: 'rgb(255, 0, 0)',
120 expectedEmoji: 'significantly_worse', 120 expectedEmoji: 'significantly_worse',
121 expectedEmojiColor: 'rgb(255, 0, 0)', 121 expectedEmojiColor: 'rgb(255, 0, 0)',
122 expectedTitle: 'significant regression' 122 expectedTitle: 'significant regression'
123 }); 123 });
124 124
125 checkScalarSpan(this, 1, countBIBD, '+1', { 125 checkScalarSpan(this, 1, countBIBD, '+1', {
126 significance: tr.b.Statistics.Significance.DONT_CARE, 126 significance: tr.b.math.Statistics.Significance.DONT_CARE,
127 expectedColor: 'rgb(0, 128, 0)', 127 expectedColor: 'rgb(0, 128, 0)',
128 expectedTitle: 'improvement', 128 expectedTitle: 'improvement',
129 expectedEmoji: '' 129 expectedEmoji: ''
130 }); 130 });
131 131
132 checkScalarSpan(this, 1, countBIBD, '+1', { 132 checkScalarSpan(this, 1, countBIBD, '+1', {
133 significance: tr.b.Statistics.Significance.INSIGNIFICANT, 133 significance: tr.b.math.Statistics.Significance.INSIGNIFICANT,
134 expectedColor: 'rgb(0, 128, 0)', 134 expectedColor: 'rgb(0, 128, 0)',
135 expectedEmoji: 'insignificant', 135 expectedEmoji: 'insignificant',
136 expectedEmojiColor: 'rgb(0, 0, 0)', 136 expectedEmojiColor: 'rgb(0, 0, 0)',
137 expectedTitle: 'insignificant improvement' 137 expectedTitle: 'insignificant improvement'
138 }); 138 });
139 139
140 checkScalarSpan(this, 1, countBIBD, '+1', { 140 checkScalarSpan(this, 1, countBIBD, '+1', {
141 significance: tr.b.Statistics.Significance.SIGNIFICANT, 141 significance: tr.b.math.Statistics.Significance.SIGNIFICANT,
142 expectedColor: 'rgb(0, 128, 0)', 142 expectedColor: 'rgb(0, 128, 0)',
143 expectedEmoji: 'significantly_better', 143 expectedEmoji: 'significantly_better',
144 expectedEmojiColor: 'rgb(0, 128, 0)', 144 expectedEmojiColor: 'rgb(0, 128, 0)',
145 expectedTitle: 'significant improvement' 145 expectedTitle: 'significant improvement'
146 }); 146 });
147 147
148 checkScalarSpan(this, -1, countSIBD, '-1', { 148 checkScalarSpan(this, -1, countSIBD, '-1', {
149 significance: tr.b.Statistics.Significance.DONT_CARE, 149 significance: tr.b.math.Statistics.Significance.DONT_CARE,
150 expectedColor: 'rgb(0, 128, 0)', 150 expectedColor: 'rgb(0, 128, 0)',
151 expectedEmoji: '', 151 expectedEmoji: '',
152 expectedEmojiColor: '', 152 expectedEmojiColor: '',
153 expectedTitle: 'improvement' 153 expectedTitle: 'improvement'
154 }); 154 });
155 155
156 checkScalarSpan(this, -1, countSIBD, '-1', { 156 checkScalarSpan(this, -1, countSIBD, '-1', {
157 significance: tr.b.Statistics.Significance.INSIGNIFICANT, 157 significance: tr.b.math.Statistics.Significance.INSIGNIFICANT,
158 expectedColor: 'rgb(0, 128, 0)', 158 expectedColor: 'rgb(0, 128, 0)',
159 expectedEmoji: 'insignificant', 159 expectedEmoji: 'insignificant',
160 expectedEmojiColor: 'rgb(0, 0, 0)', 160 expectedEmojiColor: 'rgb(0, 0, 0)',
161 expectedTitle: 'insignificant improvement' 161 expectedTitle: 'insignificant improvement'
162 }); 162 });
163 163
164 checkScalarSpan(this, -1, countSIBD, '-1', { 164 checkScalarSpan(this, -1, countSIBD, '-1', {
165 significance: tr.b.Statistics.Significance.SIGNIFICANT, 165 significance: tr.b.math.Statistics.Significance.SIGNIFICANT,
166 expectedColor: 'rgb(0, 128, 0)', 166 expectedColor: 'rgb(0, 128, 0)',
167 expectedEmoji: 'significantly_better', 167 expectedEmoji: 'significantly_better',
168 expectedEmojiColor: 'rgb(0, 128, 0)', 168 expectedEmojiColor: 'rgb(0, 128, 0)',
169 expectedTitle: 'significant improvement' 169 expectedTitle: 'significant improvement'
170 }); 170 });
171 171
172 checkScalarSpan(this, -1, countBIBD, '-1', { 172 checkScalarSpan(this, -1, countBIBD, '-1', {
173 expectedColor: 'rgb(255, 0, 0)', 173 expectedColor: 'rgb(255, 0, 0)',
174 significance: tr.b.Statistics.Significance.DONT_CARE, 174 significance: tr.b.math.Statistics.Significance.DONT_CARE,
175 expectedEmoji: '' 175 expectedEmoji: ''
176 }); 176 });
177 177
178 checkScalarSpan(this, -1, countBIBD, '-1', { 178 checkScalarSpan(this, -1, countBIBD, '-1', {
179 significance: tr.b.Statistics.Significance.INSIGNIFICANT, 179 significance: tr.b.math.Statistics.Significance.INSIGNIFICANT,
180 expectedColor: 'rgb(255, 0, 0)', 180 expectedColor: 'rgb(255, 0, 0)',
181 expectedEmoji: 'insignificant', 181 expectedEmoji: 'insignificant',
182 expectedEmojiColor: 'rgb(0, 0, 0)', 182 expectedEmojiColor: 'rgb(0, 0, 0)',
183 expectedTitle: 'insignificant regression' 183 expectedTitle: 'insignificant regression'
184 }); 184 });
185 185
186 checkScalarSpan(this, -1, countBIBD, '-1', { 186 checkScalarSpan(this, -1, countBIBD, '-1', {
187 significance: tr.b.Statistics.Significance.SIGNIFICANT, 187 significance: tr.b.math.Statistics.Significance.SIGNIFICANT,
188 expectedColor: 'rgb(255, 0, 0)', 188 expectedColor: 'rgb(255, 0, 0)',
189 expectedEmoji: 'significantly_worse', 189 expectedEmoji: 'significantly_worse',
190 expectedEmojiColor: 'rgb(255, 0, 0)', 190 expectedEmojiColor: 'rgb(255, 0, 0)',
191 expectedTitle: 'significant regression' 191 expectedTitle: 'significant regression'
192 }); 192 });
193 193
194 checkScalarSpan(this, 1, countD, '+1', { 194 checkScalarSpan(this, 1, countD, '+1', {
195 expectedColor: 'rgb(0, 0, 0)', 195 expectedColor: 'rgb(0, 0, 0)',
196 significance: tr.b.Statistics.Significance.DONT_CARE, 196 significance: tr.b.math.Statistics.Significance.DONT_CARE,
197 expectedEmoji: '' 197 expectedEmoji: ''
198 }); 198 });
199 199
200 checkScalarSpan(this, 1, countD, '+1', { 200 checkScalarSpan(this, 1, countD, '+1', {
201 expectedColor: 'rgb(0, 0, 0)', 201 expectedColor: 'rgb(0, 0, 0)',
202 significance: tr.b.Statistics.Significance.INSIGNIFICANT, 202 significance: tr.b.math.Statistics.Significance.INSIGNIFICANT,
203 expectedEmoji: '' 203 expectedEmoji: ''
204 }); 204 });
205 205
206 checkScalarSpan(this, 1, countD, '+1', { 206 checkScalarSpan(this, 1, countD, '+1', {
207 expectedColor: 'rgb(0, 0, 0)', 207 expectedColor: 'rgb(0, 0, 0)',
208 significance: tr.b.Statistics.Significance.SIGNIFICANT, 208 significance: tr.b.math.Statistics.Significance.SIGNIFICANT,
209 expectedEmoji: '' 209 expectedEmoji: ''
210 }); 210 });
211 211
212 checkScalarSpan(this, -1, countD, '-1', { 212 checkScalarSpan(this, -1, countD, '-1', {
213 expectedColor: 'rgb(0, 0, 0)', 213 expectedColor: 'rgb(0, 0, 0)',
214 significance: tr.b.Statistics.Significance.DONT_CARE, 214 significance: tr.b.math.Statistics.Significance.DONT_CARE,
215 expectedEmoji: '' 215 expectedEmoji: ''
216 }); 216 });
217 217
218 checkScalarSpan(this, -1, countD, '-1', { 218 checkScalarSpan(this, -1, countD, '-1', {
219 expectedColor: 'rgb(0, 0, 0)', 219 expectedColor: 'rgb(0, 0, 0)',
220 significance: tr.b.Statistics.Significance.INSIGNIFICANT, 220 significance: tr.b.math.Statistics.Significance.INSIGNIFICANT,
221 expectedEmoji: '' 221 expectedEmoji: ''
222 }); 222 });
223 223
224 checkScalarSpan(this, -1, countD, '-1', { 224 checkScalarSpan(this, -1, countD, '-1', {
225 expectedColor: 'rgb(0, 0, 0)', 225 expectedColor: 'rgb(0, 0, 0)',
226 significance: tr.b.Statistics.Significance.SIGNIFICANT, 226 significance: tr.b.math.Statistics.Significance.SIGNIFICANT,
227 expectedEmoji: '' 227 expectedEmoji: ''
228 }); 228 });
229 }); 229 });
230 230
231 test('instantiate', function() { 231 test('instantiate', function() {
232 checkScalarSpan(this, 123.456789, Unit.byName.timeDurationInMs, 232 checkScalarSpan(this, 123.456789, Unit.byName.timeDurationInMs,
233 '123.457 ms'); 233 '123.457 ms');
234 checkScalarSpan(this, 0, Unit.byName.normalizedPercentage, '0.000%'); 234 checkScalarSpan(this, 0, Unit.byName.normalizedPercentage, '0.000%');
235 checkScalarSpan(this, 1, Unit.byName.normalizedPercentage, '100.000%'); 235 checkScalarSpan(this, 1, Unit.byName.normalizedPercentage, '100.000%');
236 checkScalarSpan(this, -2560, Unit.byName.sizeInBytes, '-2.5 KiB'); 236 checkScalarSpan(this, -2560, Unit.byName.sizeInBytes, '-2.5 KiB');
(...skipping 95 matching lines...) Expand 10 before | Expand all | Expand 10 after
332 assert.strictEqual(span.unit, Unit.byName.energyInJoules); 332 assert.strictEqual(span.unit, Unit.byName.energyInJoules);
333 assert.isUndefined(span.context); 333 assert.isUndefined(span.context);
334 assert.isUndefined(span.customContextRange); 334 assert.isUndefined(span.customContextRange);
335 assert.isUndefined(span.warning); 335 assert.isUndefined(span.warning);
336 assert.isTrue(span.leftAlign); 336 assert.isTrue(span.leftAlign);
337 this.addHTMLOutput(span); 337 this.addHTMLOutput(span);
338 338
339 // Unit and sparkline set via config. 339 // Unit and sparkline set via config.
340 span = tr.v.ui.createScalarSpan(1.62, { 340 span = tr.v.ui.createScalarSpan(1.62, {
341 unit: Unit.byName.timeStampInMs, 341 unit: Unit.byName.timeStampInMs,
342 customContextRange: tr.b.Range.fromExplicitRange(0, 3.24) 342 customContextRange: tr.b.math.Range.fromExplicitRange(0, 3.24)
343 }); 343 });
344 assert.strictEqual(Polymer.dom(span.$.content).textContent, '1.620 ms'); 344 assert.strictEqual(Polymer.dom(span.$.content).textContent, '1.620 ms');
345 assert.strictEqual(span.ownerDocument, document); 345 assert.strictEqual(span.ownerDocument, document);
346 assert.strictEqual(span.tagName, 'TR-V-UI-SCALAR-SPAN'); 346 assert.strictEqual(span.tagName, 'TR-V-UI-SCALAR-SPAN');
347 assert.strictEqual(span.value, 1.62); 347 assert.strictEqual(span.value, 1.62);
348 assert.strictEqual(span.unit, Unit.byName.timeStampInMs); 348 assert.strictEqual(span.unit, Unit.byName.timeStampInMs);
349 assert.isUndefined(span.context); 349 assert.isUndefined(span.context);
350 assert.isTrue(tr.b.Range.fromExplicitRange(0, 3.24).equals( 350 assert.isTrue(tr.b.math.Range.fromExplicitRange(0, 3.24).equals(
351 span.customContextRange)); 351 span.customContextRange));
352 assert.isUndefined(span.warning); 352 assert.isUndefined(span.warning);
353 assert.isFalse(span.leftAlign); 353 assert.isFalse(span.leftAlign);
354 this.addHTMLOutput(span); 354 this.addHTMLOutput(span);
355 355
356 // Custom context. 356 // Custom context.
357 span = tr.v.ui.createScalarSpan( 357 span = tr.v.ui.createScalarSpan(
358 new Scalar(Unit.byName.sizeInBytesDelta_smallerIsBetter, 358 new Scalar(Unit.byName.sizeInBytesDelta_smallerIsBetter,
359 256 * 1024 * 1024), { context: { 359 256 * 1024 * 1024), { context: {
360 unitPrefix: tr.b.UnitPrefixScale.BINARY.KIBI, 360 unitPrefix: tr.b.UnitPrefixScale.BINARY.KIBI,
(...skipping 19 matching lines...) Expand all
380 let span = document.createElement('tr-v-ui-scalar-span'); 380 let span = document.createElement('tr-v-ui-scalar-span');
381 span.value = 400000000; 381 span.value = 400000000;
382 span.unit = Unit.byName.sizeInBytes; 382 span.unit = Unit.byName.sizeInBytes;
383 span.warning = 'There is a problem with this size'; 383 span.warning = 'There is a problem with this size';
384 this.addHTMLOutput(span); 384 this.addHTMLOutput(span);
385 }); 385 });
386 386
387 test('instantiate_withCustomContextRange', function() { 387 test('instantiate_withCustomContextRange', function() {
388 let span = document.createElement('tr-v-ui-scalar-span'); 388 let span = document.createElement('tr-v-ui-scalar-span');
389 span.value = new Scalar(Unit.byName.unitlessNumber, 0.99); 389 span.value = new Scalar(Unit.byName.unitlessNumber, 0.99);
390 span.customContextRange = tr.b.Range.fromExplicitRange(0, 3); 390 span.customContextRange = tr.b.math.Range.fromExplicitRange(0, 3);
391 this.addHTMLOutput(span); 391 this.addHTMLOutput(span);
392 }); 392 });
393 393
394 test('instantiate_withRightAlign', function() { 394 test('instantiate_withRightAlign', function() {
395 let span = document.createElement('tr-v-ui-scalar-span'); 395 let span = document.createElement('tr-v-ui-scalar-span');
396 span.value = new Scalar(Unit.byName.timeStampInMs, 5.777); 396 span.value = new Scalar(Unit.byName.timeStampInMs, 5.777);
397 span.leftAlign = true; 397 span.leftAlign = true;
398 this.addHTMLOutput(span); 398 this.addHTMLOutput(span);
399 }); 399 });
400 400
(...skipping 11 matching lines...) Expand all
412 spanA.setValueAndUnit(400, Unit.byName.timeDurationInMs); 412 spanA.setValueAndUnit(400, Unit.byName.timeDurationInMs);
413 checkSignificance(spanA, ''); 413 checkSignificance(spanA, '');
414 414
415 let spanB = document.createElement('tr-v-ui-scalar-span'); 415 let spanB = document.createElement('tr-v-ui-scalar-span');
416 spanB.setValueAndUnit(400, Unit.byName.timeDurationInMsDelta); 416 spanB.setValueAndUnit(400, Unit.byName.timeDurationInMsDelta);
417 checkSignificance(spanB, ''); 417 checkSignificance(spanB, '');
418 418
419 let spanC = document.createElement('tr-v-ui-scalar-span'); 419 let spanC = document.createElement('tr-v-ui-scalar-span');
420 spanC.setValueAndUnit( 420 spanC.setValueAndUnit(
421 400, Unit.byName.timeDurationInMsDelta_smallerIsBetter); 421 400, Unit.byName.timeDurationInMsDelta_smallerIsBetter);
422 spanC.significance = tr.b.Statistics.Significance.SIGNIFICANT; 422 spanC.significance = tr.b.math.Statistics.Significance.SIGNIFICANT;
423 checkSignificance(spanC, 'significantly_worse'); 423 checkSignificance(spanC, 'significantly_worse');
424 424
425 let spanD = document.createElement('tr-v-ui-scalar-span'); 425 let spanD = document.createElement('tr-v-ui-scalar-span');
426 spanD.setValueAndUnit( 426 spanD.setValueAndUnit(
427 400, Unit.byName.timeDurationInMsDelta_biggerIsBetter); 427 400, Unit.byName.timeDurationInMsDelta_biggerIsBetter);
428 spanD.significance = tr.b.Statistics.Significance.SIGNIFICANT; 428 spanD.significance = tr.b.math.Statistics.Significance.SIGNIFICANT;
429 checkSignificance(spanD, 'significantly_better'); 429 checkSignificance(spanD, 'significantly_better');
430 430
431 let spanE = document.createElement('tr-v-ui-scalar-span'); 431 let spanE = document.createElement('tr-v-ui-scalar-span');
432 spanE.setValueAndUnit( 432 spanE.setValueAndUnit(
433 400, Unit.byName.timeDurationInMsDelta_smallerIsBetter); 433 400, Unit.byName.timeDurationInMsDelta_smallerIsBetter);
434 spanE.significance = tr.b.Statistics.Significance.INSIGNIFICANT; 434 spanE.significance = tr.b.math.Statistics.Significance.INSIGNIFICANT;
435 checkSignificance(spanE, 'insignificant'); 435 checkSignificance(spanE, 'insignificant');
436 436
437 let overall = document.createElement('div'); 437 let overall = document.createElement('div');
438 overall.style.display = 'flex'; 438 overall.style.display = 'flex';
439 // These spans must be on separate lines so that Chrome has the option of 439 // These spans must be on separate lines so that Chrome has the option of
440 // making their heights different. The point of the test is that Chrome 440 // making their heights different. The point of the test is that Chrome
441 // shouldn't have to make their heights different even when it could. 441 // shouldn't have to make their heights different even when it could.
442 overall.style.flexDirection = 'column'; 442 overall.style.flexDirection = 'column';
443 Polymer.dom(overall).appendChild(spanA); 443 Polymer.dom(overall).appendChild(spanA);
444 Polymer.dom(overall).appendChild(spanB); 444 Polymer.dom(overall).appendChild(spanB);
(...skipping 81 matching lines...) Expand 10 before | Expand all | Expand 10 after
526 Polymer.dom(div).appendChild(span1); 526 Polymer.dom(div).appendChild(span1);
527 checkSparkline(span1, {display: 'none'}); 527 checkSparkline(span1, {display: 'none'});
528 let span2 = tr.v.ui.createScalarSpan(0, { 528 let span2 = tr.v.ui.createScalarSpan(0, {
529 unit: Unit.byName.timeStampInMs, 529 unit: Unit.byName.timeStampInMs,
530 customContextRange: undefined 530 customContextRange: undefined
531 }); 531 });
532 Polymer.dom(div).appendChild(span2); 532 Polymer.dom(div).appendChild(span2);
533 checkSparkline(span2, {display: 'none'}); 533 checkSparkline(span2, {display: 'none'});
534 let span3 = tr.v.ui.createScalarSpan(0, { 534 let span3 = tr.v.ui.createScalarSpan(0, {
535 unit: Unit.byName.timeStampInMs, 535 unit: Unit.byName.timeStampInMs,
536 customContextRange: new tr.b.Range() // Empty range. 536 customContextRange: new tr.b.math.Range() // Empty range.
537 }); 537 });
538 Polymer.dom(div).appendChild(span3); 538 Polymer.dom(div).appendChild(span3);
539 checkSparkline(span3, {display: 'none'}); 539 checkSparkline(span3, {display: 'none'});
540 540
541 let range = tr.b.Range.fromExplicitRange(-15, 15); 541 let range = tr.b.math.Range.fromExplicitRange(-15, 15);
542 542
543 // Values inside custom context range. 543 // Values inside custom context range.
544 let span4 = tr.v.ui.createScalarSpan(-15, { 544 let span4 = tr.v.ui.createScalarSpan(-15, {
545 unit: Unit.byName.timeStampInMs, 545 unit: Unit.byName.timeStampInMs,
546 customContextRange: range 546 customContextRange: range
547 }); 547 });
548 Polymer.dom(div).appendChild(span4); 548 Polymer.dom(div).appendChild(span4);
549 checkSparkline(span4, {left: 0, width: 51}); 549 checkSparkline(span4, {left: 0, width: 51});
550 let span5 = tr.v.ui.createScalarSpan(-14, { 550 let span5 = tr.v.ui.createScalarSpan(-14, {
551 unit: Unit.byName.timeStampInMs, 551 unit: Unit.byName.timeStampInMs,
(...skipping 103 matching lines...) Expand 10 before | Expand all | Expand 10 after
655 checkSparkline(s2, {left: 0, width: 101, classList: ['positive']}); 655 checkSparkline(s2, {left: 0, width: 101, classList: ['positive']});
656 checkSparkline(s3, {left: 0, width: 76, classList: ['positive']}); 656 checkSparkline(s3, {left: 0, width: 76, classList: ['positive']});
657 checkSparkline(s4, {left: 0, width: 101, classList: ['positive']}); 657 checkSparkline(s4, {left: 0, width: 101, classList: ['positive']});
658 658
659 s1.value = 50; 659 s1.value = 50;
660 checkSparkline(s1, {left: 0, width: 101, classList: ['positive']}); 660 checkSparkline(s1, {left: 0, width: 101, classList: ['positive']});
661 checkSparkline(s2, {left: 0, width: 41, classList: ['positive']}); 661 checkSparkline(s2, {left: 0, width: 41, classList: ['positive']});
662 checkSparkline(s3, {left: 0, width: 76, classList: ['positive']}); 662 checkSparkline(s3, {left: 0, width: 76, classList: ['positive']});
663 checkSparkline(s4, {left: 0, width: 101, classList: ['positive']}); 663 checkSparkline(s4, {left: 0, width: 101, classList: ['positive']});
664 664
665 s1.customContextRange = tr.b.Range.fromExplicitRange(0, 150); 665 s1.customContextRange = tr.b.math.Range.fromExplicitRange(0, 150);
666 checkSparkline(s1, {left: 0, width: 34.33, classList: ['positive']}); 666 checkSparkline(s1, {left: 0, width: 34.33, classList: ['positive']});
667 checkSparkline(s2, {left: 0, width: 41, classList: ['positive']}); 667 checkSparkline(s2, {left: 0, width: 41, classList: ['positive']});
668 checkSparkline(s3, {left: 0, width: 76, classList: ['positive']}); 668 checkSparkline(s3, {left: 0, width: 76, classList: ['positive']});
669 checkSparkline(s4, {left: 0, width: 101, classList: ['positive']}); 669 checkSparkline(s4, {left: 0, width: 101, classList: ['positive']});
670 670
671 s4.contextGroup = null; 671 s4.contextGroup = null;
672 checkSparkline(s1, {left: 0, width: 34.33, classList: ['positive']}); 672 checkSparkline(s1, {left: 0, width: 34.33, classList: ['positive']});
673 checkSparkline(s2, {left: 0, width: 41, classList: ['positive']}); 673 checkSparkline(s2, {left: 0, width: 41, classList: ['positive']});
674 checkSparkline(s3, {left: 0, width: 101, classList: ['positive']}); 674 checkSparkline(s3, {left: 0, width: 101, classList: ['positive']});
675 checkSparkline(s4, {display: 'none'}); 675 checkSparkline(s4, {display: 'none'});
(...skipping 25 matching lines...) Expand all
701 checkSparkline(s3, {left: 0, width: 61, classList: ['positive']}); 701 checkSparkline(s3, {left: 0, width: 61, classList: ['positive']});
702 checkSparkline(s4, {display: 'none'}); 702 checkSparkline(s4, {display: 'none'});
703 checkSparkline(s1, {left: 0, width: 101, classList: ['positive']}); 703 checkSparkline(s1, {left: 0, width: 101, classList: ['positive']});
704 704
705 s1.removeAttribute('context-group'); 705 s1.removeAttribute('context-group');
706 checkSparkline(s2, {left: 0, width: 101, classList: ['positive']}); 706 checkSparkline(s2, {left: 0, width: 101, classList: ['positive']});
707 checkSparkline(s3, {left: 0, width: 101, classList: ['positive']}); 707 checkSparkline(s3, {left: 0, width: 101, classList: ['positive']});
708 checkSparkline(s4, {display: 'none'}); 708 checkSparkline(s4, {display: 'none'});
709 checkSparkline(s1, {display: 'none'}); 709 checkSparkline(s1, {display: 'none'});
710 710
711 s1.customContextRange = tr.b.Range.fromExplicitRange(0, 100); 711 s1.customContextRange = tr.b.math.Range.fromExplicitRange(0, 100);
712 checkSparkline(s2, {left: 0, width: 101, classList: ['positive']}); 712 checkSparkline(s2, {left: 0, width: 101, classList: ['positive']});
713 checkSparkline(s3, {left: 0, width: 101, classList: ['positive']}); 713 checkSparkline(s3, {left: 0, width: 101, classList: ['positive']});
714 checkSparkline(s4, {display: 'none'}); 714 checkSparkline(s4, {display: 'none'});
715 checkSparkline(s1, {left: 0, width: 51, classList: ['positive']}); 715 checkSparkline(s1, {left: 0, width: 51, classList: ['positive']});
716 716
717 s3.value = 0; 717 s3.value = 0;
718 checkSparkline(s2, {left: 0, width: 101, classList: ['positive']}); 718 checkSparkline(s2, {left: 0, width: 101, classList: ['positive']});
719 checkSparkline(s3, {display: 'none'}); 719 checkSparkline(s3, {display: 'none'});
720 checkSparkline(s4, {display: 'none'}); 720 checkSparkline(s4, {display: 'none'});
721 checkSparkline(s1, {left: 0, width: 51, classList: ['positive']}); 721 checkSparkline(s1, {left: 0, width: 51, classList: ['positive']});
(...skipping 180 matching lines...) Expand 10 before | Expand all | Expand 10 after
902 checkSparkline(span8, {left: 0, width: 101, classList: ['worse']}); 902 checkSparkline(span8, {left: 0, width: 101, classList: ['worse']});
903 }); 903 });
904 904
905 test('classListChanges', function() { 905 test('classListChanges', function() {
906 let div = document.createElement('div'); 906 let div = document.createElement('div');
907 div.style.width = '200px'; 907 div.style.width = '200px';
908 this.addHTMLOutput(div); 908 this.addHTMLOutput(div);
909 909
910 let span = tr.v.ui.createScalarSpan(10, { 910 let span = tr.v.ui.createScalarSpan(10, {
911 unit: Unit.byName.energyInJoulesDelta_smallerIsBetter, 911 unit: Unit.byName.energyInJoulesDelta_smallerIsBetter,
912 significance: tr.b.Statistics.Significance.SIGNIFICANT, 912 significance: tr.b.math.Statistics.Significance.SIGNIFICANT,
913 customContextRange: tr.b.Range.fromExplicitRange(-20, 20) 913 customContextRange: tr.b.math.Range.fromExplicitRange(-20, 20)
914 }); 914 });
915 Polymer.dom(div).appendChild(span); 915 Polymer.dom(div).appendChild(span);
916 916
917 assert.sameMembers(tr.b.asArray(span.$.content.classList), ['worse']); 917 assert.sameMembers(tr.b.asArray(span.$.content.classList), ['worse']);
918 checkSignificance(span, 'significantly_worse'); 918 checkSignificance(span, 'significantly_worse');
919 919
920 span.significance = tr.b.Statistics.Significance.DONT_CARE; 920 span.significance = tr.b.math.Statistics.Significance.DONT_CARE;
921 assert.sameMembers(tr.b.asArray(span.$.sparkline.classList), 921 assert.sameMembers(tr.b.asArray(span.$.sparkline.classList),
922 ['positive', 'worse']); 922 ['positive', 'worse']);
923 assert.sameMembers(tr.b.asArray(span.$.content.classList), ['worse']); 923 assert.sameMembers(tr.b.asArray(span.$.content.classList), ['worse']);
924 checkSignificance(span, ''); 924 checkSignificance(span, '');
925 925
926 span.value = -5; 926 span.value = -5;
927 assert.sameMembers(tr.b.asArray(span.$.sparkline.classList), ['better']); 927 assert.sameMembers(tr.b.asArray(span.$.sparkline.classList), ['better']);
928 assert.sameMembers(tr.b.asArray(span.$.content.classList), ['better']); 928 assert.sameMembers(tr.b.asArray(span.$.content.classList), ['better']);
929 checkSignificance(span, ''); 929 checkSignificance(span, '');
930 930
931 span.unit = Unit.byName.energyInJoules; 931 span.unit = Unit.byName.energyInJoules;
932 assert.sameMembers(tr.b.asArray(span.$.sparkline.classList), []); 932 assert.sameMembers(tr.b.asArray(span.$.sparkline.classList), []);
933 assert.sameMembers(tr.b.asArray(span.$.content.classList), []); 933 assert.sameMembers(tr.b.asArray(span.$.content.classList), []);
934 checkSignificance(span, ''); 934 checkSignificance(span, '');
935 935
936 span.value = 20; 936 span.value = 20;
937 assert.sameMembers(tr.b.asArray(span.$.sparkline.classList), ['positive']); 937 assert.sameMembers(tr.b.asArray(span.$.sparkline.classList), ['positive']);
938 assert.sameMembers(tr.b.asArray(span.$.content.classList), []); 938 assert.sameMembers(tr.b.asArray(span.$.content.classList), []);
939 checkSignificance(span, ''); 939 checkSignificance(span, '');
940 940
941 span.unit = Unit.byName.energyInJoulesDelta_biggerIsBetter; 941 span.unit = Unit.byName.energyInJoulesDelta_biggerIsBetter;
942 assert.sameMembers(tr.b.asArray(span.$.sparkline.classList), 942 assert.sameMembers(tr.b.asArray(span.$.sparkline.classList),
943 ['positive', 'better']); 943 ['positive', 'better']);
944 assert.sameMembers(tr.b.asArray(span.$.content.classList), ['better']); 944 assert.sameMembers(tr.b.asArray(span.$.content.classList), ['better']);
945 checkSignificance(span, ''); 945 checkSignificance(span, '');
946 946
947 span.significance = tr.b.Statistics.Significance.INSIGNIFICANT; 947 span.significance = tr.b.math.Statistics.Significance.INSIGNIFICANT;
948 assert.sameMembers(tr.b.asArray(span.$.sparkline.classList), 948 assert.sameMembers(tr.b.asArray(span.$.sparkline.classList),
949 ['positive', 'better']); 949 ['positive', 'better']);
950 assert.sameMembers(tr.b.asArray(span.$.content.classList), ['better']); 950 assert.sameMembers(tr.b.asArray(span.$.content.classList), ['better']);
951 checkSignificance(span, 'insignificant'); 951 checkSignificance(span, 'insignificant');
952 952
953 span.unit = Unit.byName.energyInJoulesDelta_smallerIsBetter; 953 span.unit = Unit.byName.energyInJoulesDelta_smallerIsBetter;
954 assert.sameMembers(tr.b.asArray(span.$.sparkline.classList), 954 assert.sameMembers(tr.b.asArray(span.$.sparkline.classList),
955 ['positive', 'worse']); 955 ['positive', 'worse']);
956 assert.sameMembers(tr.b.asArray(span.$.content.classList), ['worse']); 956 assert.sameMembers(tr.b.asArray(span.$.content.classList), ['worse']);
957 checkSignificance(span, 'insignificant'); 957 checkSignificance(span, 'insignificant');
(...skipping 34 matching lines...) Expand 10 before | Expand all | Expand 10 after
992 }); 992 });
993 993
994 test('sparkline_centered', function() { 994 test('sparkline_centered', function() {
995 let div = document.createElement('div'); 995 let div = document.createElement('div');
996 this.addHTMLOutput(div); 996 this.addHTMLOutput(div);
997 div.appendChild( 997 div.appendChild(
998 document.createElement('tr-v-ui-scalar-context-controller')); 998 document.createElement('tr-v-ui-scalar-context-controller'));
999 999
1000 Polymer.dom(div).appendChild(tr.v.ui.createScalarSpan(-1, { 1000 Polymer.dom(div).appendChild(tr.v.ui.createScalarSpan(-1, {
1001 unit: Unit.byName.powerInWattsDelta, 1001 unit: Unit.byName.powerInWattsDelta,
1002 customContextRange: tr.b.Range.fromExplicitRange(-100, 100) 1002 customContextRange: tr.b.math.Range.fromExplicitRange(-100, 100)
1003 })); 1003 }));
1004 Polymer.dom(div).appendChild(tr.v.ui.createScalarSpan(100, { 1004 Polymer.dom(div).appendChild(tr.v.ui.createScalarSpan(100, {
1005 unit: Unit.byName.powerInWattsDelta, 1005 unit: Unit.byName.powerInWattsDelta,
1006 customContextRange: tr.b.Range.fromExplicitRange(-100, 100) 1006 customContextRange: tr.b.math.Range.fromExplicitRange(-100, 100)
1007 })); 1007 }));
1008 Polymer.dom(div).appendChild(tr.v.ui.createScalarSpan(80, { 1008 Polymer.dom(div).appendChild(tr.v.ui.createScalarSpan(80, {
1009 unit: Unit.byName.powerInWattsDelta, 1009 unit: Unit.byName.powerInWattsDelta,
1010 customContextRange: tr.b.Range.fromExplicitRange(-100, 100) 1010 customContextRange: tr.b.math.Range.fromExplicitRange(-100, 100)
1011 })); 1011 }));
1012 Polymer.dom(div).appendChild(tr.v.ui.createScalarSpan(60, { 1012 Polymer.dom(div).appendChild(tr.v.ui.createScalarSpan(60, {
1013 unit: Unit.byName.powerInWattsDelta, 1013 unit: Unit.byName.powerInWattsDelta,
1014 customContextRange: tr.b.Range.fromExplicitRange(-100, 100) 1014 customContextRange: tr.b.math.Range.fromExplicitRange(-100, 100)
1015 })); 1015 }));
1016 }); 1016 });
1017 1017
1018 timedPerfTest('memory_scalar_spans', function() { 1018 timedPerfTest('memory_scalar_spans', function() {
1019 tr.v.ui.createScalarSpan(EXAMPLE_MEMORY_NUMERIC, { 1019 tr.v.ui.createScalarSpan(EXAMPLE_MEMORY_NUMERIC, {
1020 context: EXAMPLE_MEMORY_FORMATTING_CONTEXT, 1020 context: EXAMPLE_MEMORY_FORMATTING_CONTEXT,
1021 inline: true, 1021 inline: true,
1022 }); 1022 });
1023 }, { 1023 }, {
1024 iterations: 1000, 1024 iterations: 1000,
1025 }); 1025 });
1026 }); 1026 });
1027 </script> 1027 </script>
OLDNEW
« no previous file with comments | « tracing/tracing/value/ui/scalar_span.html ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698