OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 | 2 |
3 <html lang="en"> | 3 <html lang="en"> |
4 <head> | 4 <head> |
5 <title>Test simple animation with fill modes and non integer iteration count</
title> | 5 <title>Test simple animation with fill modes and non integer iteration count</
title> |
6 <style type="text/css" media="screen"> | 6 <style type="text/css" media="screen"> |
7 .box { | 7 .box { |
8 position: relative; | 8 position: relative; |
9 left: 100px; | 9 left: 100px; |
10 height: 100px; | 10 height: 100px; |
(...skipping 72 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
83 result += 'PASS: ' + identifier + ': Saw something close to ' + expe
cted + '<br>'; | 83 result += 'PASS: ' + identifier + ': Saw something close to ' + expe
cted + '<br>'; |
84 } else { | 84 } else { |
85 result += 'FAIL: ' + identifier + ': Expected ' + expected + ' but s
aw ' + actual + '<br>'; | 85 result += 'FAIL: ' + identifier + ': Expected ' + expected + ' but s
aw ' + actual + '<br>'; |
86 } | 86 } |
87 } | 87 } |
88 | 88 |
89 function endTest() { | 89 function endTest() { |
90 for (var i=0; i < expectedValues.length; i++) { | 90 for (var i=0; i < expectedValues.length; i++) { |
91 var el = document.getElementById(expectedValues[i].id); | 91 var el = document.getElementById(expectedValues[i].id); |
92 var expectedValue = expectedValues[i].end; | 92 var expectedValue = expectedValues[i].end; |
93 var realValue = window.getComputedStyle(el).getPropertyCSSValue("lef
t").getFloatValue(CSSPrimitiveValue.CSS_NUMBER); | 93 var realValue = parseFloat(window.getComputedStyle(el).left); |
94 log(expectedValue, realValue, false, expectedValues[i].id); | 94 log(expectedValue, realValue, false, expectedValues[i].id); |
95 } | 95 } |
96 document.getElementById('result').innerHTML = result; | 96 document.getElementById('result').innerHTML = result; |
97 | 97 |
98 if (window.testRunner) | 98 if (window.testRunner) |
99 testRunner.notifyDone(); | 99 testRunner.notifyDone(); |
100 } | 100 } |
101 | 101 |
102 window.onload = function () { | 102 window.onload = function () { |
103 for (var i=0; i < expectedValues.length; i++) { | 103 for (var i=0; i < expectedValues.length; i++) { |
104 var el = document.getElementById(expectedValues[i].id); | 104 var el = document.getElementById(expectedValues[i].id); |
105 var expectedValue = expectedValues[i].start; | 105 var expectedValue = expectedValues[i].start; |
106 var realValue = window.getComputedStyle(el).getPropertyCSSValue("lef
t").getFloatValue(CSSPrimitiveValue.CSS_NUMBER); | 106 var realValue = parseFloat(window.getComputedStyle(el).left); |
107 log(expectedValue, realValue, true, expectedValues[i].id); | 107 log(expectedValue, realValue, true, expectedValues[i].id); |
108 } | 108 } |
109 document.addEventListener("webkitAnimationEnd", animationEnded, false); | 109 document.addEventListener("webkitAnimationEnd", animationEnded, false); |
110 }; | 110 }; |
111 </script> | 111 </script> |
112 </head> | 112 </head> |
113 <body> | 113 <body> |
114 <div> | 114 <div> |
115 This test performs an animation of the left property with four different | 115 This test performs an animation of the left property with four different |
116 fill modes. It animates over 0.1 seconds with a 0.1 second delay. It takes | 116 fill modes. It animates over 0.1 seconds with a 0.1 second delay. It takes |
(...skipping 14 matching lines...) Expand all Loading... |
131 <div id="both_iterating" class="box"> | 131 <div id="both_iterating" class="box"> |
132 Both iterating | 132 Both iterating |
133 </div> | 133 </div> |
134 <div id="both_iterating_reverse" class="box"> | 134 <div id="both_iterating_reverse" class="box"> |
135 Both iterating reverse | 135 Both iterating reverse |
136 </div> | 136 </div> |
137 <div id="result"> | 137 <div id="result"> |
138 </div> | 138 </div> |
139 </body> | 139 </body> |
140 </html> | 140 </html> |
OLD | NEW |