Use testRunner instead of layoutTestController in animations tests
[WebKit-https.git] / LayoutTests / animations / combo-transform-translate+scale.html
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
2    "http://www.w3.org/TR/html4/loose.dtd">
3
4 <html lang="en">
5 <head>
6   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
7   <title>Combined transform translate() scale()</title>
8   <style type="text/css" media="screen">
9     #box {
10       height: 100px;
11       width: 100px;
12       background-color: blue;
13       -webkit-animation-duration: 1s;
14       -webkit-animation-timing-function: linear;
15       -webkit-animation-name: "anim";
16     }
17     @-webkit-keyframes "anim" {
18         from { -webkit-transform: translate(0,0) scale(1,1); }
19         to   { -webkit-transform: translate(100px, 200px) scale(2,4); }
20     }
21   </style>
22   <script type="text/javascript" charset="utf-8">
23     if (window.testRunner) {
24       testRunner.dumpAsText();
25       testRunner.waitUntilDone();
26     }
27     
28     result = "";
29
30     const expected =  [ [ 1.25,0,0,1.75,25,50 ],
31                         [ 1.5,0,0,2.5,50,100 ] ];
32     const tolerance = [ 0.2,0.2,0.2,0.3,8,15 ];
33     const prop = [ "a", "b", "c", "d", "e", "f" ];
34     
35     function isEqual(actual, desired, tolerance)
36     {
37         var diff = Math.abs(actual - desired);
38         return diff <= tolerance;
39     }
40     
41     var numSnapshots = 0;
42     
43     function snapshot(which)
44     {
45         var t = new WebKitCSSMatrix(window.getComputedStyle(document.getElementById('box')).webkitTransform);
46         for (i = 0; i < 6; ++i) {
47             if (!isEqual(t[prop[i]], expected[which][i], tolerance[i]))
48                 result += "FAIL('"+prop[i]+"' was:"+t[prop[i]]+", expected:"+expected[which][i]+")";
49         }
50         
51         numSnapshots++;
52         if (numSnapshots == 2) {
53             document.getElementById('result').innerHTML = result || "PASS";
54             if (window.testRunner)
55                 testRunner.notifyDone();
56         }
57     }
58
59     function start()
60     {
61         setTimeout("snapshot(0)", 250);
62         setTimeout("snapshot(1)", 500);
63     }
64     
65     document.addEventListener('webkitAnimationStart', start, false);
66     
67   </script>
68 </head>
69 <body>
70 This test performs an animation of the translate() and scale() operators. It animates over 1 seconds. 
71 At 0.25 and 0.5 seconds it takes a snapshot and expects the result to be within range.
72 <div id="box">
73 </div>
74 <div id="result">
75 </div>
76 </body>
77 </html>