1 <!DOCTYPE html> 2 <!-- 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 5 found 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 14 tr.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 Polymer.dom(divEl).textContent = 'Pane ' + paneId; 25 divEl.style.width = '400px'; 26 divEl.style.background = '#ccc'; 27 divEl.style.textAlign = 'center'; 28 Polymer.dom(paneEl).appendChild(divEl); 29 30 if (opt_rebuildPaneCallback) 31 paneEl.onRebuild_ = 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.scheduleRebuild_(); 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
