REGRESSION (r230574): Interrupted hardware transitions don't behave correctly
[WebKit-https.git] / LayoutTests / transitions / retargetted-transition.html
1 <!DOCTYPE html>
2
3 <html>
4 <head>
5   <style>
6     #box {
7       height: 100px;
8       width: 100px;
9       background-color: blue;
10       -webkit-transition-duration: 2s;
11       -webkit-transform: translate(0, 0);
12     }
13     
14   </style>
15   <script>
16     if (window.testRunner) {
17       testRunner.dumpAsText();
18       testRunner.waitUntilDone();
19     }
20
21     function test()
22     {
23       var c = new WebKitCSSMatrix(window.getComputedStyle(document.getElementById('box')).webkitTransform);
24       var result = (c.f < 200) ? 'PASS' : 'FAIL: transition should still be running, so y < 200';
25       document.getElementById('result').innerHTML = result;
26
27       if (window.testRunner)
28           testRunner.notifyDone();
29     }
30     
31     function startTest()
32     {
33       var box = document.getElementById('box');
34       box.style.webkitTransform = 'translate(100px, 0)';
35       
36       window.setTimeout(function() {
37         box.style.webkitTransform = 'translate(0, 200px)';
38         window.setTimeout(function() {
39           test();
40         }, 200);
41       }, 300);
42     }
43     window.addEventListener('load', startTest, false)
44   </script>
45 </head>
46 <body>
47 <p>Box should start moving right, then move down</p>
48 <div id="box">
49 </div>
50
51 <div id="result">
52 </div>
53 </body>
54 </html>