mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-10-22 09:45:41 +00:00
0d460e3432
This is split from the previous changeset since if we include dom/ the file size is too large for phabricator to handle. This is an autogenerated commit to handle scripts loading mochitest harness files, in the simple case where the script src is on the same line as the tag. This was generated with https://bug1544322.bmoattachments.org/attachment.cgi?id=9058170 using the `--part 2` argument. Differential Revision: https://phabricator.services.mozilla.com/D27457 --HG-- extra : moz-landing-system : lando
256 lines
8.2 KiB
HTML
256 lines
8.2 KiB
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
<head>
|
|
<title>Test for SMIL sync behaviour </title>
|
|
<script 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">
|
|
<svg id="svg" xmlns="http://www.w3.org/2000/svg" width="120px" height="120px">
|
|
<circle cx="20" cy="20" r="15" fill="blue">
|
|
<animate attributeName="cx" attributeType="XML" from="20" to="100"
|
|
begin="indefinite" dur="4s" restart="always" id="anim1"/>
|
|
</circle>
|
|
<circle cx="20" cy="20" r="15" fill="blue">
|
|
<animate attributeName="cx" attributeType="XML" from="0" to="50"
|
|
begin="0" dur="1s" additive="sum" fill="freeze" id="anim2"/>
|
|
</circle>
|
|
<circle cx="20" cy="20" r="15" fill="blue">
|
|
<animate attributeName="cx" attributeType="XML" from="0" to="50"
|
|
begin="0" dur="10s" additive="sum" fill="freeze" id="anim3"/>
|
|
</circle>
|
|
<circle cx="20" cy="20" r="15" fill="blue">
|
|
<animate attributeName="cx" attributeType="XML" from="0" to="50"
|
|
begin="0" dur="10s" additive="sum" fill="freeze" id="anim4"/>
|
|
</circle>
|
|
<circle cx="20" cy="20" r="15" fill="blue">
|
|
<animate attributeName="cx" attributeType="XML" from="0" to="50"
|
|
begin="0" dur="40s" additive="sum" fill="freeze" id="anim5"/>
|
|
</circle>
|
|
<circle cx="20" cy="20" r="15" fill="blue">
|
|
<animate attributeName="cx" attributeType="XML" from="20" to="100"
|
|
begin="100s" dur="4s" restart="always" id="anim6"/>
|
|
</circle>
|
|
</svg>
|
|
</div>
|
|
<pre id="test">
|
|
<script class="testbody" type="text/javascript">
|
|
<![CDATA[
|
|
/** Test for SMIL sync behavior **/
|
|
|
|
/* Global Variables */
|
|
var svg = document.getElementById("svg");
|
|
|
|
SimpleTest.waitForExplicitFinish();
|
|
|
|
function main() {
|
|
testBeginAt(document.getElementById("anim1"));
|
|
testChangeBaseVal(document.getElementById("anim2"));
|
|
testChangeWhilePaused(document.getElementById("anim3"));
|
|
testChangeAnimAttribute(document.getElementById("anim4"));
|
|
testChangeTimingAttribute(document.getElementById("anim5"));
|
|
testSetCurrentTime(document.getElementById("anim6"));
|
|
SimpleTest.finish();
|
|
}
|
|
|
|
function testBeginAt(anim) {
|
|
// This (hugely important) test checks that a call to beginElement updates to
|
|
// the new interval
|
|
|
|
// Check some pre-conditions
|
|
is(anim.getAttribute("restart"), "always");
|
|
ok(anim.getSimpleDuration() >= 4);
|
|
|
|
// First start the animation
|
|
svg.setCurrentTime(2);
|
|
anim.beginElement();
|
|
|
|
// Then restart it--twice
|
|
svg.setCurrentTime(4);
|
|
anim.beginElement();
|
|
anim.beginElementAt(-1);
|
|
|
|
// The first restart should win if the state machine has been successfully
|
|
// updated. If we get '3' back instead we haven't updated properly.
|
|
is(anim.getStartTime(), 4);
|
|
}
|
|
|
|
function testChangeBaseVal(anim) {
|
|
// Check that a change to the base value is updated even after animation is
|
|
// frozen
|
|
|
|
// preconditions -- element should have ended
|
|
try {
|
|
anim.getStartTime();
|
|
ok(false, "Element has not ended yet.");
|
|
} catch (e) { }
|
|
|
|
// check frozen value is applied
|
|
var target = anim.targetElement;
|
|
is(target.cx.animVal.value, 70);
|
|
is(target.cx.baseVal.value, 20);
|
|
|
|
// change base val and re-check
|
|
target.cx.baseVal.value = 30;
|
|
is(target.cx.animVal.value, 80);
|
|
is(target.cx.baseVal.value, 30);
|
|
}
|
|
|
|
function testChangeWhilePaused(anim) {
|
|
// Check that a change to the base value is updated even when the animation is
|
|
// paused
|
|
|
|
svg.pauseAnimations();
|
|
svg.setCurrentTime(anim.getSimpleDuration() / 2);
|
|
|
|
// check paused value is applied
|
|
var target = anim.targetElement;
|
|
is(target.cx.animVal.value, 45);
|
|
is(target.cx.baseVal.value, 20);
|
|
|
|
// change base val and re-check
|
|
target.cx.baseVal.value = 30;
|
|
is(target.cx.animVal.value, 55);
|
|
is(target.cx.baseVal.value, 30);
|
|
}
|
|
|
|
function testChangeAnimAttribute(anim) {
|
|
// Check that a change to an animation attribute causes an update even when
|
|
// the animation is frozen and paused
|
|
|
|
// Make sure animation is paused and frozen
|
|
svg.pauseAnimations();
|
|
svg.setCurrentTime(anim.getStartTime() + anim.getSimpleDuration() + 1);
|
|
|
|
// Check frozen value is applied
|
|
var target = anim.targetElement;
|
|
is(target.cx.animVal.value, 70);
|
|
is(target.cx.baseVal.value, 20);
|
|
|
|
// Make the animation no longer additive
|
|
anim.removeAttribute("additive");
|
|
is(target.cx.animVal.value, 50);
|
|
is(target.cx.baseVal.value, 20);
|
|
}
|
|
|
|
function testChangeTimingAttribute(anim) {
|
|
// Check that a change to a timing attribute causes an update even when
|
|
// the animation is paused
|
|
|
|
svg.pauseAnimations();
|
|
svg.setCurrentTime(anim.getSimpleDuration() / 2);
|
|
|
|
// Check part-way value is applied
|
|
var target = anim.targetElement;
|
|
is(target.cx.animVal.value, 45);
|
|
is(target.cx.baseVal.value, 20);
|
|
|
|
// Make the animation no longer additive
|
|
anim.setAttribute("dur", String(anim.getSimpleDuration() / 2) + "s");
|
|
is(target.cx.animVal.value, 70);
|
|
is(target.cx.baseVal.value, 20);
|
|
|
|
// Remove fill
|
|
anim.removeAttribute("fill");
|
|
is(target.cx.animVal.value, 20);
|
|
is(target.cx.baseVal.value, 20);
|
|
}
|
|
|
|
function testSetCurrentTime(anim) {
|
|
// This test checks that a call to setCurrentTime flushes restarts
|
|
//
|
|
// Actually, this same scenario arises in test_smilRestart.xhtml but we
|
|
// isolate this particular situation here for easier diagnosis if this ever
|
|
// fails.
|
|
//
|
|
// At first we have:
|
|
// currentTime begin="100s"
|
|
// v v
|
|
// Doc time: 0---\/\/\/-------99----------100-------
|
|
//
|
|
svg.setCurrentTime(99);
|
|
is(anim.getStartTime(), 100);
|
|
|
|
// Then we restart giving us:
|
|
//
|
|
// beginElement begin="100s"
|
|
// v v
|
|
// Doc time: 0---\/\/\/-------99----------100-------
|
|
//
|
|
// So our current interval is
|
|
//
|
|
// begin="100s"
|
|
// v
|
|
// +---------------|
|
|
// Doc time: 0---\/\/\/-------99-100-101-102-103-----
|
|
//
|
|
anim.beginElement();
|
|
is(anim.getStartTime(), svg.getCurrentTime());
|
|
|
|
// Then we skip to half-way, i.e.
|
|
//
|
|
// currentTime
|
|
// v
|
|
// begin="100s"
|
|
// v
|
|
// +---------------|
|
|
// Doc time: 0---\/\/\/-------99-100-101-102-103-----
|
|
//
|
|
// At this point we should flush our restarts and early end the first interval
|
|
// and start the second interval, giving us
|
|
//
|
|
// So our timegraph looks like:
|
|
//
|
|
// currentTime
|
|
// v
|
|
// +---------------|
|
|
// +---|
|
|
// Doc time: 0---\/\/\/-------99-100-101-102-103-104-
|
|
//
|
|
var newTime = anim.getStartTime() + 0.5 * anim.getSimpleDuration();
|
|
svg.setCurrentTime(newTime);
|
|
|
|
// Finally we call beginElement again giving us
|
|
//
|
|
// currentTime
|
|
// v
|
|
// +---------------|
|
|
// +---|
|
|
// +---|
|
|
// Doc time: 0---\/\/\/-------99-100-101-102-103-104-105-
|
|
//
|
|
// If, however, setCurrentTime failed to flush restarts out starting point
|
|
// we do come to update the timegraph would be:
|
|
//
|
|
// beginElementAt
|
|
// v
|
|
// begin="100s"
|
|
// v
|
|
// +---------------|
|
|
// Doc time: 0---\/\/\/-------99-100-101-102-103-----
|
|
//
|
|
// And as soon as we encountered the begin="100s" spec we'd do a restart
|
|
// according to the SMIL algorithms and a restart involves a reset which
|
|
// clears the instance times created by DOM calls and so we'd end up with
|
|
// just:
|
|
//
|
|
// currentTime
|
|
// v
|
|
// +---------------|
|
|
// +---|
|
|
// Doc time: 0---\/\/\/-------99-100-101-102-103-104-
|
|
//
|
|
// Which is probably not what the author intended.
|
|
//
|
|
anim.beginElement();
|
|
is(anim.getStartTime(), svg.getCurrentTime());
|
|
}
|
|
|
|
window.addEventListener("load", main);
|
|
]]>
|
|
</script>
|
|
</pre>
|
|
</body>
|
|
</html>
|