diff options
Diffstat (limited to 'layout/reftests/svg/smil/container/moved-tree-1.xhtml')
-rw-r--r-- | layout/reftests/svg/smil/container/moved-tree-1.xhtml | 74 |
1 files changed, 74 insertions, 0 deletions
diff --git a/layout/reftests/svg/smil/container/moved-tree-1.xhtml b/layout/reftests/svg/smil/container/moved-tree-1.xhtml new file mode 100644 index 0000000000..2206c8837d --- /dev/null +++ b/layout/reftests/svg/smil/container/moved-tree-1.xhtml @@ -0,0 +1,74 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no" ?> +<html xmlns="http://www.w3.org/1999/xhtml" class="reftest-wait"> + <head> + <title>Moving sub-trees</title> + <!-- + PURPOSE: This case tests moving an animated sub-tree from one SVG document + fragment to another. Different document fragments have different time + containers and so this test ensures the animation is correctly transferred + from one time container to the other. + + OPERATION: Both animations contain a moving box. The first animation also + contains a circle. Both this circle and its child animation element are + removed from the first animation and added to the second animation. + + EXPECTED RESULTS: The circle appears in the second box at the appropriate + offset. + --> + <script> + function move() + { + var svgs = document.getElementsByTagName('svg'); + for (var i = 0; i < svgs.length; i++) { + var svg = svgs[i]; + svg.pauseAnimations(); + svg.setCurrentTime(1.5); + } + doMove(); + setTimeout('document.documentElement.removeAttribute("class")', 0); + } + + function doMove() + { + var circle = document.getElementById('circle-to-move'); + circle.parentNode.removeChild(circle); + var target = document.getElementById('new-parent'); + target.appendChild(circle); + } + </script> + </head> + + <body onload="move()"> + <svg xmlns="http://www.w3.org/2000/svg" width="200px" height="200px"> + <rect x="0" y="0" width="199" height="199" + style="fill: none; stroke: black"/> + <g> + <!-- background rect to track progress --> + <rect x="0" y="80" width="0" height="40" fill="royalblue" + stroke="black" stroke-width="1"> + <animate attributeName="width" from="0" to="200" begin="0s" dur="3s" + fill="freeze"/> + </rect> + <!-- circle to transfer --> + <circle cx="0" cy="100" r="15" fill="skyblue" stroke="black" + stroke-width="1" id="circle-to-move"> + <animate attributeName="cx" from="0" to="200" begin="0s" dur="3s" + fill="freeze"/> + </circle> + </g> + </svg> + <!-- Second animation --> + <svg xmlns="http://www.w3.org/2000/svg" width="200px" height="200px"> + <rect x="0" y="0" width="199" height="199" + style="fill: none; stroke: black"/> + <g id="new-parent"> + <!-- background rect to track progress --> + <rect x="0" y="80" width="0" height="40" fill="greenyellow" + stroke="black" stroke-width="1"> + <animate attributeName="width" from="0" to="200" begin="0s" dur="3s" + fill="freeze"/> + </rect> + </g> + </svg> + </body> +</html> |