| OLD | NEW |
|---|
| (Empty) |
| 1 <!DOCTYPE html> | |
| 2 <style> | |
| 3 #container { | |
| 4 position: absolute; | |
| 5 top: 0; | |
| 6 font-size: 10px; | |
| 7 } | |
| 8 .target { | |
| 9 width: 40px; | |
| 10 height: 40px; | |
| 11 border-top: solid; | |
| 12 border-left: solid; | |
| 13 margin-bottom: 20px; | |
| 14 } | |
| 15 </style> | |
| 16 <div id="container"></div> | |
| 17 <div id="footer"></div> | |
| 18 <script> | |
| 19 'use strict'; | |
| 20 [ | |
| 21 'perspective(200px) translate3D(10px, 10px, 10px)', | |
| 22 'matrix(0, 1, 1, 0, 10, 10)', | |
| 23 'matrix3d(' + | |
| 24 '0, 1, 0, 0, ' + | |
| 25 '1, 0, 0, 0, ' + | |
| 26 '0, 0, 1, 0, ' + | |
| 27 '10, 10, 10, 1)', | |
| 28 'matrix3d(' + | |
| 29 '0.707106781186548, 0.000000000000000, -0.707106781186547, 0.003535533905933
,' + | |
| 30 '0.000000000000000, 1.000000000000000, 0.000000000000000, 0.000000000000000,
' + | |
| 31 '0.707106781186547, 0.000000000000000, 0.707106781186548, -0.003535533905933
,' + | |
| 32 '0.000000000000000, 0.000000000000000, 0.000000000000000, 1.000000000000000)
', | |
| 33 'perspective(200px) rotateY(45deg)', | |
| 34 'none', | |
| 35 ].forEach(transform => { | |
| 36 var text = document.createElement('div'); | |
| 37 text.textContent = transform; | |
| 38 container.appendChild(text); | |
| 39 | |
| 40 var target = document.createElement('div'); | |
| 41 target.classList.add('target'); | |
| 42 container.appendChild(target); | |
| 43 target.animate([ | |
| 44 {transform: transform}, | |
| 45 {transform: transform}, | |
| 46 ], 1e8); | |
| 47 }); | |
| 48 | |
| 49 if (window.testRunner) | |
| 50 testRunner.waitUntilDone(); | |
| 51 | |
| 52 function waitForCompositor() { | |
| 53 return footer.animate({opacity: ['1', '1']}, 1).ready; | |
| 54 } | |
| 55 | |
| 56 requestAnimationFrame(() => { | |
| 57 requestAnimationFrame(() => { | |
| 58 internals.setZoomFactor(2); | |
| 59 requestAnimationFrame(() => { | |
| 60 waitForCompositor().then(() => { | |
| 61 if (window.testRunner) | |
| 62 testRunner.notifyDone(); | |
| 63 }); | |
| 64 }); | |
| 65 }); | |
| 66 }); | |
| 67 </script> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2973013002:
Group all responsive animation tests together (Closed)
