Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-11-26 14:22:01 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Remove notion of percentage intrinsic size: remove the single case that (incorrectly) sets percentage intrinsic sizes, and fix all of the tests that depend on our old incorrect behavior. (Bug 611099) r=dholbert

Browse Source 
Needed to help CSS 2.1 meet Proposed Recommendation entrance criteria.
This commit is contained in:
L. David Baron 2011-06-12 18:52:32 -07:00
parent d69c8fdc7b
commit 2487c4de1e
24 changed files with 95 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
layout/reftests/svg/as-image/img-novb-height-all-1-ref.html
View File

@ -18,15 +18,15 @@
// <embed> elements.
// * FIRST TWO ROWS: <img> has width=auto height=auto
// - Each <img> renders w/ width = 10% * body_width = .1*600 = 60px
// - Synthesized viewBox has width = 10% * viewport_width = .1*60 = 6
// - Each <img> renders w/ width = 300px (default)
// - Synthesized viewBox has width = 10% * viewport_width = .1*300 = 30
// - <img> & viewBox both get height=30px, from <svg> height attr
svgParams.viewBox = [0, 0, 6, 30],
appendSVGSubArrayWithParams(svgParams, "embed", "60px", "30px");
svgParams.viewBox = [0, 0, 30, 30],
appendSVGSubArrayWithParams(svgParams, "embed", "300px", "30px");
// * SECOND TWO ROWS: <img> has width=auto, height=20px
// Calculations are as above, except <img> now imposes height="20px".
appendSVGSubArrayWithParams(svgParams, "embed", "60px", "20px");
appendSVGSubArrayWithParams(svgParams, "embed", "300px", "20px");
// * THIRD TWO ROWS: <img> has width=30px height=auto
// - <img> now renders w/ width = 30px (imposed by <img> width attr)

12
layout/reftests/svg/as-image/img-novb-width-all-1-ref.html
View File

@ -18,11 +18,11 @@
// <embed> elements.
// * FIRST TWO ROWS: <img> has width=auto height=auto
// - Each <img> renders w/ height = 20% * body_height = .2*600 = 120px
// - Synthesized viewBox has height = 20% * viewport_height = .2*120 = 24
// - Each <img> renders w/ height = 150px (default)
// - Synthesized viewBox has height = 20% * viewport_height = .2*150 = 30
// - <img> & viewBox both get width=20px, from <svg> width attr
svgParams.viewBox = [0, 0, 20, 24],
appendSVGSubArrayWithParams(svgParams, "embed", "20px", "120px");
svgParams.viewBox = [0, 0, 20, 30],
appendSVGSubArrayWithParams(svgParams, "embed", "20px", "150px");
// * SECOND TWO ROWS: <img> has width=auto, height=20px
// - <img> now renders w/ height = 20px (imposed by <img> height attr)
@ -34,8 +34,8 @@
// * THIRD TWO ROWS: <img> has width=30px height=auto
// Calculations are as with "FIRST TWO ROWS", except <img> now imposes
// width="30px".
svgParams.viewBox = [0, 0, 20, 24],
appendSVGSubArrayWithParams(svgParams, "embed", "30px", "120px");
svgParams.viewBox = [0, 0, 20, 30],
appendSVGSubArrayWithParams(svgParams, "embed", "30px", "150px");
// * FOURTH TWO ROWS: <img> has width=30px height=20px
// Calculations are as with "SECOND TWO ROWS", except <img> now imposes

2
layout/reftests/svg/dynamic-rect-04.xhtml
View File

@ -14,6 +14,8 @@ function m() {
svg.style.position = 'absolute';
svg.style.left = '0px';
svg.style.top = '0px';
svg.style.width = '100%';
svg.style.height = '100%';
document.body.appendChild(svg);
var rect = document.createElementNS(SVG_NS, "rect");

4
layout/reftests/svg/sizing/dynamic--inline-resize-cb-height.xhtml
View File

@ -22,7 +22,7 @@ html, body, div {
margin: 0;
width: 100%;
height: 100%; /* inline style override on the div below */
background: red;
background: white;
overflow: hidden;
}
@ -44,7 +44,7 @@ document.addEventListener("MozReftestInvalidate", resize_div, false);
<div style="height:50%;">
<svg xmlns="http://www.w3.org/2000/svg" width="5000" height="100%">
<rect width="100%" height="100%" fill="lime"/>
<rect width="100%" height="100%" fill="blue"/>
</svg>
</div>

4
layout/reftests/svg/sizing/dynamic--inline-resize-cb-width.xhtml
View File

@ -22,7 +22,7 @@ html, body, div {
margin: 0;
width: 100%; /* inline style override on the div below */
height: 100%;
background: red;
background: white;
overflow: hidden;
}
@ -44,7 +44,7 @@ document.addEventListener("MozReftestInvalidate", resize_div, false);
<div style="width:50%;">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="5000">
<rect width="100%" height="100%" fill="lime"/>
<rect width="100%" height="100%" fill="blue"/>
</svg>
</div>

9
layout/reftests/svg/sizing/dynamic--object--auto-auto--pct-px.html
View File

@ -10,10 +10,11 @@
<title>Test: width:auto; height:auto; width="49%" height="70px"</title>
<!--
This testcase checks that the <object> element uses the intrinsic width and
height of the embedded SVG. Since the intrinsic width is 49% and the
intrinsic height is 70px, you should see a blue rectangle 49% wide by 70px
high when viewing this file. You should not see any red.
This testcase checks that the <object> element uses the intrinsic
height of the embedded SVG, but ignores the percentage width. Since
the intrinsic height is 70px, you should see a blue rectangle 300px
(the magic default) wide by 70px high when viewing this file. You
should not see any red.
-->
<style type="text/css">

4
layout/reftests/svg/sizing/inline--position-absolute--02.xhtml
View File

@ -35,11 +35,11 @@ html, body {
<!-- div to expand parent div to a computed height of 20px -->
<div style="height:20px; background:red;"/>
<!-- absolutely positioned SVG - the implicity 100% percentage height
<!-- absolutely positioned SVG - the explicit 100% percentage height
should compute as a percentage of the parent div's computed height,
not as a percentage of the body's height! I.e. no red should show.
-->
<svg xmlns="http://www.w3.org/2000/svg" style="position:absolute; top:0;">
<svg xmlns="http://www.w3.org/2000/svg" style="position:absolute; top:0; width: 100%; height: 100%">
<rect width="100%" height="100%" fill="red"/>
<rect width="100%" height="20px" fill="lime"/>
</svg>

2
layout/reftests/svg/sizing/object--auto-auto--0-pct--ref.html
View File

@ -26,7 +26,7 @@ div {
border: 1px solid blue;
margin: 50px;
width: 0;
height: 49%;
height: 150px;
}
</style>

9
layout/reftests/svg/sizing/object--auto-auto--0-pct.html
View File

@ -10,10 +10,11 @@
<title>Test: width:auto; height:auto; width="0" height="49%"</title>
<!--
This testcase checks that the <object> element uses the intrinsic width and
height of the embedded SVG. Since the intrinsic width is zero and the
intrinsic height is 49%, you should see a 1px blue border around rectangle
0px wide by 49% high when viewing this file. You should not see any red.
This testcase checks that the <object> element uses the intrinsic
width of the embedded SVG but ignores the (percentage) height.
Since the intrinsic width is zero, you should see a 1px blue border
around rectangle 0px wide by 150px high when viewing this file. You
should not see any red.
-->
<style type="text/css">

2
layout/reftests/svg/sizing/object--auto-auto--pct-0--ref.html
View File

@ -25,7 +25,7 @@ div {
padding: 0;
border: 1px solid blue;
margin: 50px;
width: 49%;
width: 300px;
height: 0;
}

10
layout/reftests/svg/sizing/object--auto-auto--pct-0.html
View File

@ -10,11 +10,11 @@
<title>Test: width:auto; height:auto; width="49%" height="0"</title>
<!--
This testcase checks that the <object> element uses the intrinsic width and
height of the embedded SVG. Since the intrinsic width is 49% and the
intrinsic height is zero, you should see a 1px blue border around a
rectangle 49% wide by 0px high when viewing this file. You should not see
any red.
This testcase checks that the <object> element uses the intrinsic
height of the embedded SVG, but ignores the percentage intrinsic
width. Since the intrinsic height is zero, you should see a 1px blue
border around a rectangle 300px wide by 0px high when viewing this
file. You should not see any red.
-->
<style type="text/css">

6
layout/reftests/svg/sizing/reftest.list
View File

@ -303,8 +303,10 @@ random-if(Android) == object--auto-auto--px-px.html object--auto-auto--px
== dynamic--inline-css-height.xhtml pass.svg
== dynamic--inline-css-width.xhtml pass.svg
== dynamic--inline-resize-cb-height.xhtml pass.svg
== dynamic--inline-resize-cb-width.xhtml pass.svg
# These two don't have a whole lot of point anymore now that the meaning
# of percentages has changed.
== dynamic--inline-resize-cb-height.xhtml standalone-sanity-height-150px.svg
== dynamic--inline-resize-cb-width.xhtml standalone-sanity-width-300px.svg
skip == dynamic--inline-resize-window-height.xhtml pass.svg # XXX breaks the reftest run as the window height somehow is not restored
skip == dynamic--inline-resize-window-width.xhtml pass.svg # Fails way too much
fails == dynamic--object-svg-unloaded.xhtml pass.svg

2
layout/reftests/svg/svg-in-foreignObject-01.xhtml
View File

@ -9,7 +9,7 @@
<title>Test percentages dimensions for SVG inside a foreignObject</title>
<foreignObject width="50%" height="50%">
<svg xmlns="http://www.w3.org/2000/svg" width="50%" height="50%">
<svg xmlns="http://www.w3.org/2000/svg" style="width: 50%; height: 50%">
<ellipse cx="50%" cy="50%" rx="50%" ry="50%" fill="blue"/>
</svg>
</foreignObject>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 911 B

After

Width:  |  Height:  |  Size: 918 B

2
layout/reftests/svg/svg-in-foreignObject-02.xhtml
View File

@ -10,7 +10,7 @@
<foreignObject width="50%" height="50%">
<div xmlns="http://www.w3.org/1999/xhtml" style="width:100%;height:100%;">
<svg xmlns="http://www.w3.org/2000/svg" width="50%" height="50%">
<svg xmlns="http://www.w3.org/2000/svg" style="width: 50%; height: 50%">
<ellipse cx="50%" cy="50%" rx="50%" ry="50%" fill="blue"/>
</svg>
</div>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1009 B

After

Width:  |  Height:  |  Size: 1016 B

2
layout/reftests/svg/svg-integration/clipPath-html-06-extref.xhtml
View File

@ -16,7 +16,7 @@
<div style="height:200px; width:100px;"/>
<span class="unit" style="background:lime;"></span>
</span>
<svg:svg height="0">
<svg:svg height="0" style="display: block">
<!-- use an empty g to force clipPath-html-06.xhtml to load before onload -->
<svg:use xlink:href="clipPath-html-06.xhtml#empty" />
</svg:svg>

2
layout/reftests/svg/svg-integration/clipPath-html-06.xhtml
View File

@ -17,7 +17,7 @@
<span class="unit" style="background:lime;"></span>
</span>
<svg:svg height="0">
<svg:svg height="0" style="display: block">
<!-- so that other documents can svg:use this one and force it to
load before onload -->
<svg:g id="empty" />

2
layout/reftests/svg/svg-integration/conditions-outer-svg-01.xhtml
View File

@ -7,7 +7,7 @@
<head>
<title>Test that conditional processing attributes on outer 'svg' elements are honored</title>
<!-- https://bugzilla.mozilla.org/show_bug.cgi?id=615146 -->
<style>svg { position: absolute; top: 0; left: 0 }</style>
<style>svg { position: absolute; top: 0; left: 0; height: 100%; width: 100% }</style>
</head>
<body>

2
layout/reftests/svg/svg-integration/conditions-outer-svg-02.xhtml
View File

@ -8,7 +8,7 @@
<head>
<title>Test that using elements from conditional-failing outer 'svg' elements works</title>
<!-- https://bugzilla.mozilla.org/show_bug.cgi?id=615146 -->
<style>svg { position: absolute; top: 0; left: 0 }</style>
<style>svg { position: absolute; top: 0; left: 0; height: 100%; width: 100% }</style>
</head>
<body>

2
layout/reftests/svg/svg-integration/dynamic-conditions-outer-svg-01.xhtml
View File

@ -7,7 +7,7 @@
<head>
<title>Test that conditional processing attributes on outer 'svg' elements are honored</title>
<!-- https://bugzilla.mozilla.org/show_bug.cgi?id=615146 -->
<style>svg { position: absolute; top: 0; left: 0 }</style>
<style>svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
</head>
<body onload="document.getElementById('a').setAttribute('requiredExtensions', 'x')">

2
layout/reftests/svg/svg-integration/dynamic-conditions-outer-svg-02.xhtml
View File

@ -7,7 +7,7 @@
<head>
<title>Test that conditional processing attributes on outer 'svg' elements are honored</title>
<!-- https://bugzilla.mozilla.org/show_bug.cgi?id=615146 -->
<style>svg { position: absolute; top: 0; left: 0 }</style>
<style>svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
</head>
<body onload="document.getElementById('a').removeAttribute('requiredExtensions')">

2
layout/reftests/svg/svg-integration/dynamic-conditions-outer-svg-03.xhtml
View File

@ -7,7 +7,7 @@
<head>
<title>Test that conditional processing attributes on outer 'svg' elements are honored</title>
<!-- https://bugzilla.mozilla.org/show_bug.cgi?id=615146 -->
<style>svg { position: absolute; top: 0; left: 0 }</style>
<style>svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
</head>
<body onload="document.getElementById('a').setAttribute('requiredFeatures', 'x')">

2
layout/reftests/svg/svg-integration/dynamic-conditions-outer-svg-04.xhtml
View File

@ -7,7 +7,7 @@
<head>
<title>Test that conditional processing attributes on outer 'svg' elements are honored</title>
<!-- https://bugzilla.mozilla.org/show_bug.cgi?id=615146 -->
<style>svg { position: absolute; top: 0; left: 0 }</style>
<style>svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
</head>
<body onload="document.getElementById('a').setAttribute('requiredFeatures', 'http://www.w3.org/TR/SVG11/feature#Gradient')">

60
layout/svg/base/src/nsSVGOuterSVGFrame.cpp
View File

@ -248,21 +248,13 @@ nsSVGOuterSVGFrame::GetIntrinsicSize()
nsSVGLength2 &width = content->mLengthAttributes[nsSVGSVGElement::WIDTH];
nsSVGLength2 &height = content->mLengthAttributes[nsSVGSVGElement::HEIGHT];
if (width.IsPercentage()) {
float val = width.GetAnimValInSpecifiedUnits() / 100.0f;
if (val < 0.0f) val = 0.0f;
intrinsicSize.width.SetPercentValue(val);
} else {
if (!width.IsPercentage()) {
nscoord val = nsPresContext::CSSPixelsToAppUnits(width.GetAnimValue(content));
if (val < 0) val = 0;
intrinsicSize.width.SetCoordValue(val);
}
if (height.IsPercentage()) {
float val = height.GetAnimValInSpecifiedUnits() / 100.0f;
if (val < 0.0f) val = 0.0f;
intrinsicSize.height.SetPercentValue(val);
} else {
if (!height.IsPercentage()) {
nscoord val = nsPresContext::CSSPixelsToAppUnits(height.GetAnimValue(content));
if (val < 0) val = 0;
intrinsicSize.height.SetCoordValue(val);
@ -318,16 +310,52 @@ nsSVGOuterSVGFrame::ComputeSize(nsRenderingContext *aRenderingContext,
{
nsSVGSVGElement* content = static_cast<nsSVGSVGElement*>(mContent);
if ((content->HasValidViewbox() || content->ShouldSynthesizeViewBox()) &&
(IsRootOfImage() || IsRootOfReplacedElementSubDoc())) {
// The embedding element has done the replaced element sizing, using our
// intrinsic dimensions as necessary. We just need to fill the viewport.
return aCBSize;
IntrinsicSize intrinsicSize = GetIntrinsicSize();
if (!mContent->GetParent()) {
if (IsRootOfImage() || IsRootOfReplacedElementSubDoc()) {
// The embedding element has done the replaced element sizing,
// using our intrinsic dimensions as necessary. We just need to
// fill the viewport.
return aCBSize;
} else {
// We're the root of a browsing context, so we need to honor
// widths and heights in percentages. (GetIntrinsicSize() doesn't
// report these since there's no such thing as a percentage
// intrinsic size.)
nsSVGLength2 &width =
content->mLengthAttributes[nsSVGSVGElement::WIDTH];
if (width.IsPercentage()) {
NS_ABORT_IF_FALSE(intrinsicSize.width.GetUnit() == eStyleUnit_None,
"GetIntrinsicSize should have reported no "
"intrinsic width");
float val = width.GetAnimValInSpecifiedUnits() / 100.0f;
if (val < 0.0f) val = 0.0f;
intrinsicSize.width.SetCoordValue(val * aCBSize.width);
}
nsSVGLength2 &height =
content->mLengthAttributes[nsSVGSVGElement::HEIGHT];
NS_ABORT_IF_FALSE(aCBSize.height != NS_AUTOHEIGHT,
"root should not have auto-height containing block");
if (height.IsPercentage()) {
NS_ABORT_IF_FALSE(intrinsicSize.height.GetUnit() == eStyleUnit_None,
"GetIntrinsicSize should have reported no "
"intrinsic height");
float val = height.GetAnimValInSpecifiedUnits() / 100.0f;
if (val < 0.0f) val = 0.0f;
intrinsicSize.height.SetCoordValue(val * aCBSize.height);
}
NS_ABORT_IF_FALSE(intrinsicSize.height.GetUnit() == eStyleUnit_Coord &&
intrinsicSize.width.GetUnit() == eStyleUnit_Coord,
"We should have just handled the only situation where"
"we lack an intrinsic height or width.");
}
}
return nsLayoutUtils::ComputeSizeWithIntrinsicDimensions(
aRenderingContext, this,
GetIntrinsicSize(), GetIntrinsicRatio(), aCBSize,
intrinsicSize, GetIntrinsicRatio(), aCBSize,
aMargin, aBorder, aPadding);
}

2
parser/htmlparser/tests/reftest/bug577418-1.html
View File

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html style="width:100%;height:100%;margin:0;border:0;overflow:hidden">
<body style="width:100%;height:100%;margin:0;border:0;overflow:hidden">
<svg>
<svg style="width:100%;height:100%">
<rect height="100%" width="100%" fill="red"/>
<foreignObject>
<html>