fune/layout/reftests/css-animations/stop-animation-on-discarded-pseudo-element.html
Hiroyuki Ikezoe 5f3681aa92 Bug 1380258 - A reftest for stopping CSS animations on discarded pseudo elements. r=birtles
This reftest fails without the first patch on stylo.

MozReview-Commit-ID: E5pBzBw9x8B

--HG--
extra : rebase_source : 4fe2a99bfed76d1b5fb320ef6a4f2b39ee5f5f2c
2017-07-24 09:20:22 +09:00

36 lines
794 B
HTML

<!DOCTYPE html>
<html class="reftest-wait">
<style>
@keyframes anim {
0% { background-color: red; }
100% { background-color: red; }
}
#target.x::before,
#target.y::before {
content: "";
position: absolute;
width: 100px;
height: 100px;
}
#target.x::before {
animation: anim 100s infinite;
}
</style>
<div id="target"></div>
<script>
var target = document.getElementById('target');
requestAnimationFrame(() => {
// Create ::before, start animation
target.className = 'x';
requestAnimationFrame(() => {
// Remove ::before, stop animation
target.className = '';
requestAnimationFrame(() => {
// Create ::before, should not be animating
target.className = 'y';
document.documentElement.classList.remove('reftest-wait');
});
});
});
</script>