Gitiles
Code Review Sign In
gerrit-public.fairphone.software / fp2-dev / platform / external / chromium-trace / 44c2820018b23a442f29b3e0a1fbb1b93b62411a / . / trace-viewer / trace_viewer / core / tracks / rect_track_test.html
blob: 0959e38529c8a66735601dbef3d84418287aff2b [file] [log] [blame]
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]1<!DOCTYPE html>
2<!--
3Copyright (c) 2013 The Chromium Authors. All rights reserved.
4Use of this source code is governed by a BSD-style license that can be
5found in the LICENSE file.
6-->
7
8<link rel="import" href="/core/test_utils.html">
9<link rel="import" href="/core/trace_model/slice.html">
10<link rel="import" href="/core/timeline_track_view.html">
11<link rel="import" href="/core/draw_helpers.html">
12<link rel="import" href="/base/ui/dom_helpers.html">
13
14<script>
15'use strict';
16
17tv.b.unittest.testSuite(function() {
18 var Selection = tv.c.Selection;
19 var RectTrack = tv.c.tracks.RectTrack;
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]20 var Rect = tv.c.tracks.Rect;
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]21 var Slice = tv.c.trace_model.Slice;
22 var Viewport = tv.c.TimelineViewport;
23
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]24 test('instantiate_withRects', function() {
25 var div = document.createElement('div');
26
27 var viewport = new Viewport(div);
28 var drawingContainer = new tv.c.tracks.DrawingContainer(viewport);
29 div.appendChild(drawingContainer);
30
31 var track = RectTrack(viewport);
32 drawingContainer.appendChild(track);
33
34 this.addHTMLOutput(div);
35 drawingContainer.invalidate();
36
37 track.heading = 'testBasicRects';
38 track.rects = [
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]39 new Rect(undefined, 'a', 0, 1, 1),
40 new Rect(undefined, 'b', 1, 2.1, 4.8),
41 new Rect(undefined, 'b', 1, 7, 0.5),
42 new Rect(undefined, 'c', 2, 7.6, 0.4)
43 ];
44
45 var dt = new tv.c.TimelineDisplayTransform();
46 dt.xSetWorldBounds(0, 8.8, track.clientWidth);
47 track.viewport.setDisplayTransformImmediately(dt);
48 });
49
50 test('instantiate_withSlices', function() {
51 var div = document.createElement('div');
52
53 var viewport = new Viewport(div);
54 var drawingContainer = new tv.c.tracks.DrawingContainer(viewport);
55 div.appendChild(drawingContainer);
56
57 var track = RectTrack(viewport);
58 drawingContainer.appendChild(track);
59
60 this.addHTMLOutput(div);
61 drawingContainer.invalidate();
62
63 track.heading = 'testBasicSlices';
64 track.rects = [
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]65 new Slice('', 'a', 0, 1, {}, 1),
66 new Slice('', 'b', 1, 2.1, {}, 4.8),
67 new Slice('', 'b', 1, 7, {}, 0.5),
68 new Slice('', 'c', 2, 7.6, {}, 0.4)
69 ];
70
71 var dt = new tv.c.TimelineDisplayTransform();
72 dt.xSetWorldBounds(0, 8.8, track.clientWidth);
73 track.viewport.setDisplayTransformImmediately(dt);
74 });
75
76 test('instantiate_shrinkingRectSize', function() {
77 var div = document.createElement('div');
78
79 var viewport = new Viewport(div);
80 var drawingContainer = new tv.c.tracks.DrawingContainer(viewport);
81 div.appendChild(drawingContainer);
82
83 var track = RectTrack(viewport);
84 drawingContainer.appendChild(track);
85
86 this.addHTMLOutput(div);
87 drawingContainer.invalidate();
88
89 track.heading = 'testShrinkingRectSizes';
90 var x = 0;
91 var widths = [10, 5, 4, 3, 2, 1, 0.5, 0.4, 0.3, 0.2, 0.1, 0.05];
92 var slices = [];
93 for (var i = 0; i < widths.length; i++) {
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]94 var s = new Rect(undefined, 'a', 1, x, widths[i]);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]95 x += s.duration + 0.5;
96 slices.push(s);
97 }
98 track.rects = slices;
99 var dt = new tv.c.TimelineDisplayTransform();
100 dt.xSetWorldBounds(0, 1.1 * x, track.clientWidth);
101 track.viewport.setDisplayTransformImmediately(dt);
102 });
103
104 test('instantiate_elide', function() {
105 var optDicts = [{ trackName: 'elideOff', elide: false },
106 { trackName: 'elideOn', elide: true }];
107
108 var tooLongTitle = 'Unless eliding this SHOULD NOT BE DISPLAYED. ';
109 var bigTitle = 'Very big title name that goes on longer ' +
110 'than you may expect';
111
112 for (var dictIndex in optDicts) {
113 var dict = optDicts[dictIndex];
114
115 var div = document.createElement('div');
116 div.appendChild(document.createTextNode(dict.trackName));
117
118 var viewport = new Viewport(div);
119 var drawingContainer = new tv.c.tracks.DrawingContainer(viewport);
120 div.appendChild(drawingContainer);
121
122 var track = new RectTrack(viewport);
123 drawingContainer.appendChild(track);
124
125 this.addHTMLOutput(div);
126 drawingContainer.invalidate();
127
128 track.SHOULD_ELIDE_TEXT = dict.elide;
129 track.heading = 'Visual: ' + dict.trackName;
130 track.rects = [
131 // title, colorId, start, args, opt_duration
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]132 new Rect(undefined, 'a ' + tooLongTitle + bigTitle, 0, 1, 1),
133 new Rect(undefined, bigTitle, 1, 2.1, 4.8),
134 new Rect(undefined, 'cccc cccc cccc', 1, 7, 0.5),
135 new Rect(undefined, 'd', 2, 7.6, 1.0)
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]136 ];
137 var dt = new tv.c.TimelineDisplayTransform();
138 dt.xSetWorldBounds(0, 9.5, track.clientWidth);
139 track.viewport.setDisplayTransformImmediately(dt);
140 }
141 });
142
143 test('findAllObjectsMatchingInRectTrack', function() {
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]144 var track = new RectTrack(new tv.c.TimelineViewport());
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]145 track.rects = [
146 new Slice('', 'a', 0, 1, {}, 1),
147 new Slice('', 'b', 1, 2.1, {}, 4.8),
148 new Slice('', 'b', 1, 7, {}, 0.5),
149 new Slice('', 'c', 2, 7.6, {}, 0.4)
150 ];
151 var selection = new Selection();
Chris Craik44c28202015-05-12 17:25:16 -0700[diff] [blame^]152 track.addAllEventsMatchingFilterToSelection(
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]153 new tv.c.TitleOrCategoryFilter('b'), selection);
154
155 assert.equal(2, selection.length);
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]156 assert.equal(track.rects[1].modelItem, selection[0]);
157 assert.equal(track.rects[2].modelItem, selection[1]);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]158 });
159
160 test('selectionHitTesting', function() {
161 var testEl = document.createElement('div');
162 testEl.appendChild(tv.b.ui.createScopedStyle('heading { width: 100px; }'));
163 testEl.style.width = '600px';
164
165 var viewport = new Viewport(testEl);
166 var drawingContainer = new tv.c.tracks.DrawingContainer(viewport);
167 testEl.appendChild(drawingContainer);
168
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]169 var track = new RectTrack(viewport);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]170 drawingContainer.appendChild(track);
171 this.addHTMLOutput(testEl);
172
173 drawingContainer.updateCanvasSizeIfNeeded_();
174
175 track.heading = 'testSelectionHitTesting';
176 track.rects = [
177 new Slice('', 'a', 0, 1, {}, 1),
178 new Slice('', 'b', 1, 5, {}, 4.8)
179 ];
180 var y = track.getBoundingClientRect().top + 5;
181 var pixelRatio = window.devicePixelRatio || 1;
182 var wW = 10;
183 var vW = drawingContainer.canvas.getBoundingClientRect().width;
184
185 var dt = new tv.c.TimelineDisplayTransform();
186 dt.xSetWorldBounds(0, wW, vW * pixelRatio);
187 track.viewport.setDisplayTransformImmediately(dt);
188
189 var selection = new Selection();
190 var x = (1.5 / wW) * vW;
Chris Craik44c28202015-05-12 17:25:16 -0700[diff] [blame^]191 track.addIntersectingEventsInRangeToSelection(
192 x, x + 1, y, y + 1, selection);
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]193 assert.equal(track.rects[0].modelItem, selection[0]);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]194
195 var selection = new Selection();
196 x = (2.1 / wW) * vW;
Chris Craik44c28202015-05-12 17:25:16 -0700[diff] [blame^]197 track.addIntersectingEventsInRangeToSelection(
198 x, x + 1, y, y + 1, selection);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]199 assert.equal(0, selection.length);
200
201 var selection = new Selection();
202 x = (6.8 / wW) * vW;
Chris Craik44c28202015-05-12 17:25:16 -0700[diff] [blame^]203 track.addIntersectingEventsInRangeToSelection(
204 x, x + 1, y, y + 1, selection);
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]205 assert.equal(track.rects[1].modelItem, selection[0]);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]206
207 var selection = new Selection();
208 x = (9.9 / wW) * vW;
Chris Craik44c28202015-05-12 17:25:16 -0700[diff] [blame^]209 track.addIntersectingEventsInRangeToSelection(
210 x, x + 1, y, y + 1, selection);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]211 assert.equal(0, selection.length);
212 });
213
214 test('elide', function() {
215 var testEl = document.createElement('div');
216
217 var viewport = new Viewport(testEl);
218 var drawingContainer = new tv.c.tracks.DrawingContainer(viewport);
219 testEl.appendChild(drawingContainer);
220
221 var track = new RectTrack(viewport);
222 drawingContainer.appendChild(track);
223 this.addHTMLOutput(testEl);
224
225 drawingContainer.updateCanvasSizeIfNeeded_();
226
227 var bigtitle = 'Super duper long long title ' +
228 'holy moly when did you get so verbose?';
229 var smalltitle = 'small';
230 track.heading = 'testElide';
231 track.rects = [
232 // title, colorId, start, args, opt_duration
233 new Slice('', bigtitle, 0, 1, {}, 1),
234 new Slice('', smalltitle, 1, 2, {}, 1)
235 ];
236 var dt = new tv.c.TimelineDisplayTransform();
237 dt.xSetWorldBounds(0, 3.3, track.clientWidth);
238 track.viewport.setDisplayTransformImmediately(dt);
239
240 var stringWidthPair = undefined;
241 var pixWidth = dt.xViewVectorToWorld(1);
242
243 // Small titles on big slices are not elided.
244 stringWidthPair =
245 tv.c.elidedTitleCache_.get(
246 track.context(),
247 pixWidth,
248 smalltitle,
249 tv.c.elidedTitleCache_.labelWidth(
250 track.context(),
251 smalltitle),
252 1);
253 assert.equal(smalltitle, stringWidthPair.string);
254
255 // Keep shrinking the slice until eliding starts.
256 var elidedWhenSmallEnough = false;
257 for (var sliceLength = 1; sliceLength >= 0.00001; sliceLength /= 2.0) {
258 stringWidthPair =
259 tv.c.elidedTitleCache_.get(
260 track.context(),
261 pixWidth,
262 smalltitle,
263 tv.c.elidedTitleCache_.labelWidth(
264 track.context(),
265 smalltitle),
266 sliceLength);
267 if (stringWidthPair.string.length < smalltitle.length) {
268 elidedWhenSmallEnough = true;
269 break;
270 }
271 }
272 assert.isTrue(elidedWhenSmallEnough);
273
274 // Big titles are elided immediately.
275 var superBigTitle = '';
276 for (var x = 0; x < 10; x++) {
277 superBigTitle += bigtitle;
278 }
279 stringWidthPair =
280 tv.c.elidedTitleCache_.get(
281 track.context(),
282 pixWidth,
283 superBigTitle,
284 tv.c.elidedTitleCache_.labelWidth(
285 track.context(),
286 superBigTitle),
287 1);
288 assert.isTrue(stringWidthPair.string.length < superBigTitle.length);
289
290 // And elided text ends with ...
291 var len = stringWidthPair.string.length;
292 assert.equal('...', stringWidthPair.string.substring(len - 3, len));
293 });
294
295 test('rectTrackAddItemNearToProvidedEvent', function() {
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]296 var track = new RectTrack(new tv.c.TimelineViewport());
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]297 track.rects = [
298 new Slice('', 'a', 0, 1, {}, 1),
299 new Slice('', 'b', 1, 2.1, {}, 4.8),
300 new Slice('', 'b', 1, 7, {}, 0.5),
301 new Slice('', 'c', 2, 7.6, {}, 0.4)
302 ];
303 var sel = new Selection();
Chris Craik44c28202015-05-12 17:25:16 -0700[diff] [blame^]304 track.addAllEventsMatchingFilterToSelection(
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]305 new tv.c.TitleOrCategoryFilter('b'), sel);
306 var ret;
307
308 // Select to the right of B.
309 var selRight = new Selection();
Chris Craik44c28202015-05-12 17:25:16 -0700[diff] [blame^]310 ret = track.addEventNearToProvidedEventToSelection(sel[0], 1, selRight);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]311 assert.isTrue(ret);
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]312 assert.equal(track.rects[2].modelItem, selRight[0]);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]313
314 // Select to the right of the 2nd b.
315 var selRight2 = new Selection();
Chris Craik44c28202015-05-12 17:25:16 -0700[diff] [blame^]316 ret = track.addEventNearToProvidedEventToSelection(sel[0], 2, selRight2);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]317 assert.isTrue(ret);
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]318 assert.equal(track.rects[3].modelItem, selRight2[0]);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]319
320 // Select to 2 to the right of the 2nd b.
321 var selRightOfRight = new Selection();
Chris Craik44c28202015-05-12 17:25:16 -0700[diff] [blame^]322 ret = track.addEventNearToProvidedEventToSelection(
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]323 selRight[0], 1, selRightOfRight);
324 assert.isTrue(ret);
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]325 assert.equal(track.rects[3].modelItem, selRightOfRight[0]);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]326
327 // Select to the right of the rightmost slice.
328 var selNone = new Selection();
Chris Craik44c28202015-05-12 17:25:16 -0700[diff] [blame^]329 ret = track.addEventNearToProvidedEventToSelection(
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]330 selRightOfRight[0], 1, selNone);
331 assert.isFalse(ret);
332 assert.equal(0, selNone.length);
333
334 // Select A and then select left.
335 var sel = new Selection();
Chris Craik44c28202015-05-12 17:25:16 -0700[diff] [blame^]336 track.addAllEventsMatchingFilterToSelection(
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]337 new tv.c.TitleOrCategoryFilter('a'), sel);
338 var ret;
339
340 selNone = new Selection();
Chris Craik44c28202015-05-12 17:25:16 -0700[diff] [blame^]341 ret = track.addEventNearToProvidedEventToSelection(sel[0], -1, selNone);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]342 assert.isFalse(ret);
343 assert.equal(0, selNone.length);
344 });
345
346 test('rectTrackAddClosestEventToSelection', function() {
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]347 var track = new RectTrack(new tv.c.TimelineViewport());
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]348 track.rects = [
349 new Slice('', 'a', 0, 1, {}, 1),
350 new Slice('', 'b', 1, 2.1, {}, 4.8),
351 new Slice('', 'b', 1, 7, {}, 0.5),
352 new Slice('', 'c', 2, 7.6, {}, 0.4)
353 ];
354
355 // Before with not range.
356 var sel = new Selection();
357 track.addClosestEventToSelection(0, 0, 0, 0, sel);
358 assert.equal(0, sel.length);
359
360 // Before with negative range.
361 var sel = new Selection();
362 track.addClosestEventToSelection(1.5, -10, 0, 0, sel);
363 assert.equal(0, sel.length);
364
365 // Before first slice.
366 var sel = new Selection();
367 track.addClosestEventToSelection(0.5, 1, 0, 0, sel);
368 assert.equal(1, sel.length);
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]369 assert.equal(track.rects[0].modelItem, sel[0]);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]370
371 // Within first slice closer to start.
372 var sel = new Selection();
373 track.addClosestEventToSelection(1.3, 1, 0, 0, sel);
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]374 assert.equal(track.rects[0].modelItem, sel[0]);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]375
376 // Between slices with good range.
377 var sel = new Selection();
378 track.addClosestEventToSelection(2.08, 3, 0, 0, sel);
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]379 assert.equal(track.rects[1].modelItem, sel[0]);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]380
381 // Between slices with bad range.
382 var sel = new Selection();
383 track.addClosestEventToSelection(2.05, 0.03, 0, 0, sel);
384 assert.equal(0, sel.length);
385
386 // Within slice closer to end.
387 var sel = new Selection();
388 track.addClosestEventToSelection(6, 100, 0, 0, sel);
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]389 assert.equal(track.rects[1].modelItem, sel[0]);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]390
391 // Within slice with bad range.
392 var sel = new Selection();
393 track.addClosestEventToSelection(1.8, 0.1, 0, 0, sel);
394 assert.equal(0, sel.length);
395
396 // After last slice with good range.
397 var sel = new Selection();
398 track.addClosestEventToSelection(8.5, 1, 0, 0, sel);
Chris Craik19832152015-04-16 15:43:38 -0700[diff] [blame]399 assert.equal(track.rects[3].modelItem, sel[0]);
Chris Craikb122baf2015-03-05 13:58:42 -0800[diff] [blame]400
401 // After last slice with bad range.
402 var sel = new Selection();
403 track.addClosestEventToSelection(10, 1, 0, 0, sel);
404 assert.equal(0, sel.length);
405 });
406});
407</script>