| <html> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <script src="resources/SVGAnimationTestCase.js"></script> |
| |
| <h1>Reinserting SVG animation into document should continue the animation</h1> |
| <p id="description"></p> |
| <div id="console"></div> |
| <svg id="svg" xmlns="http://www.w3.org/2000/svg"> |
| <rect id="rect" x="0" y="0" width="20" height="20"> |
| <animate attributeName="x" begin="0" from="0" to="90" dur="3s" fill="freeze" /> |
| </rect> |
| </svg> |
| |
| <script> |
| async_test(t => { |
| svg = document.getElementById('svg'); |
| rect = document.getElementById('rect'); |
| |
| // To ensure that a full lifecycle runs between the remove/append and the |
| // later asserts, we need to do both of them in successive rAFs. |
| window.requestAnimationFrame(() => { |
| svg.setCurrentTime(1); |
| |
| // Removing and re-adding the SVG shouldn't change anything about the |
| // underlying animation. |
| document.body.removeChild(svg); |
| document.body.appendChild(svg); |
| |
| // The SVG animation will continue after the next frame runs. |
| window.requestAnimationFrame(t.step_func_done(() => { |
| assert_greater_than_equal(svg.getCurrentTime(), 1); |
| assert_greater_than_equal(rect.x.animVal.value, 30); |
| svg.setCurrentTime(2); |
| assert_approx_equals(rect.x.animVal.value, 60, 1); |
| })); |
| }); |
| }, 'Reinserting SVG animation into document should continue the animation'); |
| </script> |
| </html> |