| OLD | NEW |
|---|
| 1 <html> | 1 <html> |
| 2 <head> | 2 <head> |
| 3 <style> | 3 <style> |
| 4 .box { | 4 .box { |
| 5 height: 100px; | 5 height: 100px; |
| 6 width: 100px; | 6 width: 100px; |
| 7 margin: 10px; | 7 margin: 10px; |
| 8 background-color: blue; | 8 background-color: blue; |
| 9 -webkit-transition-property: -webkit-transform; | 9 transition-property: transform; |
| 10 -webkit-transition-duration: 0.2s; | 10 transition-duration: 0.2s; |
| 11 } | 11 } |
| 12 </style> | 12 </style> |
| 13 <script> | 13 <script> |
| 14 if (window.testRunner) { | 14 if (window.testRunner) { |
| 15 testRunner.dumpAsText(); | 15 testRunner.dumpAsText(); |
| 16 testRunner.waitUntilDone(); | 16 testRunner.waitUntilDone(); |
| 17 } | 17 } |
| 18 | 18 |
| 19 var numDone = 0; | 19 var numDone = 0; |
| 20 function transitionEnded() | 20 function transitionEnded() |
| 21 { | 21 { |
| 22 ++numDone; | 22 ++numDone; |
| 23 if (numDone == 2) { | 23 if (numDone == 2) { |
| 24 if (window.GCController) | 24 if (window.GCController) |
| 25 GCController.collect(); | 25 GCController.collect(); |
| 26 | 26 |
| 27 document.getElementById('results').innerHTML = 'Did not crash, so PASSED
'; | 27 document.getElementById('results').innerHTML = 'Did not crash, so PASSED
'; |
| 28 | 28 |
| 29 if (window.testRunner) | 29 if (window.testRunner) |
| 30 testRunner.notifyDone(); | 30 testRunner.notifyDone(); |
| 31 } | 31 } |
| 32 } | 32 } |
| 33 | 33 |
| 34 function startTest() | 34 function startTest() |
| 35 { | 35 { |
| 36 var box1 = document.getElementById('box1'); | 36 var box1 = document.getElementById('box1'); |
| 37 box1.addEventListener('webkitTransitionEnd', function() { | 37 box1.addEventListener('transitionend', function() { |
| 38 box1.parentNode.removeChild(box1); | 38 box1.parentNode.removeChild(box1); |
| 39 transitionEnded(); | 39 transitionEnded(); |
| 40 }, false); | 40 }, false); |
| 41 box1.style.webkitTransform = 'translate(100px, 0)'; | 41 box1.style.transform = 'translate(100px, 0)'; |
| 42 | 42 |
| 43 var box2 = document.getElementById('box2'); | 43 var box2 = document.getElementById('box2'); |
| 44 box2.addEventListener('webkitTransitionEnd', function() { | 44 box2.addEventListener('transitionend', function() { |
| 45 box2.style.display = 'none'; | 45 box2.style.display = 'none'; |
| 46 transitionEnded(); | 46 transitionEnded(); |
| 47 }, false); | 47 }, false); |
| 48 box2.style.webkitTransform = 'translate(100px, 0)'; | 48 box2.style.transform = 'translate(100px, 0)'; |
| 49 } | 49 } |
| 50 | 50 |
| 51 window.addEventListener('load', startTest, false); | 51 window.addEventListener('load', startTest, false); |
| 52 </script> | 52 </script> |
| 53 </head> | 53 </head> |
| 54 <body> | 54 <body> |
| 55 | 55 |
| 56 <p>Tests element removal and hiding in webkitTransitionEnd event handler. Should
not crash.</p> | 56 <p>Tests element removal and hiding in transitionend event handler. Should not c
rash.</p> |
| 57 | 57 |
| 58 <div id="container"> | 58 <div id="container"> |
| 59 <div id="box1" class="box"></div> | 59 <div id="box1" class="box"></div> |
| 60 <div id="box2" class="box"></div> | 60 <div id="box2" class="box"></div> |
| 61 </div> | 61 </div> |
| 62 <div id="results"></div> | 62 <div id="results"></div> |
| 63 </body> | 63 </body> |
| 64 </html> | 64 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2521493002:
CSS Transitions: Reduce usage of -webkit prefix in layout tests (Closed)
