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 |