| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <head> | 3 <head> |
| 4 <title>Shorthand animation name ordering test</title> | 4 <title>Shorthand animation name ordering test</title> |
| 5 <style> | 5 <style> |
| 6 #box { | 6 #box { |
| 7 position: relative; | 7 position: relative; |
| 8 height: 100px; | 8 height: 100px; |
| 9 width: 100px; | 9 width: 100px; |
| 10 background-color: red; | 10 background-color: red; |
| (...skipping 84 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 95 element.style[PROPERTIES_TO_TEST[i]] = DEFAULT_VALUES[i]; | 95 element.style[PROPERTIES_TO_TEST[i]] = DEFAULT_VALUES[i]; |
| 96 } | 96 } |
| 97 | 97 |
| 98 function runIndividualTest(testIndex) { | 98 function runIndividualTest(testIndex) { |
| 99 var result = document.getElementById("result"); | 99 var result = document.getElementById("result"); |
| 100 var element = document.getElementById("box"); | 100 var element = document.getElementById("box"); |
| 101 | 101 |
| 102 clearElementAnimationStyle(element); | 102 clearElementAnimationStyle(element); |
| 103 | 103 |
| 104 // Unfortunately need to force a style recalculation before testing. | 104 // Unfortunately need to force a style recalculation before testing. |
| 105 setTimeout(function () { | 105 requestAnimationFrame(function () { |
| 106 element.style.webkitAnimation = TEST_INPUTS[testIndex]; | 106 element.style.webkitAnimation = TEST_INPUTS[testIndex]; |
| 107 | 107 |
| 108 // And another forced style recalculation. | 108 // And another forced style recalculation. |
| 109 setTimeout(function() { | 109 requestAnimationFrame(function() { |
| 110 var computedStyle = window.getComputedStyle(element); | 110 var computedStyle = window.getComputedStyle(element); |
| 111 | 111 |
| 112 for (var i=0; i < PROPERTIES_TO_TEST.length; i++) { | 112 for (var i=0; i < PROPERTIES_TO_TEST.length; i++) { |
| 113 var value = computedStyle[PROPERTIES_TO_TEST[i]]; | 113 var value = computedStyle[PROPERTIES_TO_TEST[i]]; |
| 114 if (value == EXPECTED_VALUES[testIndex][i]) | 114 if (value == EXPECTED_VALUES[testIndex][i]) |
| 115 result.innerHTML += "PASS Test " + (numTestsComplete + 1) +
": " + PROPERTIES_TO_TEST[i] + " was " + value + "<br>"; | 115 result.innerHTML += "PASS Test " + (numTestsComplete + 1) +
": " + PROPERTIES_TO_TEST[i] + " was " + value + "<br>"; |
| 116 else | 116 else |
| 117 result.innerHTML += "FAIL Test " + (numTestsComplete + 1) +
": " + PROPERTIES_TO_TEST[i] + " was " + value + " should be " + EXPECTED_VALUES
[testIndex][i] + "<br>"; | 117 result.innerHTML += "FAIL Test " + (numTestsComplete + 1) +
": " + PROPERTIES_TO_TEST[i] + " was " + value + " should be " + EXPECTED_VALUES
[testIndex][i] + "<br>"; |
| 118 } | 118 } |
| 119 | 119 |
| 120 numTestsComplete++; | 120 numTestsComplete++; |
| 121 if (numTestsComplete < TEST_INPUTS.length) | 121 if (numTestsComplete < TEST_INPUTS.length) |
| 122 runIndividualTest(numTestsComplete); | 122 runIndividualTest(numTestsComplete); |
| 123 else { | 123 else { |
| 124 if (window.testRunner) | 124 if (window.testRunner) |
| 125 testRunner.notifyDone(); | 125 testRunner.notifyDone(); |
| 126 } | 126 } |
| 127 }, 0); | 127 }); |
| 128 }, 0); | 128 }); |
| 129 } | 129 } |
| 130 | 130 |
| 131 if (window.testRunner) { | 131 if (window.testRunner) { |
| 132 testRunner.dumpAsText(); | 132 testRunner.dumpAsText(); |
| 133 testRunner.waitUntilDone(); | 133 testRunner.waitUntilDone(); |
| 134 } | 134 } |
| 135 | 135 |
| 136 window.addEventListener("load", runTests, false); | 136 window.addEventListener("load", runTests, false); |
| 137 </script> | 137 </script> |
| 138 </head> | 138 </head> |
| 139 <body> | 139 <body> |
| 140 <div id="box"></div> | 140 <div id="box"></div> |
| 141 <div id="result"></div> | 141 <div id="result"></div> |
| 142 </body> | 142 </body> |
| 143 </html> | 143 </html> |
| OLD | NEW |