blob: 2c8e0326a7800bd8f2c45a20206d294d7a02e059 [file] [log] [blame]
<style>
#box {
position: relative;
height: 100px;
width: 100px;
background-color: blue;
animation-name: move;
animation-duration: 0.2s;
animation-iteration-count: infinite;
animation-timing-function: linear;
animation-delay: -999999s;
}
@keyframes move {
0% { left: 0; }
100% { left: 300px; }
}
</style>
<script>
if (window.testRunner) {
testRunner.waitUntilDone();
testRunner.dumpAsText();
}
function output(msg) {
document.getElementById('result').innerHTML += `${msg}<br>`;
}
function iterated(event) {
output("PASS: Saw iteration event. The animation did start.");
if (event.elapsedTime > 1000)
output("PASS: Elapsed time is large. The animation thinks it started a long time ago.");
else
output("FAIL: Elapsed time wasn't big enough.");
if (window.testRunner)
testRunner.notifyDone();
}
window.addEventListener("animationiteration", iterated, { once: true });
</script>
<div id="box"></div>
<div id="result"></div>