blob: f02449e77180cf71ce93b885796003560abe6e3e [file] [log] [blame]
<!doctype html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<style>
.start {
animation: anim 1ms;
}
@keyframes anim {
0% {
transform: translate3d(0, 0, 1px);
}
100% {
transform: translate3d(0, 0, 0);
}
}
</style>
<body>x
<script>
'use strict';
async_test(function(t) {
requestAnimationFrame(function() {
document.body.classList.add('start');
// Force a style resolve, to ensure the animation is created.
document.body.offsetTop;
var animation = document.body.getAnimations()[0];
setTimeout(function() {
if (animation.playState === 'pending') {
var passed = false;
document.body.addEventListener('animationstart', function() {
passed = true;
});
document.body.addEventListener('animationend', function() {
t.step(function() {
assert_true(passed);
t.done();
});
});
} else {
// The animation is no longer pending.
// We missed the opportunity to add a start event listener
// before the animation started. This test might flakily
// pass even if the implementation is incorrect.
t.done();
}
}, 0);
});
});
</script>