2011-04-12 10:18:42 +04:00
|
|
|
<!DOCTYPE HTML>
|
|
|
|
<html>
|
|
|
|
<!--
|
|
|
|
https://bugzilla.mozilla.org/show_bug.cgi?id=435441
|
|
|
|
-->
|
|
|
|
<head>
|
|
|
|
<title>Test for Bug 435441</title>
|
|
|
|
<script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
|
2011-04-12 10:18:43 +04:00
|
|
|
<script type="application/javascript" src="animation_utils.js"></script>
|
2011-04-12 10:18:42 +04:00
|
|
|
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
|
|
|
|
<style type="text/css">
|
|
|
|
|
|
|
|
p.transition {
|
2012-07-09 05:25:10 +04:00
|
|
|
transition: margin-top 100s linear;
|
2011-04-12 10:18:42 +04:00
|
|
|
}
|
|
|
|
|
|
|
|
</style>
|
|
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<div id="display">
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<pre id="test">
|
|
|
|
<script type="application/javascript">
|
|
|
|
|
|
|
|
/** Test for transition step functions **/
|
|
|
|
|
|
|
|
var display = document.getElementById("display");
|
|
|
|
|
|
|
|
function run_test(tf, percent, value)
|
|
|
|
{
|
|
|
|
var p = document.createElement("p");
|
|
|
|
p.className = "transition";
|
|
|
|
p.style.marginTop = "0px";
|
|
|
|
// be this percent of the way through a 100s transition
|
2012-07-09 05:25:10 +04:00
|
|
|
p.style.transitionDelay = (percent * -100) + "s";
|
|
|
|
p.style.transitionTimingFunction = tf;
|
2011-04-12 10:18:42 +04:00
|
|
|
display.appendChild(p);
|
|
|
|
var cs = getComputedStyle(p, "");
|
|
|
|
var flush1 = cs.marginTop;
|
|
|
|
|
|
|
|
p.style.marginTop = "1000px";
|
|
|
|
var result = px_to_num(cs.marginTop) / 1000
|
|
|
|
|
|
|
|
is(result, value, 100 * percent + "% of the way through " + tf);
|
|
|
|
|
|
|
|
display.removeChild(p);
|
|
|
|
}
|
|
|
|
|
|
|
|
run_test("step-start", 0, 0);
|
|
|
|
run_test("step-start", 0.001, 1);
|
|
|
|
run_test("step-start", 0.999, 1);
|
|
|
|
run_test("step-start", 1, 1);
|
|
|
|
run_test("step-end", 0, 0);
|
|
|
|
run_test("step-end", 0.001, 0);
|
|
|
|
run_test("step-end", 0.999, 0);
|
|
|
|
run_test("step-end", 1, 1);
|
|
|
|
|
|
|
|
run_test("steps(2)", 0.00, 0.0);
|
|
|
|
run_test("steps(2)", 0.49, 0.0);
|
|
|
|
run_test("steps(2)", 0.50, 0.5);
|
|
|
|
run_test("steps(2)", 0.99, 0.5);
|
|
|
|
run_test("steps(2)", 1.00, 1.0);
|
|
|
|
|
|
|
|
run_test("steps(2, end)", 0.00, 0.0);
|
|
|
|
run_test("steps(2, end)", 0.49, 0.0);
|
|
|
|
run_test("steps(2, end)", 0.50, 0.5);
|
|
|
|
run_test("steps(2, end)", 0.99, 0.5);
|
|
|
|
run_test("steps(2, end)", 1.00, 1.0);
|
|
|
|
|
|
|
|
run_test("steps(2, start)", 0.00, 0.0);
|
|
|
|
run_test("steps(2, start)", 0.01, 0.5);
|
|
|
|
run_test("steps(2, start)", 0.50, 0.5);
|
|
|
|
run_test("steps(2, start)", 0.51, 1.0);
|
|
|
|
run_test("steps(2, start)", 1.00, 1.0);
|
|
|
|
|
|
|
|
run_test("steps(8,end)", 0.00, 0.0);
|
|
|
|
run_test("steps(8,end)", 0.10, 0.0);
|
|
|
|
run_test("steps(8,end)", 0.20, 0.125);
|
|
|
|
run_test("steps(8,end)", 0.30, 0.25);
|
|
|
|
run_test("steps(8,end)", 0.40, 0.375);
|
|
|
|
run_test("steps(8,end)", 0.49, 0.375);
|
|
|
|
run_test("steps(8,end)", 0.50, 0.5);
|
|
|
|
run_test("steps(8,end)", 0.60, 0.5);
|
|
|
|
run_test("steps(8,end)", 0.70, 0.625);
|
|
|
|
run_test("steps(8,end)", 0.80, 0.75);
|
|
|
|
run_test("steps(8,end)", 0.90, 0.875);
|
|
|
|
run_test("steps(8,end)", 1.00, 1.0);
|
|
|
|
|
|
|
|
</script>
|
|
|
|
</pre>
|
|
|
|
</body>
|
|
|
|
</html>
|