OLD | NEW |
| (Empty) |
1 <!DOCTYPE html> | |
2 <meta charset="utf-8"> | |
3 <style> | |
4 div { | |
5 position: absolute; | |
6 width: 100px; | |
7 height: 100px; | |
8 } | |
9 #target { | |
10 background: red; | |
11 transform: translateX(100px); | |
12 animation: test 1e8s; | |
13 } | |
14 #expected { | |
15 background: green; | |
16 transform: translateX(50px); | |
17 } | |
18 @keyframes test { | |
19 to { transform: translateX(50px); } | |
20 } | |
21 </style> | |
22 <div id="target"></div> | |
23 <div id="expected"></div> | |
24 <script> | |
25 'use strict'; | |
26 if (window.testRunner) | |
27 testRunner.waitUntilDone(); | |
28 | |
29 function waitForCompositor() { | |
30 return target.animate({opacity: ['1', '1']}, 1).ready; | |
31 } | |
32 | |
33 waitForCompositor().then(() => { | |
34 target.style.transform = 'translateX(50px)'; | |
35 }).then(waitForCompositor).then(() => { | |
36 if (window.testRunner) | |
37 testRunner.notifyDone(); | |
38 }); | |
39 </script> | |
OLD | NEW |