<!DOCTYPE html>
<div id="parent">
<div id="child1"></div>
<div id="child2">
<div id="child3"></div>
</div>
</div>
<script src="../../include.js"></script>
<script>
test(() => {
const elements = ["parent", "child1", "child2", "child3"];
for (const id of elements)
document.getElementById(id).animate({}, { duration: Infinity });
const parent = document.getElementById("parent");
const subtreeAnimations = parent.getAnimations({ subtree: true });
println(`num animations without subtree: ${parent.getAnimations({ subtree: false }).length}`);
println(`num animations with subtree: ${subtreeAnimations.length}`);
for (let i = 0; i < elements.length; i++) {
const elem = document.getElementById(elements[i]);
const correctOrder = Object.is(subtreeAnimations[i], elem.getAnimations()[0]);
println(`Anim for element ${elements[i]} is in the correct order: ${correctOrder}`);
}
})
</script>
