| <!DOCTYPE html> |
| <style> |
| #container { |
| position: absolute; |
| top: 0; |
| font-size: 10px; |
| } |
| .target { |
| width: 40px; |
| height: 40px; |
| border-top: solid; |
| border-left: solid; |
| margin-bottom: 20px; |
| } |
| </style> |
| <div id="container"></div> |
| <div id="footer"></div> |
| <script> |
| 'use strict'; |
| [ |
| '10px 10px 10px', |
| 'none', // Composited animations fail to zoom the last expectation correctly. ): |
| ].forEach(translation => { |
| var text = document.createElement('div'); |
| text.textContent = translation; |
| container.appendChild(text); |
| |
| var target = document.createElement('div'); |
| target.classList.add('target'); |
| container.appendChild(target); |
| target.animate([ |
| {translate: translation}, |
| {translate: translation}, |
| ], 1e8); |
| }); |
| |
| if (window.testRunner) |
| testRunner.waitUntilDone(); |
| |
| function waitForCompositor() { |
| return footer.animate({opacity: ['1', '1']}, 1).finished; |
| } |
| |
| requestAnimationFrame(() => { |
| requestAnimationFrame(() => { |
| internals.setZoomFactor(2); |
| requestAnimationFrame(() => { |
| requestAnimationFrame(() => { |
| waitForCompositor().then(() => { |
| if (window.testRunner) |
| testRunner.notifyDone(); |
| }); |
| }); |
| }); |
| }); |
| }); |
| </script> |
