2010-03-01 11:31:50 -08:00
|
|
|
<?xml version="1.0" encoding="UTF-8" ?>
|
|
|
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
|
|
|
<head>
|
|
|
|
|
<title>Test for adding and removing animations from a time container</title>
|
|
|
|
|
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
|
|
|
|
|
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<p id="display"></p>
|
|
|
|
|
<div id="content" style="display: none">
|
2010-03-10 12:33:37 -08:00
|
|
|
<svg id="svg" xmlns="http://www.w3.org/2000/svg" width="120px" height="120px"
|
|
|
|
|
onload="this.pauseAnimations()">
|
2010-03-01 11:31:50 -08:00
|
|
|
<circle cx="-20" cy="20" r="15" fill="blue" id="circle">
|
|
|
|
|
<set attributeName="cy" to="120" begin="0s; 2s" dur="1s" id="b"/>
|
|
|
|
|
</circle>
|
|
|
|
|
</svg>
|
|
|
|
|
</div>
|
|
|
|
|
<pre id="test">
|
|
|
|
|
<script class="testbody" type="text/javascript">
|
|
|
|
|
<![CDATA[
|
|
|
|
|
/** Test for adding and removing animations from a time container **/
|
|
|
|
|
|
|
|
|
|
SimpleTest.waitForExplicitFinish();
|
|
|
|
|
|
|
|
|
|
function main() {
|
|
|
|
|
var svg = getElement("svg");
|
2010-03-10 12:33:37 -08:00
|
|
|
ok(svg.animationsPaused(), "should be paused by <svg> load handler");
|
|
|
|
|
is(svg.getCurrentTime(), 0, "should be paused at 0 in <svg> load handler");
|
2010-03-01 11:31:50 -08:00
|
|
|
|
|
|
|
|
// Create animation and check initial state
|
|
|
|
|
var anim = createAnim();
|
|
|
|
|
anim.setAttribute('begin','b.begin+2s; 6s');
|
|
|
|
|
ok(noStart(anim), "Animation has start time before attaching to document.");
|
|
|
|
|
|
|
|
|
|
// Attach animation to container
|
|
|
|
|
var circle = getElement("circle");
|
|
|
|
|
circle.appendChild(anim);
|
|
|
|
|
|
|
|
|
|
// Check state after attaching
|
|
|
|
|
is(anim.getStartTime(), 2);
|
|
|
|
|
|
|
|
|
|
// Unbind from tree -- the syncbase instance time(s) should become unresolved
|
|
|
|
|
// but the offset time should remain
|
2011-08-12 09:21:37 -07:00
|
|
|
anim.parentNode.removeChild(anim);
|
2010-03-01 11:31:50 -08:00
|
|
|
is(anim.getStartTime(), 6);
|
|
|
|
|
|
|
|
|
|
// Rebind and check everything is re-resolved
|
|
|
|
|
circle.appendChild(anim);
|
|
|
|
|
is(anim.getStartTime(), 2);
|
|
|
|
|
|
|
|
|
|
// Advance document time to t=1s
|
|
|
|
|
// Now the current interval for b is 2s-3s but the current interval for anim
|
|
|
|
|
// is still 2s-2.5s based on b's previous interval
|
|
|
|
|
svg.setCurrentTime(1);
|
|
|
|
|
is(anim.getStartTime(), 2);
|
|
|
|
|
|
|
|
|
|
// Unbind
|
2011-08-12 09:21:37 -07:00
|
|
|
anim.parentNode.removeChild(anim);
|
2010-03-01 11:31:50 -08:00
|
|
|
is(anim.getStartTime(), 6);
|
|
|
|
|
|
|
|
|
|
// Rebind
|
2010-07-02 22:52:50 -07:00
|
|
|
// At this point only the current interval will be re-added to anim (this is
|
|
|
|
|
// for consistency since old intervals may or may not have been filtered).
|
|
|
|
|
// Therefore the start time should be 4s instead of 2s.
|
2010-03-01 11:31:50 -08:00
|
|
|
circle.appendChild(anim);
|
2010-07-02 22:52:50 -07:00
|
|
|
is(anim.getStartTime(), 4);
|
2010-03-01 11:31:50 -08:00
|
|
|
|
|
|
|
|
SimpleTest.finish();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function createAnim() {
|
|
|
|
|
const svgns="http://www.w3.org/2000/svg";
|
|
|
|
|
var anim = document.createElementNS(svgns,'set');
|
|
|
|
|
anim.setAttribute('attributeName','cx');
|
|
|
|
|
anim.setAttribute('to','100');
|
|
|
|
|
anim.setAttribute('dur','0.5s');
|
|
|
|
|
return anim;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function noStart(elem) {
|
|
|
|
|
var exceptionCaught = false;
|
|
|
|
|
|
|
|
|
|
try {
|
|
|
|
|
elem.getStartTime();
|
|
|
|
|
} catch(e) {
|
|
|
|
|
exceptionCaught = true;
|
|
|
|
|
is (e.code, DOMException.INVALID_STATE_ERR,
|
|
|
|
|
"Unexpected exception code from getStartTime.");
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return exceptionCaught;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
window.addEventListener("load", main, false);
|
|
|
|
|
]]>
|
|
|
|
|
</script>
|
|
|
|
|
</pre>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
