2010-01-12 12:00:49 -08:00
|
|
|
<?xml version="1.0" encoding="UTF-8" ?>
|
|
|
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
|
|
|
<head>
|
|
|
|
|
<title>Test for moving animations between time containers</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="svga" xmlns="http://www.w3.org/2000/svg" width="120px" height="120px"
|
|
|
|
|
onload="this.pauseAnimations()">
|
2010-01-12 12:00:49 -08:00
|
|
|
<circle cx="-20" cy="20" r="15" fill="blue" id="circlea"/>
|
|
|
|
|
</svg>
|
2010-03-10 12:33:37 -08:00
|
|
|
<svg id="svgb" xmlns="http://www.w3.org/2000/svg" width="120px" height="120px"
|
|
|
|
|
onload="this.pauseAnimations()">
|
2010-01-12 12:00:49 -08:00
|
|
|
<circle cx="-20" cy="20" r="15" fill="blue" id="circleb">
|
|
|
|
|
<set attributeName="cy" to="120" begin="4s" dur="1s" id="syncb"/>
|
|
|
|
|
</circle>
|
|
|
|
|
</svg>
|
|
|
|
|
</div>
|
|
|
|
|
<pre id="test">
|
|
|
|
|
<script class="testbody" type="text/javascript">
|
|
|
|
|
<![CDATA[
|
|
|
|
|
/** Test for moving animations between time containers **/
|
|
|
|
|
|
|
|
|
|
SimpleTest.waitForExplicitFinish();
|
|
|
|
|
|
|
|
|
|
function main() {
|
|
|
|
|
var svga = getElement("svga");
|
2010-03-10 12:33:37 -08:00
|
|
|
ok(svga.animationsPaused(), "should be paused by <svg> load handler");
|
|
|
|
|
is(svga.getCurrentTime(), 0, "should be paused at 0 in <svg> load handler");
|
2010-01-12 12:00:49 -08:00
|
|
|
svga.setCurrentTime(1);
|
|
|
|
|
|
|
|
|
|
var svgb = getElement("svgb");
|
2010-03-10 12:33:37 -08:00
|
|
|
ok(svgb.animationsPaused(), "should be paused by <svg> load handler");
|
|
|
|
|
is(svgb.getCurrentTime(), 0, "should be paused at 0 in <svg> load handler");
|
2010-01-12 12:00:49 -08:00
|
|
|
svgb.setCurrentTime(1);
|
|
|
|
|
|
|
|
|
|
// Create animation and check initial state
|
|
|
|
|
var anim = createAnim();
|
2010-01-12 12:00:50 -08:00
|
|
|
ok(noStart(anim), "Animation has start time before attaching to document");
|
2010-01-12 12:00:49 -08:00
|
|
|
|
|
|
|
|
// Attach animation to first container
|
|
|
|
|
var circlea = getElement("circlea");
|
|
|
|
|
var circleb = getElement("circleb");
|
|
|
|
|
circlea.appendChild(anim);
|
|
|
|
|
|
|
|
|
|
// Check state after attaching
|
|
|
|
|
is(anim.getStartTime(), 2,
|
|
|
|
|
"Unexpected start time after attaching animation to target");
|
|
|
|
|
is(circlea.cx.animVal.value, -20,
|
|
|
|
|
"Unexpected animated value for yet-to-start animation");
|
|
|
|
|
is(circleb.cx.animVal.value, -20,
|
|
|
|
|
"Unexpected animated value for unanimated target");
|
|
|
|
|
|
|
|
|
|
// Move animation from first container to second
|
|
|
|
|
circleb.appendChild(anim);
|
|
|
|
|
|
|
|
|
|
// Advance first container and check animation has no effect
|
|
|
|
|
svga.setCurrentTime(2);
|
|
|
|
|
is(anim.getStartTime(), 2,
|
|
|
|
|
"Unexpected start time after moving animation");
|
|
|
|
|
is(circlea.cx.animVal.value, -20,
|
|
|
|
|
"Unexpected animated value for non-longer-animated target");
|
|
|
|
|
is(circleb.cx.animVal.value, -20,
|
|
|
|
|
"Unexpected animated value for now yet-to-start animation");
|
|
|
|
|
|
|
|
|
|
// Advance second container and check the animation only affects it
|
|
|
|
|
svgb.setCurrentTime(2);
|
|
|
|
|
is(anim.getStartTime(), 2, "Start time changed after time container seek");
|
|
|
|
|
is(circlea.cx.animVal.value, -20,
|
|
|
|
|
"Unanimated target changed after seek on other container");
|
|
|
|
|
is(circleb.cx.animVal.value, 100, "Animated target not animated after seek");
|
|
|
|
|
|
|
|
|
|
// Remove animation so that it belongs to no container and check that
|
|
|
|
|
// advancing the second container to the next milestone doesn't cause a crash
|
|
|
|
|
// (when the animation controller goes to run the next milestone sample).
|
2011-08-12 09:21:37 -07:00
|
|
|
anim.parentNode.removeChild(anim);
|
2010-01-12 12:00:49 -08:00
|
|
|
svgb.setCurrentTime(3);
|
|
|
|
|
|
|
|
|
|
// Do likewise with syncbase relationships
|
|
|
|
|
|
|
|
|
|
// Create the syncbase relationship
|
|
|
|
|
anim.setAttribute('begin', 'syncb.begin');
|
|
|
|
|
|
|
|
|
|
// Attach to second time container (where t=3s)
|
|
|
|
|
circleb.appendChild(anim);
|
|
|
|
|
is(anim.getStartTime(), 4,
|
|
|
|
|
"Unexpected start time for cross-time container syncbase dependency");
|
|
|
|
|
|
|
|
|
|
// Move to first time container (where t=1s).
|
|
|
|
|
// Because we're dealing with different time containers and both are paused,
|
|
|
|
|
// future times are effectively unresolved.
|
|
|
|
|
circlea.appendChild(anim);
|
|
|
|
|
ok(noStart(anim), "Unexpected start time for paused time container");
|
|
|
|
|
|
|
|
|
|
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('begin','2s');
|
|
|
|
|
anim.setAttribute('dur','1s');
|
|
|
|
|
return anim;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function noStart(elem) {
|
|
|
|
|
var exceptionCaught = false;
|
|
|
|
|
|
|
|
|
|
try {
|
|
|
|
|
elem.getStartTime();
|
|
|
|
|
} catch(e) {
|
|
|
|
|
exceptionCaught = true;
|
2012-04-26 09:42:26 -07:00
|
|
|
is (e.name, "InvalidStateError",
|
|
|
|
|
"Unexpected exception from getStartTime.");
|
2010-01-12 12:00:49 -08:00
|
|
|
is (e.code, DOMException.INVALID_STATE_ERR,
|
2010-01-12 12:00:50 -08:00
|
|
|
"Unexpected exception code from getStartTime");
|
2010-01-12 12:00:49 -08:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return exceptionCaught;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
window.addEventListener("load", main, false);
|
|
|
|
|
]]>
|
|
|
|
|
</script>
|
|
|
|
|
</pre>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
