mirror of
https://gitlab.winehq.org/wine/wine-gecko.git
synced 2024-09-13 09:24:08 -07:00
Bug 562815 part 2a - Add further tests; r=dholbert
--HG-- extra : rebase_source : 6646562047657bda34547d01b784ddafa2b6f583
This commit is contained in:
Brian Birtles
parent
b737454f44
commit
9ed6935d93
@ -8,7 +8,10 @@
|
|||||||
<body>
|
<body>
|
||||||
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=533291">Mozilla Bug 533291</a>
|
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=533291">Mozilla Bug 533291</a>
|
||||||
<p id="display"></p>
|
<p id="display"></p>
|
||||||
<div id="content" style="display: none">
|
<!-- Bug 628848: The following should be display: none but we currently don't
|
||||||
|
handle percentage lengths properly when the whole fragment is display: none
|
||||||
|
-->
|
||||||
|
<div id="content" style="visibility: hidden">
|
||||||
<svg id="svg" xmlns="http://www.w3.org/2000/svg" width="120px" height="120px"
|
<svg id="svg" xmlns="http://www.w3.org/2000/svg" width="120px" height="120px"
|
||||||
onload="this.pauseAnimations()">
|
onload="this.pauseAnimations()">
|
||||||
<g id="circleParent">
|
<g id="circleParent">
|
||||||
@ -21,7 +24,7 @@
|
|||||||
<![CDATA[
|
<![CDATA[
|
||||||
/** Test for SMIL values that are context-sensitive **/
|
/** Test for SMIL values that are context-sensitive **/
|
||||||
|
|
||||||
/* See bug 533291.
|
/* See bugs 533291 and 562815.
|
||||||
|
|
||||||
The format of each test is basically:
|
The format of each test is basically:
|
||||||
1) create some animated and frozen state
|
1) create some animated and frozen state
|
||||||
@ -79,7 +82,16 @@ function main()
|
|||||||
testCurrentColorChange,
|
testCurrentColorChange,
|
||||||
testCurrentColorChangeUsingStyle,
|
testCurrentColorChangeUsingStyle,
|
||||||
testInheritChange,
|
testInheritChange,
|
||||||
testInheritChangeUsingStyle
|
testInheritChangeUsingStyle,
|
||||||
|
testEmUnitChangeOnProp,
|
||||||
|
testEmUnitChangeOnPropBase,
|
||||||
|
testEmUnitChangeOnLength,
|
||||||
|
testPercentUnitChangeOnProp,
|
||||||
|
testPercentUnitChangeOnLength,
|
||||||
|
testRelativeFontSize,
|
||||||
|
testRelativeFontWeight,
|
||||||
|
testRelativeFont,
|
||||||
|
testCalcFontSize
|
||||||
];
|
];
|
||||||
|
|
||||||
while (tests.length) {
|
while (tests.length) {
|
||||||
@ -224,6 +236,229 @@ function testInheritChangeUsingStyle()
|
|||||||
gCircle.removeChild(gCircle.firstChild);
|
gCircle.removeChild(gCircle.firstChild);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function testEmUnitChangeOnProp()
|
||||||
|
{
|
||||||
|
setupTest();
|
||||||
|
gCircleParent.setAttribute("font-size", "10px"); // At first: font-size: 10px
|
||||||
|
var anim = createAnimSetTo("font-size", "2em");
|
||||||
|
|
||||||
|
gSvg.setCurrentTime(0);
|
||||||
|
is(SMILUtil.getComputedStyleSimple(gCircle, "font-size"), "20px",
|
||||||
|
"Checking animated font-size=2em after animating ends");
|
||||||
|
|
||||||
|
gCircleParent.setAttribute("font-size", "20px"); // Change: font-size: 20px
|
||||||
|
gSvg.setCurrentTime(0);
|
||||||
|
is(SMILUtil.getComputedStyleSimple(gCircle, "font-size"), "40px",
|
||||||
|
"Checking animated font-size=2em after updating context");
|
||||||
|
|
||||||
|
gCircleParent.removeAttribute("font-size");
|
||||||
|
gCircle.removeChild(gCircle.firstChild);
|
||||||
|
}
|
||||||
|
|
||||||
|
function testEmUnitChangeOnPropBase()
|
||||||
|
{
|
||||||
|
// Test the case where the base value for our animation sandwich is
|
||||||
|
// context-sensitive.
|
||||||
|
// Currently, this is taken care of by the compositor which keeps a cached
|
||||||
|
// base value and compares it with the current base value. This test then just
|
||||||
|
// serves as a regression test in case the compositor's behaviour changes.
|
||||||
|
setupTest();
|
||||||
|
gSvg.setAttribute("font-size", "10px"); // At first: font-size: 10px
|
||||||
|
gCircleParent.setAttribute("font-size", "1em"); // Base: 10px
|
||||||
|
var anim = createAnimBy("font-size", "10px");
|
||||||
|
|
||||||
|
gSvg.setCurrentTime(TIME_AFTER_ANIM_END);
|
||||||
|
is(SMILUtil.getComputedStyleSimple(gCircle, "font-size"), "20px",
|
||||||
|
"Checking animated font-size=20px after anim ends");
|
||||||
|
|
||||||
|
gSvg.setAttribute("font-size", "20px"); // Change: font-size: 20px
|
||||||
|
gSvg.setCurrentTime(TIME_AFTER_ANIM_END);
|
||||||
|
is(SMILUtil.getComputedStyleSimple(gCircle, "font-size"), "30px",
|
||||||
|
"Checking animated font-size=30px after updating context");
|
||||||
|
|
||||||
|
gCircleParent.removeAttribute("font-size");
|
||||||
|
gCircle.removeChild(gCircle.firstChild);
|
||||||
|
}
|
||||||
|
|
||||||
|
function testEmUnitChangeOnLength()
|
||||||
|
{
|
||||||
|
setupTest();
|
||||||
|
gCircleParent.setAttribute("font-size", "10px"); // At first: font-size: 10px
|
||||||
|
var anim = createAnimSetTo("cx", "2em");
|
||||||
|
|
||||||
|
gSvg.setCurrentTime(0);
|
||||||
|
is(gCircle.cx.animVal.value, 20,
|
||||||
|
"Checking animated length=2em after animating");
|
||||||
|
|
||||||
|
gCircleParent.setAttribute("font-size", "20px"); // Change: font-size: 20px
|
||||||
|
// Bug 508206: We should really detect this change and update immediately but
|
||||||
|
// currently we don't until we get sampled again
|
||||||
|
todo_is(gCircle.cx.animVal.value, 40,
|
||||||
|
"Checking animated length=2em after updating context but before sampling");
|
||||||
|
|
||||||
|
gSvg.setCurrentTime(0);
|
||||||
|
is(gCircle.cx.animVal.value, 40,
|
||||||
|
"Checking animated length=2em after updating context and after " +
|
||||||
|
"resampling");
|
||||||
|
|
||||||
|
gCircleParent.removeAttribute("font-size");
|
||||||
|
gCircle.removeChild(gCircle.firstChild);
|
||||||
|
}
|
||||||
|
|
||||||
|
function testPercentUnitChangeOnProp()
|
||||||
|
{
|
||||||
|
setupTest();
|
||||||
|
gCircleParent.setAttribute("font-size", "10px"); // At first: font-size: 10px
|
||||||
|
var anim = createAnimSetTo("font-size", "150%");
|
||||||
|
|
||||||
|
gSvg.setCurrentTime(0);
|
||||||
|
is(SMILUtil.getComputedStyleSimple(gCircle, "font-size"), "15px",
|
||||||
|
"Checking animated font-size=150% after animating");
|
||||||
|
|
||||||
|
gCircleParent.setAttribute("font-size", "20px"); // Change: font-size: 20px
|
||||||
|
gSvg.setCurrentTime(0);
|
||||||
|
is(SMILUtil.getComputedStyleSimple(gCircle, "font-size"), "30px",
|
||||||
|
"Checking animated font-size=150% after updating context");
|
||||||
|
|
||||||
|
gCircleParent.removeAttribute("font-size");
|
||||||
|
gCircle.removeChild(gCircle.firstChild);
|
||||||
|
}
|
||||||
|
|
||||||
|
function testPercentUnitChangeOnLength()
|
||||||
|
{
|
||||||
|
setupTest();
|
||||||
|
var oldHeight = gSvg.getAttribute("height");
|
||||||
|
gSvg.setAttribute("height", "100px"); // At first: viewport height: 100px
|
||||||
|
var anim = createAnimSetTo("cy", "100%");
|
||||||
|
|
||||||
|
gSvg.setCurrentTime(0); // Force synchronous sample so animation takes effect
|
||||||
|
// Due to bug 627594 (SVGLength.value for percent value lengths doesn't
|
||||||
|
// reflect updated viewport until reflow) the following will fail.
|
||||||
|
// Check that it does indeed fail so that when that bug is fixed this test
|
||||||
|
// can be updated.
|
||||||
|
todo_is(gCircle.cy.animVal.value, 100,
|
||||||
|
"Checking animated length=100% after animating but before reflow");
|
||||||
|
gSvg.forceRedraw();
|
||||||
|
// Even after doing a reflow though we'll still fail due to bug 508206
|
||||||
|
// (Relative units used in animation don't update immediately)
|
||||||
|
todo_is(gCircle.cy.animVal.value, 100,
|
||||||
|
"Checking animated length=100% after animating but before resampling");
|
||||||
|
gSvg.setCurrentTime(0);
|
||||||
|
// Now we should be up to date
|
||||||
|
is(gCircle.cy.animVal.value, 100,
|
||||||
|
"Checking animated length=100% after animating");
|
||||||
|
|
||||||
|
gSvg.setAttribute("height", "50px"); // Change: height: 50px
|
||||||
|
gSvg.forceRedraw(); // Bug 627594
|
||||||
|
gSvg.setCurrentTime(0); // Bug 508206
|
||||||
|
is(gCircle.cy.animVal.value, 50,
|
||||||
|
"Checking animated length=100% after updating context");
|
||||||
|
|
||||||
|
gSvg.setAttribute("height", oldHeight);
|
||||||
|
gCircle.removeChild(gCircle.firstChild);
|
||||||
|
}
|
||||||
|
|
||||||
|
function testRelativeFontSize()
|
||||||
|
{
|
||||||
|
setupTest();
|
||||||
|
gCircleParent.setAttribute("font-size", "10px"); // At first: font-size: 10px
|
||||||
|
var anim = createAnimSetTo("font-size", "larger");
|
||||||
|
|
||||||
|
gSvg.setCurrentTime(0);
|
||||||
|
var fsize = parseInt(SMILUtil.getComputedStyleSimple(gCircle, "font-size"));
|
||||||
|
// CSS 2 suggests a scaling factor of 1.2 so we should be looking at something
|
||||||
|
// around about 12 or so
|
||||||
|
ok(fsize > 10 && fsize < 20,
|
||||||
|
"Checking animated font-size > 10px after animating");
|
||||||
|
|
||||||
|
gCircleParent.setAttribute("font-size", "20px"); // Change: font-size: 20px
|
||||||
|
gSvg.setCurrentTime(0);
|
||||||
|
fsize = parseInt(SMILUtil.getComputedStyleSimple(gCircle, "font-size"));
|
||||||
|
ok(fsize > 20, "Checking animated font-size > 20px after updating context");
|
||||||
|
|
||||||
|
gCircleParent.removeAttribute("font-size");
|
||||||
|
gCircle.removeChild(gCircle.firstChild);
|
||||||
|
}
|
||||||
|
|
||||||
|
function testRelativeFontWeight()
|
||||||
|
{
|
||||||
|
setupTest();
|
||||||
|
gCircleParent.setAttribute("font-weight", "100"); // At first: font-weight 100
|
||||||
|
var anim = createAnimSetTo("font-weight", "bolder");
|
||||||
|
// CSS 2: 'bolder': Specifies the next weight that is assigned to a font
|
||||||
|
// that is darker than the inherited one. If there is no such weight, it
|
||||||
|
// simply results in the next darker numerical value (and the font remains
|
||||||
|
// unchanged), unless the inherited value was '900', in which case the
|
||||||
|
// resulting weight is also '900'.
|
||||||
|
|
||||||
|
gSvg.setCurrentTime(0);
|
||||||
|
var weight =
|
||||||
|
parseInt(SMILUtil.getComputedStyleSimple(gCircle, "font-weight"));
|
||||||
|
ok(weight > 100, "Checking animated font-weight > 100 after animating");
|
||||||
|
|
||||||
|
gCircleParent.setAttribute("font-weight", "800"); // Change: font-weight 800
|
||||||
|
gSvg.setCurrentTime(0);
|
||||||
|
weight = parseInt(SMILUtil.getComputedStyleSimple(gCircle, "font-weight"));
|
||||||
|
is(weight, 900,
|
||||||
|
"Checking animated font-weight = 900 after updating context");
|
||||||
|
|
||||||
|
gCircleParent.removeAttribute("font-weight");
|
||||||
|
gCircle.removeChild(gCircle.firstChild);
|
||||||
|
}
|
||||||
|
|
||||||
|
function testRelativeFont()
|
||||||
|
{
|
||||||
|
// Test a relative font-size as part of a 'font' spec since the code path
|
||||||
|
// is different in this case
|
||||||
|
// It turns out that, due to the way we store shorthand font properties, we
|
||||||
|
// don't need to worry about marking such values as context-sensitive since we
|
||||||
|
// seem to store them in their relative form. If, however, we change the way
|
||||||
|
// we store shorthand font properties in the future, this will serve as
|
||||||
|
// a useful regression test.
|
||||||
|
setupTest();
|
||||||
|
gCircleParent.setAttribute("font-size", "10px"); // At first: font-size: 10px
|
||||||
|
// We must be sure to set every part of the shorthand property to some
|
||||||
|
// non-context sensitive value because we want to test that even if only the
|
||||||
|
// font-size is relative we will update it appropriately.
|
||||||
|
var anim =
|
||||||
|
createAnimSetTo("font", "normal normal bold larger/normal sans-serif");
|
||||||
|
|
||||||
|
gSvg.setCurrentTime(0);
|
||||||
|
var fsize = parseInt(SMILUtil.getComputedStyleSimple(gCircle, "font-size"));
|
||||||
|
ok(fsize > 10 && fsize < 20,
|
||||||
|
"Checking size of shorthand 'font' > 10px after animating");
|
||||||
|
|
||||||
|
gCircleParent.setAttribute("font-size", "20px"); // Change: font-size: 20px
|
||||||
|
gSvg.setCurrentTime(0);
|
||||||
|
fsize = parseInt(SMILUtil.getComputedStyleSimple(gCircle, "font-size"));
|
||||||
|
ok(fsize > 20,
|
||||||
|
"Checking size of shorthand 'font' > 20px after updating context");
|
||||||
|
|
||||||
|
gCircleParent.removeAttribute("font-size");
|
||||||
|
gCircle.removeChild(gCircle.firstChild);
|
||||||
|
}
|
||||||
|
|
||||||
|
function testCalcFontSize()
|
||||||
|
{
|
||||||
|
setupTest();
|
||||||
|
gCircleParent.setAttribute("font-size", "10px"); // At first: font-size: 10px
|
||||||
|
var anim = createAnimSetTo("font-size", "-moz-calc(110% + 0.1em)");
|
||||||
|
|
||||||
|
gSvg.setCurrentTime(0);
|
||||||
|
var fsize = parseInt(SMILUtil.getComputedStyleSimple(gCircle, "font-size"));
|
||||||
|
// Font size should be 1.1 * 10px + 0.1 * 10px = 12
|
||||||
|
is(fsize, 12, "Checking animated calc font-size == 12px after animating");
|
||||||
|
|
||||||
|
gCircleParent.setAttribute("font-size", "20px"); // Change: font-size: 20px
|
||||||
|
gSvg.setCurrentTime(0);
|
||||||
|
fsize = parseInt(SMILUtil.getComputedStyleSimple(gCircle, "font-size"));
|
||||||
|
is(fsize, 24, "Checking animated calc font-size == 24px after updating " +
|
||||||
|
"context");
|
||||||
|
|
||||||
|
gCircleParent.removeAttribute("font-size");
|
||||||
|
gCircle.removeChild(gCircle.firstChild);
|
||||||
|
}
|
||||||
|
|
||||||
window.addEventListener("load", main, false);
|
window.addEventListener("load", main, false);
|
||||||
]]>
|
]]>
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -57,7 +57,6 @@ _TEST_FILES = \
|
|||||||
a_href_helper_04.svg \
|
a_href_helper_04.svg \
|
||||||
test_animLengthObjectIdentity.xhtml \
|
test_animLengthObjectIdentity.xhtml \
|
||||||
test_animLengthReadonly.xhtml \
|
test_animLengthReadonly.xhtml \
|
||||||
test_animLengthRelativeUnits.xhtml \
|
|
||||||
test_animLengthUnits.xhtml \
|
test_animLengthUnits.xhtml \
|
||||||
test_bbox.xhtml \
|
test_bbox.xhtml \
|
||||||
test_bbox-with-invalid-viewBox.xhtml \
|
test_bbox-with-invalid-viewBox.xhtml \
|
||||||
|
|||||||
@ -1,80 +0,0 @@
|
|||||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
||||||
<!--
|
|
||||||
https://bugzilla.mozilla.org/show_bug.cgi?id=508206
|
|
||||||
-->
|
|
||||||
<head>
|
|
||||||
<title>Test for liveness of relative units in animation</title>
|
|
||||||
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
|
|
||||||
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=508206">Mozilla Bug 508206</a>
|
|
||||||
<p id="display"></p>
|
|
||||||
<!-- XXX The following should be display: none but that's broken by bug 413975
|
|
||||||
where we don't handle percentage lengths when the whole fragment is
|
|
||||||
display: none properly. -->
|
|
||||||
<div id="content" style="visibility: hidden">
|
|
||||||
<svg id="svg" xmlns="http://www.w3.org/2000/svg" width="100px" height="100px"
|
|
||||||
onload="this.pauseAnimations()">
|
|
||||||
<g font-size="10px">
|
|
||||||
<circle cx="0" cy="0" r="15" fill="blue" id="circle">
|
|
||||||
<animate attributeName="cx" from="0" to="10em" dur="10s" begin="0s"
|
|
||||||
fill="freeze" id="animate"/>
|
|
||||||
<animate attributeName="cy" from="0" to="100%" dur="10s" begin="0s"
|
|
||||||
fill="freeze"/>
|
|
||||||
</circle>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<pre id="test">
|
|
||||||
<script class="testbody" type="text/javascript">
|
|
||||||
<![CDATA[
|
|
||||||
/** Test liveness of relative units of animated lengths **/
|
|
||||||
|
|
||||||
/* Global Variables */
|
|
||||||
const svgns="http://www.w3.org/2000/svg";
|
|
||||||
var svg = document.getElementById("svg");
|
|
||||||
var circle = document.getElementById('circle');
|
|
||||||
|
|
||||||
SimpleTest.waitForExplicitFinish();
|
|
||||||
|
|
||||||
function main() {
|
|
||||||
ok(svg.animationsPaused(), "should be paused by <svg> load handler");
|
|
||||||
is(svg.getCurrentTime(), 0, "should be paused at 0 in <svg> load handler");
|
|
||||||
|
|
||||||
// Sample mid-way through the animation
|
|
||||||
svg.setCurrentTime(5);
|
|
||||||
|
|
||||||
// (1) Check values mid-way
|
|
||||||
is(circle.cx.animVal.value, 50,
|
|
||||||
"(1) Unexpected animVal for cx before changing base length");
|
|
||||||
is(circle.cy.animVal.value, 50,
|
|
||||||
"(1) Unexpected animVal for cy before changing base length");
|
|
||||||
|
|
||||||
// (2) Change the frame of reference and check values are updated immediately
|
|
||||||
|
|
||||||
// Change font-size
|
|
||||||
circle.parentNode.setAttribute('font-size', '5px');
|
|
||||||
todo_is(circle.cx.animVal.value, 25,
|
|
||||||
"(2) Unexpected animVal for cx after changing parent font-size");
|
|
||||||
|
|
||||||
// Change the viewport size
|
|
||||||
svg.setAttribute('height', '50px');
|
|
||||||
todo_is(circle.cy.animVal.value, 25,
|
|
||||||
"(2) Unexpected animVal for cy after changing containing viewport size");
|
|
||||||
|
|
||||||
SimpleTest.finish();
|
|
||||||
}
|
|
||||||
|
|
||||||
var animate = document.getElementById('animate');
|
|
||||||
if (animate && animate.targetElement) {
|
|
||||||
window.addEventListener("load", main, false);
|
|
||||||
} else {
|
|
||||||
ok(true); // Skip tests but don't report 'todo' either
|
|
||||||
SimpleTest.finish();
|
|
||||||
}
|
|
||||||
]]>
|
|
||||||
</script>
|
|
||||||
</pre>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
Loading…
Reference in New Issue
Block a user