OLD | NEW |
| (Empty) |
1 <!doctype html> | |
2 <!-- | |
3 Copyright (c) 2014 The Polymer Project Authors. All rights reserved. | |
4 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt | |
5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | |
6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt | |
7 Code distributed by Google as part of the polymer project is also | |
8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt | |
9 --> | |
10 <html> | |
11 <head> | |
12 <title>core-resizable tests</title> | |
13 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-
scale=1.0"> | |
14 <script src="../../webcomponentsjs/webcomponents.js"></script> | |
15 <script src="../../web-component-tester/browser.js"></script> | |
16 <link rel="import" href="../core-resizable.html"> | |
17 <link rel="import" href="test-elements.html"> | |
18 </head> | |
19 <body fit> | |
20 | |
21 <!-- | |
22 | |
23 Notes on Polyfill compatibility in tests: | |
24 - Test elements loaded via imports, to ensure load order correctness | |
25 w.r.t. Polymer.mixin being availbale | |
26 - Resize notifications and asserts are done asynchronously, since | |
27 there are timing differences w.r.t. when detached callbacks occur | |
28 | |
29 --> | |
30 | |
31 <polymer-element name='test-element' noscript> | |
32 <template> | |
33 | |
34 <!-- Normal CoreResizer parent with child CoreResizables --> | |
35 <core-resizer-parent id="parent"> | |
36 <core-resizable id="child1a"></core-resizable> | |
37 <div> | |
38 <core-resizable id="child1b"></core-resizable> | |
39 </div> | |
40 <core-resizable-in-shadow id="shadow1c"></core-resizable-in-shadow> | |
41 <div> | |
42 <core-resizable-in-shadow id="shadow1d"></core-resizable-in-shadow> | |
43 </div> | |
44 </core-resizer-parent> | |
45 | |
46 <!-- CoreResizer parent using shouldNotify, with child CoreResizables --> | |
47 <core-resizer-parent-filtered id="parentFiltered"> | |
48 <core-resizable id="child2a"></core-resizable> | |
49 <div> | |
50 <core-resizable id="child2b"></core-resizable> | |
51 </div> | |
52 <core-resizable-in-shadow id="shadow2c"></core-resizable-in-shadow> | |
53 <div> | |
54 <core-resizable-in-shadow id="shadow2d"></core-resizable-in-shadow> | |
55 </div> | |
56 </core-resizer-parent-filtered> | |
57 | |
58 <!-- CoreResizer using resizerIsPeer:true, with peer CoreResizables --> | |
59 <div> | |
60 <core-resizable id="child3a"></core-resizable> | |
61 <div> | |
62 <core-resizable id="child3b"></core-resizable> | |
63 </div> | |
64 <core-resizer-peer id="peer"></core-resizer-peer> | |
65 <core-resizable-in-shadow id="shadow3c"></core-resizable-in-shadow> | |
66 <div> | |
67 <core-resizable-in-shadow id="shadow3d"></core-resizable-in-shadow> | |
68 </div> | |
69 </div> | |
70 | |
71 <!-- CoreResizer using resizerIsPeer:true and shouldNotify, with peer CoreRe
sizables --> | |
72 <div> | |
73 <core-resizable id="child4a"></core-resizable> | |
74 <div> | |
75 <core-resizable id="child4b"></core-resizable> | |
76 </div> | |
77 <core-resizer-peer-filtered id="peerFiltered"></core-resizer-peer-filtered
> | |
78 <core-resizable-in-shadow id="shadow4c"></core-resizable-in-shadow> | |
79 <div> | |
80 <core-resizable-in-shadow id="shadow4d"></core-resizable-in-shadow> | |
81 </div> | |
82 </div> | |
83 | |
84 <!-- Nested CoreResizers --> | |
85 <core-resizer-parent id="parentTop"> | |
86 <core-resizer-parent id="parentNested"> | |
87 <core-resizable id="child5a"></core-resizable> | |
88 <core-resizer-peer id="peerNested"></core-resizer-peer> | |
89 <div> | |
90 <core-resizable-in-shadow id="shadow5b"></core-resizable-in-shadow> | |
91 </div> | |
92 </core-resizer-parent> | |
93 </core-resizer-parent> | |
94 | |
95 </template> | |
96 | |
97 </polymer-element> | |
98 | |
99 <test-element></test-element> | |
100 | |
101 <script> | |
102 | |
103 document.addEventListener('polymer-ready', function() { | |
104 | |
105 var testEl = document.querySelector('test-element'); | |
106 | |
107 var registered = []; | |
108 var notifyPending = []; | |
109 var registerResizeHandler = function(el, expectNotification) { | |
110 registered.push(el); | |
111 if (expectNotification !== false) { | |
112 notifyPending.push(el); | |
113 } | |
114 el.resizeHandler = function() { | |
115 var idx = notifyPending.indexOf(this); | |
116 if (idx < 0) { | |
117 debugger; | |
118 } | |
119 assert(idx >= 0, 'resize notified to unexpected resizable ' + this.local
Name + '#' + this.id); | |
120 notifyPending.splice(idx, 1); | |
121 }.bind(el); | |
122 }; | |
123 var unregisterResizeHandlers = function() { | |
124 registered.forEach(function(r) { | |
125 r.resizeHandler = null; | |
126 }); | |
127 registered = []; | |
128 notifyPending = []; | |
129 }; | |
130 | |
131 suite('core-resizer-parent', function() { | |
132 | |
133 test('notify resizables from window', function(done) { | |
134 registerResizeHandler(testEl.$.parent); | |
135 registerResizeHandler(testEl.$.child1a); | |
136 registerResizeHandler(testEl.$.child1b); | |
137 registerResizeHandler(testEl.$.shadow1c.$.resizable); | |
138 registerResizeHandler(testEl.$.shadow1d.$.resizable); | |
139 setTimeout(function() { | |
140 window.dispatchEvent(new CustomEvent('resize', { bubbles: false })); | |
141 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
142 unregisterResizeHandlers(); | |
143 done(); | |
144 }); | |
145 }); | |
146 | |
147 test('notify resizables from parent', function(done) { | |
148 registerResizeHandler(testEl.$.parent); | |
149 registerResizeHandler(testEl.$.child1a); | |
150 registerResizeHandler(testEl.$.child1b); | |
151 registerResizeHandler(testEl.$.shadow1c.$.resizable); | |
152 registerResizeHandler(testEl.$.shadow1d.$.resizable); | |
153 setTimeout(function() { | |
154 testEl.$.parent.notifyResize(); | |
155 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
156 unregisterResizeHandlers(); | |
157 done(); | |
158 }); | |
159 }); | |
160 | |
161 test('detach resizables then notify parent', function(done) { | |
162 registerResizeHandler(testEl.$.parent); | |
163 registerResizeHandler(testEl.$.child1a, false); | |
164 registerResizeHandler(testEl.$.child1b); | |
165 registerResizeHandler(testEl.$.shadow1c.$.resizable, false); | |
166 registerResizeHandler(testEl.$.shadow1d.$.resizable); | |
167 testEl.$.child1a.remove(); | |
168 testEl.$.shadow1c.remove(); | |
169 setTimeout(function() { | |
170 testEl.$.parent.notifyResize(); | |
171 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
172 unregisterResizeHandlers(); | |
173 done(); | |
174 }); | |
175 }); | |
176 | |
177 test('detach parent then notify window', function(done) { | |
178 registerResizeHandler(testEl.$.parent, false); | |
179 registerResizeHandler(testEl.$.child1a, false); | |
180 registerResizeHandler(testEl.$.child1b, false); | |
181 registerResizeHandler(testEl.$.shadow1c.$.resizable, false); | |
182 registerResizeHandler(testEl.$.shadow1d.$.resizable, false); | |
183 testEl.$.parent.remove(); | |
184 setTimeout(function() { | |
185 window.dispatchEvent(new CustomEvent('resize', { bubbles: false })); | |
186 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
187 unregisterResizeHandlers(); | |
188 done(); | |
189 }); | |
190 }); | |
191 | |
192 }); | |
193 | |
194 suite('core-resizer-parent-filtered', function() { | |
195 | |
196 test('notify resizables from window', function(done) { | |
197 registerResizeHandler(testEl.$.parentFiltered); | |
198 registerResizeHandler(testEl.$.child2a); | |
199 registerResizeHandler(testEl.$.child2b, false); | |
200 registerResizeHandler(testEl.$.shadow2c.$.resizable, false); | |
201 registerResizeHandler(testEl.$.shadow2d.$.resizable, false); | |
202 testEl.$.parentFiltered.active = testEl.$.child2a; | |
203 setTimeout(function() { | |
204 window.dispatchEvent(new CustomEvent('resize', { bubbles: false })); | |
205 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
206 unregisterResizeHandlers(); | |
207 done(); | |
208 }); | |
209 }); | |
210 | |
211 test('notify resizables from parent', function(done) { | |
212 registerResizeHandler(testEl.$.parentFiltered); | |
213 registerResizeHandler(testEl.$.child2a); | |
214 registerResizeHandler(testEl.$.child2b, false); | |
215 registerResizeHandler(testEl.$.shadow2c.$.resizable, false); | |
216 registerResizeHandler(testEl.$.shadow2d.$.resizable, false); | |
217 testEl.$.parentFiltered.active = testEl.$.child2a; | |
218 setTimeout(function() { | |
219 testEl.$.parentFiltered.notifyResize(); | |
220 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
221 unregisterResizeHandlers(); | |
222 done(); | |
223 }); | |
224 }); | |
225 | |
226 test('detach resizables then notify parent', function(done) { | |
227 registerResizeHandler(testEl.$.parentFiltered); | |
228 registerResizeHandler(testEl.$.child2a, false); | |
229 registerResizeHandler(testEl.$.child2b, false); | |
230 registerResizeHandler(testEl.$.shadow2c.$.resizable, false); | |
231 registerResizeHandler(testEl.$.shadow2d.$.resizable); | |
232 testEl.$.child2a.remove(); | |
233 testEl.$.shadow2c.remove(); | |
234 testEl.$.parentFiltered.active = testEl.$.shadow2d.$.resizable; | |
235 setTimeout(function() { | |
236 testEl.$.parentFiltered.notifyResize(); | |
237 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
238 unregisterResizeHandlers(); | |
239 done(); | |
240 }); | |
241 }); | |
242 | |
243 test('detach parent then notify window', function(done) { | |
244 registerResizeHandler(testEl.$.parentFiltered, false); | |
245 registerResizeHandler(testEl.$.child2a, false); | |
246 registerResizeHandler(testEl.$.child2b, false); | |
247 registerResizeHandler(testEl.$.shadow2c.$.resizable, false); | |
248 registerResizeHandler(testEl.$.shadow2d.$.resizable, false); | |
249 testEl.$.parentFiltered.remove(); | |
250 testEl.$.parentFiltered.active = testEl.$.shadow2d.$.resizable; | |
251 setTimeout(function() { | |
252 window.dispatchEvent(new CustomEvent('resize', { bubbles: false })); | |
253 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
254 unregisterResizeHandlers(); | |
255 done(); | |
256 }); | |
257 }); | |
258 | |
259 }); | |
260 | |
261 suite('core-resizer-peer', function() { | |
262 | |
263 test('notify resizables from window', function(done) { | |
264 registerResizeHandler(testEl.$.peer); | |
265 registerResizeHandler(testEl.$.child3a); | |
266 registerResizeHandler(testEl.$.child3b); | |
267 registerResizeHandler(testEl.$.shadow3c.$.resizable); | |
268 registerResizeHandler(testEl.$.shadow3d.$.resizable); | |
269 setTimeout(function() { | |
270 window.dispatchEvent(new CustomEvent('resize', { bubbles: false })); | |
271 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
272 unregisterResizeHandlers(); | |
273 done(); | |
274 }); | |
275 }); | |
276 | |
277 test('notify resizables from peer', function(done) { | |
278 registerResizeHandler(testEl.$.peer); | |
279 registerResizeHandler(testEl.$.child3a); | |
280 registerResizeHandler(testEl.$.child3b); | |
281 registerResizeHandler(testEl.$.shadow3c.$.resizable); | |
282 registerResizeHandler(testEl.$.shadow3d.$.resizable); | |
283 setTimeout(function() { | |
284 testEl.$.peer.notifyResize(); | |
285 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
286 unregisterResizeHandlers(); | |
287 done(); | |
288 }); | |
289 }); | |
290 | |
291 test('detach resizables then notify', function(done) { | |
292 registerResizeHandler(testEl.$.peer); | |
293 registerResizeHandler(testEl.$.child3a, false); | |
294 registerResizeHandler(testEl.$.child3b); | |
295 registerResizeHandler(testEl.$.shadow3c.$.resizable, false); | |
296 registerResizeHandler(testEl.$.shadow3d.$.resizable); | |
297 testEl.$.child3a.remove(); | |
298 testEl.$.shadow3c.remove(); | |
299 setTimeout(function() { | |
300 testEl.$.peer.notifyResize(); | |
301 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
302 unregisterResizeHandlers(); | |
303 done(); | |
304 }); | |
305 }); | |
306 | |
307 test('detach peer then notify', function(done) { | |
308 registerResizeHandler(testEl.$.peer); | |
309 registerResizeHandler(testEl.$.child3a, false); | |
310 registerResizeHandler(testEl.$.child3b); | |
311 registerResizeHandler(testEl.$.shadow3c.$.resizable, false); | |
312 registerResizeHandler(testEl.$.shadow3d.$.resizable); | |
313 testEl.$.peer.remove(); | |
314 setTimeout(function() { | |
315 testEl.$.peer.notifyResize(); | |
316 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
317 unregisterResizeHandlers(); | |
318 done(); | |
319 }); | |
320 }); | |
321 | |
322 }); | |
323 | |
324 suite('core-resizer-peer-filtered', function(done) { | |
325 | |
326 test('notify resizables from window', function(done) { | |
327 registerResizeHandler(testEl.$.peerFiltered); | |
328 registerResizeHandler(testEl.$.child4a); | |
329 registerResizeHandler(testEl.$.child4b, false); | |
330 registerResizeHandler(testEl.$.shadow4c.$.resizable, false); | |
331 registerResizeHandler(testEl.$.shadow4d.$.resizable, false); | |
332 testEl.$.peerFiltered.active = testEl.$.child4a; | |
333 setTimeout(function() { | |
334 window.dispatchEvent(new CustomEvent('resize', { bubbles: false })); | |
335 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
336 unregisterResizeHandlers(); | |
337 done(); | |
338 }); | |
339 }); | |
340 | |
341 test('notify resizables from peer', function(done) { | |
342 registerResizeHandler(testEl.$.peerFiltered); | |
343 registerResizeHandler(testEl.$.child4a); | |
344 registerResizeHandler(testEl.$.child4b, false); | |
345 registerResizeHandler(testEl.$.shadow4c.$.resizable, false); | |
346 registerResizeHandler(testEl.$.shadow4d.$.resizable, false); | |
347 testEl.$.peerFiltered.active = testEl.$.child4a; | |
348 setTimeout(function() { | |
349 testEl.$.peerFiltered.notifyResize(); | |
350 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
351 unregisterResizeHandlers(); | |
352 done(); | |
353 }); | |
354 }); | |
355 | |
356 test('detach resizables then notify parent', function(done) { | |
357 registerResizeHandler(testEl.$.peerFiltered); | |
358 registerResizeHandler(testEl.$.child4a, false); | |
359 registerResizeHandler(testEl.$.child4b, false); | |
360 registerResizeHandler(testEl.$.shadow4c.$.resizable, false); | |
361 registerResizeHandler(testEl.$.shadow4d.$.resizable); | |
362 testEl.$.child4a.remove(); | |
363 testEl.$.shadow4c.remove(); | |
364 testEl.$.peerFiltered.active = testEl.$.shadow4d.$.resizable; | |
365 setTimeout(function() { | |
366 testEl.$.peerFiltered.notifyResize(); | |
367 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
368 unregisterResizeHandlers(); | |
369 done(); | |
370 }); | |
371 }); | |
372 | |
373 test('detach peer then notify window', function(done) { | |
374 registerResizeHandler(testEl.$.peerFiltered, false); | |
375 registerResizeHandler(testEl.$.child4a, false); | |
376 registerResizeHandler(testEl.$.child4b, false); | |
377 registerResizeHandler(testEl.$.shadow4c.$.resizable, false); | |
378 registerResizeHandler(testEl.$.shadow4d.$.resizable, false); | |
379 testEl.$.peerFiltered.remove(); | |
380 testEl.$.peerFiltered.active = testEl.$.shadow4d.$.resizable; | |
381 setTimeout(function() { | |
382 window.dispatchEvent(new CustomEvent('resize', { bubbles: false })); | |
383 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
384 unregisterResizeHandlers(); | |
385 done(); | |
386 }); | |
387 }); | |
388 | |
389 }); | |
390 | |
391 suite('core-resizer-nested', function() { | |
392 | |
393 test('notify resizables from window', function(done) { | |
394 registerResizeHandler(testEl.$.parentTop); | |
395 registerResizeHandler(testEl.$.parentNested); | |
396 registerResizeHandler(testEl.$.peerNested); | |
397 registerResizeHandler(testEl.$.child5a); | |
398 registerResizeHandler(testEl.$.shadow5b.$.resizable); | |
399 setTimeout(function() { | |
400 window.dispatchEvent(new CustomEvent('resize', { bubbles: false })); | |
401 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
402 unregisterResizeHandlers(); | |
403 done(); | |
404 }); | |
405 }); | |
406 | |
407 test('notify resizables from top parent', function(done) { | |
408 registerResizeHandler(testEl.$.parentTop); | |
409 registerResizeHandler(testEl.$.parentNested); | |
410 registerResizeHandler(testEl.$.peerNested); | |
411 registerResizeHandler(testEl.$.child5a); | |
412 registerResizeHandler(testEl.$.shadow5b.$.resizable); | |
413 setTimeout(function() { | |
414 testEl.$.parentTop.notifyResize(); | |
415 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
416 unregisterResizeHandlers(); | |
417 done(); | |
418 }); | |
419 }); | |
420 | |
421 test('notify resizables from nested parent', function(done) { | |
422 registerResizeHandler(testEl.$.parentTop, false); | |
423 registerResizeHandler(testEl.$.parentNested); | |
424 registerResizeHandler(testEl.$.peerNested); | |
425 registerResizeHandler(testEl.$.child5a); | |
426 registerResizeHandler(testEl.$.shadow5b.$.resizable); | |
427 setTimeout(function() { | |
428 testEl.$.parentNested.notifyResize(); | |
429 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
430 unregisterResizeHandlers(); | |
431 done(); | |
432 }); | |
433 }); | |
434 | |
435 test('notify resizables from nested peer', function(done) { | |
436 registerResizeHandler(testEl.$.parentTop, false); | |
437 registerResizeHandler(testEl.$.parentNested, false); | |
438 registerResizeHandler(testEl.$.peerNested); | |
439 registerResizeHandler(testEl.$.child5a); | |
440 registerResizeHandler(testEl.$.shadow5b.$.resizable); | |
441 setTimeout(function() { | |
442 testEl.$.peerNested.notifyResize(); | |
443 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
444 unregisterResizeHandlers(); | |
445 done(); | |
446 }); | |
447 }); | |
448 | |
449 // Known limitation: peers of detached `resizerIsPeer` won't be notified | |
450 // by parent resizers; ROI on that bookkeeping not considered high enough | |
451 test('detach peer then notify', function(done) { | |
452 registerResizeHandler(testEl.$.parentTop); | |
453 registerResizeHandler(testEl.$.parentNested); | |
454 registerResizeHandler(testEl.$.peerNested, false); | |
455 registerResizeHandler(testEl.$.child5a, false); | |
456 registerResizeHandler(testEl.$.shadow5b.$.resizable, false); | |
457 testEl.$.peerNested.remove(); | |
458 setTimeout(function() { | |
459 window.dispatchEvent(new CustomEvent('resize', { bubbles: false })); | |
460 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
461 unregisterResizeHandlers(); | |
462 done(); | |
463 }); | |
464 }); | |
465 | |
466 test('detach resizables then notify', function(done) { | |
467 registerResizeHandler(testEl.$.parentTop); | |
468 registerResizeHandler(testEl.$.parentNested); | |
469 registerResizeHandler(testEl.$.peerNested, false); // removed in above t
est | |
470 registerResizeHandler(testEl.$.child5a, false); | |
471 registerResizeHandler(testEl.$.shadow5b.$.resizable, false); | |
472 testEl.$.child5a.remove(); | |
473 testEl.$.shadow5b.remove(); | |
474 setTimeout(function() { | |
475 window.dispatchEvent(new CustomEvent('resize', { bubbles: false })); | |
476 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
477 unregisterResizeHandlers(); | |
478 done(); | |
479 }); | |
480 }); | |
481 | |
482 test('detach top parent then notify', function(done) { | |
483 registerResizeHandler(testEl.$.parentTop, false); | |
484 registerResizeHandler(testEl.$.parentNested, false); | |
485 registerResizeHandler(testEl.$.peerNested, false); | |
486 registerResizeHandler(testEl.$.child5a, false); | |
487 registerResizeHandler(testEl.$.shadow5b.$.resizable, false); | |
488 testEl.$.parentTop.remove(); | |
489 setTimeout(function() { | |
490 window.dispatchEvent(new CustomEvent('resize', { bubbles: false })); | |
491 assert(notifyPending.length === 0, 'all resizables were not notified')
; | |
492 unregisterResizeHandlers(); | |
493 done(); | |
494 }); | |
495 }); | |
496 | |
497 }); | |
498 | |
499 }); | |
500 | |
501 </script> | |
502 | |
503 </body> | |
504 </html> | |
OLD | NEW |