OLD | NEW |
1 <html> | 1 <html> |
2 <head> | 2 <head> |
3 <style type="text/css" media="screen"> | 3 <style type="text/css" media="screen"> |
4 body { | 4 body { |
5 margin: 0; | 5 margin: 0; |
6 } | 6 } |
7 | 7 |
8 #box { | 8 #box { |
9 position: absolute; | 9 position: absolute; |
10 left: 0px; | 10 left: 0px; |
11 top: 100px; | 11 top: 100px; |
12 height: 100px; | 12 height: 100px; |
13 width: 100px; | 13 width: 100px; |
14 margin: 0; | 14 margin: 0; |
15 background-color: green; | 15 background-color: green; |
16 -webkit-transform: translate(-2000px, 0px); | 16 -webkit-transform: translate(-2000px, 0px); |
17 -webkit-animation-duration: 1s; | 17 -webkit-animation-duration: 1s; |
18 -webkit-animation-direction: normal; | 18 -webkit-animation-direction: normal; |
19 -webkit-animation-timing-function: linear; | 19 -webkit-animation-timing-function: linear; |
20 -webkit-animation-name: "anim"; | 20 -webkit-animation-name: "anim"; |
21 } | 21 } |
22 @-webkit-keyframes "anim" { | 22 @-webkit-keyframes "anim" { |
23 0% { -webkit-transform: translate(100px, 0px); } | 23 0% { -webkit-transform: translate(100px, 0px); } |
24 100% { -webkit-transform: translate(100px, 0px); } | 24 100% { -webkit-transform: translate(100px, 0px); } |
25 } | 25 } |
26 </style> | 26 </style> |
27 <script src="resources/animation-test-helpers.js" type="text/javascript"></scr
ipt> | 27 <script src="resources/animation-test-helpers.js" type="text/javascript"></scr
ipt> |
28 <script type="text/javascript" charset="utf-8"> | 28 <script type="text/javascript" charset="utf-8"> |
29 if (window.testRunner) { | 29 if (window.testRunner) { |
30 window.testRunner.dumpAsText(true); | 30 window.testRunner.dumpAsTextWithPixelResults(); |
31 } | 31 } |
32 | 32 |
33 const expectedValues = [ | 33 const expectedValues = [ |
34 // [time, element-id, property, expected-value, tolerance] | 34 // [time, element-id, property, expected-value, tolerance] |
35 ["anim", 0.5, "box", "webkitTransform", [1, 0, 0, 1, 100, 0], 0.002], | 35 ["anim", 0.5, "box", "webkitTransform", [1, 0, 0, 1, 100, 0], 0.002], |
36 ]; | 36 ]; |
37 | 37 |
38 const doPixelTest = true; | 38 const doPixelTest = true; |
39 const disablePauseAnimationAPI = false; | 39 const disablePauseAnimationAPI = false; |
40 runAnimationTest(expectedValues, null, null, disablePauseAnimationAPI, doPix
elTest); | 40 runAnimationTest(expectedValues, null, null, disablePauseAnimationAPI, doPix
elTest); |
41 </script> | 41 </script> |
42 </head> | 42 </head> |
43 <body> | 43 <body> |
44 <div id="box"></div> | 44 <div id="box"></div> |
45 <div id="result"></div> | 45 <div id="result"></div> |
46 </body> | 46 </body> |
47 </html> | 47 </html> |
OLD | NEW |