37 lines
1.3 KiB
HTML
37 lines
1.3 KiB
HTML
<!DOCTYPE html>
|
|
<html class="reftest-wait">
|
|
<head>
|
|
<title>Test dynamically-appended animation in a subtree that dynamically became 'display:none'</title>
|
|
</head>
|
|
<body style="background-color: lime;">
|
|
<div id="target" style="display: none;">
|
|
<svg>
|
|
<rect width="100" height="100" fill="brown" id="rect">
|
|
</rect>
|
|
</svg>
|
|
</div>
|
|
<script>
|
|
document.addEventListener('MozReftestInvalidate', function() {
|
|
var svg = document.getElementsByTagName("svg")[0];
|
|
svg.pauseAnimations(); // pause svg animation.
|
|
|
|
var target = document.getElementById("target");
|
|
var rect = document.getElementById("rect");
|
|
var animate = document.createElementNS('http://www.w3.org/2000/svg',
|
|
'animate');
|
|
animate.setAttribute('attributeName', 'fill');
|
|
animate.setAttribute('from', 'blue');
|
|
animate.setAttribute('to', 'red');
|
|
animate.setAttribute('dur', '100s');
|
|
rect.appendChild(animate);
|
|
|
|
requestAnimationFrame(function(time) {
|
|
target.style.display = 'block';
|
|
requestAnimationFrame(function(time) {
|
|
document.documentElement.removeAttribute("class");
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|