stacked_pane_view_test.html revision 46b43bff003ceda46cf9a5d40a47f7674996d2e0 
1<!DOCTYPE html>
2<!--
3Copyright 2015 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="/tracing/ui/analysis/stacked_pane.html">
9<link rel="import" href="/tracing/ui/analysis/stacked_pane_view.html">
10
11<script>
12'use strict';
13
14tr.b.unittest.testSuite(function() {
15  function createPaneView() {
16    return document.createElement('tr-ui-a-stacked-pane-view');
17  }
18
19  function createPane(paneId, opt_rebuildPaneCallback, opt_appendedCallback) {
20    var paneEl = document.createElement('tr-ui-a-stacked-pane');
21    paneEl.paneId = paneId;
22
23    var divEl = document.createElement('div');
24    divEl.textContent = 'Pane ' + paneId;
25    divEl.style.width = '400px';
26    divEl.style.background = '#ccc';
27    divEl.style.textAlign = 'center';
28    paneEl.appendChild(divEl);
29
30    if (opt_rebuildPaneCallback)
31      paneEl.rebuildPane_ = opt_rebuildPaneCallback;
32
33    if (opt_appendedCallback)
34      paneEl.appended = opt_appendedCallback;
35
36    return paneEl;
37  }
38
39  function createPaneBuilder(paneId, opt_rebuildPaneCallback,
40      opt_appendedCallback) {
41    return createPane.bind(
42        undefined, paneId, opt_rebuildPaneCallback, opt_appendedCallback);
43  }
44
45  function assertPanes(paneView, expectedPaneIds) {
46    var actualPaneIds = paneView.panesForTesting.map(function(pane) {
47      return pane.paneId;
48    });
49    assert.deepEqual(actualPaneIds, expectedPaneIds);
50  }
51
52  test('instantiate_empty', function() {
53    var viewEl = createPaneView();
54    viewEl.rebuild();
55    assertPanes(viewEl, []);
56    // Don't add the pane to HTML output because it has zero height.
57  });
58
59  test('instantiate_singlePane', function() {
60    var viewEl = createPaneView();
61
62    viewEl.setPaneBuilder(createPaneBuilder(1));
63    viewEl.rebuild();
64
65    assertPanes(viewEl, [1]);
66    this.addHTMLOutput(viewEl);
67  });
68
69  test('instantiate_multiplePanes', function() {
70    var viewEl = createPaneView();
71
72    viewEl.setPaneBuilder(createPaneBuilder(1));
73    viewEl.setPaneBuilder(createPaneBuilder(2), viewEl.panesForTesting[0]);
74    viewEl.setPaneBuilder(createPaneBuilder(3), viewEl.panesForTesting[1]);
75
76    assertPanes(viewEl, [1, 2, 3]);
77    this.addHTMLOutput(viewEl);
78  });
79
80  test('changePanes', function() {
81    var viewEl = createPaneView();
82
83    viewEl.setPaneBuilder(createPaneBuilder(1));
84    assertPanes(viewEl, [1]);
85
86    viewEl.setPaneBuilder(null);
87    assertPanes(viewEl, []);
88
89    viewEl.setPaneBuilder(createPaneBuilder(2));
90    assertPanes(viewEl, [2]);
91
92    viewEl.setPaneBuilder(createPaneBuilder(3), viewEl.panesForTesting[0]);
93    assertPanes(viewEl, [2, 3]);
94
95    viewEl.setPaneBuilder(createPaneBuilder(4), viewEl.panesForTesting[0]);
96    assertPanes(viewEl, [2, 4]);
97
98    viewEl.setPaneBuilder(createPaneBuilder(5), viewEl.panesForTesting[1]);
99    assertPanes(viewEl, [2, 4, 5]);
100
101    viewEl.setPaneBuilder(createPaneBuilder(6), viewEl.panesForTesting[2]);
102    assertPanes(viewEl, [2, 4, 5, 6]);
103
104    viewEl.setPaneBuilder(createPaneBuilder(7), viewEl.panesForTesting[1]);
105    assertPanes(viewEl, [2, 4, 7]);
106
107    this.addHTMLOutput(viewEl);
108  });
109
110  test('childPanes', function() {
111    var viewEl = createPaneView();
112
113    viewEl.setPaneBuilder(createPaneBuilder(1));
114    assertPanes(viewEl, [1]);
115
116    // Pane 1 requests a child pane 2.
117    var pane1 = viewEl.panesForTesting[0];
118    pane1.childPaneBuilder = createPaneBuilder(2);
119    assertPanes(viewEl, [1, 2]);
120
121    // Pane 2 requests removing its child pane (nothing happens).
122    var pane2 = viewEl.panesForTesting[1];
123    pane2.childPaneBuilder = undefined;
124    assertPanes(viewEl, [1, 2]);
125
126    // Pane 2 requests a child pane 3.
127    pane2.childPaneBuilder = createPaneBuilder(3);
128    assertPanes(viewEl, [1, 2, 3]);
129
130    // Pane 2 requests a child pane 4 (its previous child pane 3 is removed).
131    pane2.childPaneBuilder = createPaneBuilder(4);
132    assertPanes(viewEl, [1, 2, 4]);
133
134    // Pane 1 requests removing its child pane (panes 2 and 4 are removed).
135    pane1.childPaneBuilder = undefined;
136    assertPanes(viewEl, [1]);
137
138    // Check that removed panes cannot affect the pane view.
139    pane2.childPaneBuilder = createPaneBuilder(5);
140    assertPanes(viewEl, [1]);
141
142    // Pane 1 requests a child pane 6 (check that everything still works).
143    pane1.childPaneBuilder = createPaneBuilder(6);
144    assertPanes(viewEl, [1, 6]);
145
146    // Change the top pane to pane 7.
147    viewEl.setPaneBuilder(createPaneBuilder(7));
148    assertPanes(viewEl, [7]);
149
150    // Check that removed panes cannot affect the pane view.
151    pane1.childPaneBuilder = createPaneBuilder(5);
152    assertPanes(viewEl, [7]);
153  });
154
155  test('rebuild', function() {
156    var viewEl = createPaneView();
157
158    var rebuiltPaneIds = [];
159    var rebuildPaneCallback = function() {
160      rebuiltPaneIds.push(this.paneId);
161    };
162
163    viewEl.setPaneBuilder(createPaneBuilder(1, rebuildPaneCallback));
164    viewEl.setPaneBuilder(createPaneBuilder(2, rebuildPaneCallback),
165        viewEl.panesForTesting[0]);
166    viewEl.setPaneBuilder(createPaneBuilder(3, rebuildPaneCallback),
167        viewEl.panesForTesting[1]);
168
169    // Rebuild isn't triggered.
170    assert.deepEqual(rebuiltPaneIds, []);
171
172    // Rebuild is triggered, but it isn't necessary (all panes are clean).
173    viewEl.rebuild();
174    assert.deepEqual(rebuiltPaneIds, []);
175
176    // All panes are now marked as dirty, but rebuild isn't triggered (it was
177    // only scheduled).
178    viewEl.panesForTesting.forEach(function(pane) {
179      pane.scheduleRebuildPane_();
180    });
181    assert.deepEqual(rebuiltPaneIds, []);
182
183    // Finally, rebuild was triggered and the panes are dirty.
184    viewEl.rebuild();
185    assert.deepEqual(rebuiltPaneIds, [1, 2, 3]);
186
187    // Make sure that panes are clean after the previous rebuild.
188    viewEl.rebuild();
189    assert.deepEqual(rebuiltPaneIds, [1, 2, 3]);
190  });
191
192  test('appended', function() {
193    var viewEl = createPaneView();
194    var didFireAppended;
195
196    didFireAppended = false;
197    viewEl.setPaneBuilder(createPaneBuilder(1, undefined, function() {
198      didFireAppended = true;
199    }));
200    assert.isTrue(didFireAppended);
201  });
202});
203</script>
204