OLD | NEW |
| (Empty) |
1 <!DOCTYPE html> | |
2 <script> | |
3 if (window.testRunner) | |
4 testRunner.waitUntilDone(); | |
5 onload = function() { | |
6 var animated = document.getElementById('animated'); | |
7 animated.addEventListener('transitionend', function() { | |
8 if (window.testRunner) | |
9 testRunner.notifyDone(); | |
10 }); | |
11 animated.style.opacity = 1; | |
12 } | |
13 </script> | |
14 <style> | |
15 #background, #foreground { | |
16 position: absolute; | |
17 top: 0; | |
18 left: 0; | |
19 width: 200px; | |
20 height: 200px; | |
21 } | |
22 #background { | |
23 background-color: red; | |
24 } | |
25 #animated { | |
26 -webkit-transition: opacity 0.2s; | |
27 opacity: 0.1; | |
28 } | |
29 #foreground { | |
30 background-color: green; | |
31 } | |
32 body { | |
33 margin: 0; | |
34 } | |
35 #description { | |
36 position: absolute; | |
37 top: 300px; | |
38 } | |
39 </style> | |
40 <div id="background"></div> | |
41 <div id="animated"><div id="foreground"></div></div> | |
42 <div id="description"> | |
43 Tests paint invalidation on end of opacity transition.<br> | |
44 Passes if there is a green square and no red.<br> | |
45 </div> | |
OLD | NEW |