Make outlines on inlines containing blocks outline the blocks. b=424236,270191 r+sr=roc

This commit is contained in:
L. David Baron 2008-06-02 15:52:25 -07:00
parent 9acf41987d
commit 80ef4ff3cb
22 changed files with 455 additions and 9 deletions

View File

@ -24,6 +24,7 @@
* Mats Palmgren <mats.palmgren@bredband.net>
* Takeshi Ichimaru <ayakawa.m@gmail.com>
* Masayuki Nakano <masayuki@d-toybox.com>
* L. David Baron <dbaron@dbaron.org>, Mozilla Corporation
*
* Alternatively, the contents of this file may be used under the terms of
* either of the GNU General Public License Version 2 or later (the "GPL"),
@ -52,6 +53,7 @@
#include "nsFrameManager.h"
#include "nsStyleContext.h"
#include "nsGkAtoms.h"
#include "nsCSSAnonBoxes.h"
#include "nsTransform2D.h"
#include "nsIDeviceContext.h"
#include "nsIContent.h"
@ -2857,9 +2859,7 @@ nsCSSRendering::PaintOutline(nsPresContext* aPresContext,
// Get our style context's color struct.
const nsStyleColor* ourColor = aStyleContext->GetStyleColor();
nscoord width, offset;
float percent;
nscoord width;
aOutlineStyle.GetOutlineWidth(width);
if (width == 0) {
@ -2882,8 +2882,10 @@ nsCSSRendering::PaintOutline(nsPresContext* aPresContext,
switch (bordStyleRadius[i].GetUnit()) {
case eStyleUnit_Percent:
percent = bordStyleRadius[i].GetPercentValue();
twipsRadii[i] = (nscoord)(percent * aBorderArea.width);
{
float percent = bordStyleRadius[i].GetPercentValue();
twipsRadii[i] = (nscoord)(percent * aBorderArea.width);
}
break;
case eStyleUnit_Coord:
@ -2895,10 +2897,42 @@ nsCSSRendering::PaintOutline(nsPresContext* aPresContext,
}
}
nsRect overflowArea = aForFrame->GetOverflowRect();
// get the offset for our outline
nscoord offset;
aOutlineStyle.GetOutlineOffset(offset);
// When the outline property is set on :-moz-anonymous-block or
// :-moz-anonyomus-positioned-block pseudo-elements, it inherited that
// outline from the inline that was broken because it contained a
// block. In that case, we don't want a really wide outline if the
// block inside the inline is narrow, so union the actual contents of
// the anonymous blocks.
nsIFrame *frameForArea = aForFrame;
do {
nsIAtom *pseudoType = frameForArea->GetStyleContext()->GetPseudoType();
if (pseudoType != nsCSSAnonBoxes::mozAnonymousBlock &&
pseudoType != nsCSSAnonBoxes::mozAnonymousPositionedBlock)
break;
// If we're done, we really want it and all its later siblings.
frameForArea = frameForArea->GetFirstChild(nsnull);
NS_ASSERTION(frameForArea, "anonymous block with no children?");
} while (frameForArea);
nsRect overflowArea;
if (frameForArea == aForFrame) {
overflowArea = aForFrame->GetOverflowRect();
} else {
for (; frameForArea; frameForArea = frameForArea->GetNextSibling()) {
// The outline has already been included in aForFrame's overflow
// area, but not in those of its descendants, so we have to
// include it. Otherwise we'll end up drawing the outline inside
// the border.
nsRect r(frameForArea->GetOverflowRect() +
frameForArea->GetOffsetTo(aForFrame));
nscoord delta = PR_MAX(offset + width, 0);
r.Inflate(delta, delta);
overflowArea.UnionRect(overflowArea, r);
}
}
nsRect outerRect(overflowArea + aBorderArea.TopLeft());
nsRect innerRect(outerRect);
if (width + offset >= 0) {

View File

@ -0,0 +1,22 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
body > span { outline: 1px dotted black; }
/* can't compare to border combined with negative margin because of
margin collapsing */
body > div { display: block; outline: 1px dotted black; }
</style>
</head>
<body>
<span></span><div>text</div>
</body>
</html>

View File

@ -0,0 +1,20 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
body > span { outline: 1px dotted black; }
body > span > span { display: block; }
</style>
</head>
<body>
<span><span>text</span></span>
</body>
</html>

View File

@ -6,7 +6,7 @@
html, body { margin: 0; padding: 0.25em; }
body > div { background:aqua; }
body > div > div { margin: 0 1em; }
body > div > div { outline: 1px dotted black; margin: 0 1em; }
</style>
</head>

View File

@ -0,0 +1,22 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
body > span { outline: 1px dotted black; }
/* can't compare to border combined with negative margin because of
margin collapsing */
body > div { display: block; outline: 1px dotted black; }
</style>
</head>
<body>
&nbsp;&nbsp;<span>A</span><div>B</div><span>C</span>
</body>
</html>

View File

@ -0,0 +1,20 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
body > span { outline: 1px dotted black; }
body > span > span { display: block; }
</style>
</head>
<body>
&nbsp;&nbsp;<span>A<span>B</span>C</span>
</body>
</html>

View File

@ -0,0 +1,23 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
* { -moz-outline-offset: 5px; outline-offset: 5px; }
body > span { outline: 1px dotted black; }
/* can't compare to border combined with negative margin because of
margin collapsing */
body > div { display: block; outline: 1px dotted black; width: 5em; }
</style>
</head>
<body>
<span></span><div>text</div>
</body>
</html>

View File

@ -0,0 +1,21 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
* { -moz-outline-offset: 5px; outline-offset: 5px; }
body > span { outline: 1px dotted black; }
body > span > span { display: block; width: 5em; }
</style>
</head>
<body>
<span><span>text</span></span>
</body>
</html>

View File

@ -0,0 +1,22 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
body > span { outline: 1px dotted black; }
/* can't compare to border combined with negative margin because of
margin collapsing */
body > div { display: block; outline: 1px dotted black; width: 10em; }
</style>
</head>
<body>
<span></span><div>text</div>
</body>
</html>

View File

@ -0,0 +1,21 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
body { width: 5em; }
body > span { outline: 1px dotted black; }
body > span > span { display: block; width: 10em; }
</style>
</head>
<body>
<span><span>text</span></span>
</body>
</html>

View File

@ -0,0 +1,23 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
* { -moz-outline-offset: -2px; outline-offset: -2px; }
body > span { outline: 1px dotted black; }
/* can't compare to border combined with negative margin because of
margin collapsing */
body > div { display: block; outline: 1px dotted black; width: 15em; }
</style>
</head>
<body>
<span></span><div>text<br>text<br>text</div>
</body>
</html>

View File

@ -0,0 +1,23 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
* { -moz-outline-offset: -2px; outline-offset: -2px; }
body > span { outline: 1px dotted black; }
body > span > span { display: block; width: 10em; }
body > span > span + span { width: 5em; }
body > span > span + span + span { width: 15em; }
</style>
</head>
<body>
<span><span>text</span><span>text</span><span>text</span></span>
</body>
</html>

View File

@ -0,0 +1,24 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
body > span { outline: 1px dotted black; }
/* can't compare to border combined with negative margin because of
margin collapsing */
body > div { display: block; outline: 1px dotted black; }
body > div > div { text-align: right; }
body > div > div > span { display: inline-block; width: 5em; text-align: left; }
</style>
</head>
<body>
<span></span><div>text<div><span>text</span></div></div>
</body>
</html>

View File

@ -0,0 +1,21 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
body > span { outline: 1px dotted black; }
body > span > span { display: block; width: 5em; }
body > span > span + span { margin-left: auto; }
</style>
</head>
<body>
<span><span>text</span><span>text</span></span>
</body>
</html>

View File

@ -0,0 +1,22 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
body > span { outline: 1px dotted black; }
/* can't compare to border combined with negative margin because of
margin collapsing */
body > div { display: block; outline: 1px dotted black; width: 5em; margin-left: auto; margin-right: auto; }
</style>
</head>
<body>
<span></span><div>text</div>
</body>
</html>

View File

@ -0,0 +1,20 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
body > span { outline: 1px dotted black; }
body > span > span { display: block; width: 5em; margin-right: auto; margin-left: auto; }
</style>
</head>
<body>
<span><span>text</span></span>
</body>
</html>

View File

@ -0,0 +1,23 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
* { -moz-outline-offset: 3px; outline-offset: 3px; }
body > span { outline: 1px dotted black; }
/* can't compare to border combined with negative margin because of
margin collapsing */
body > div { display: block; outline: 1px dotted black; width: 15em; }
</style>
</head>
<body>
<span></span><div>text<br>text<br>text</div>
</body>
</html>

View File

@ -0,0 +1,23 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
* { -moz-outline-offset: 3px; outline-offset: 3px; }
body > span { outline: 1px dotted black; }
body > span > span { display: block; width: 10em; }
body > span > span + span { display:inline; }
body > span > span + span + span { display: block; width: 15em; }
</style>
</head>
<body>
<span><span>text</span><span>text</span><span>text</span></span>
</body>
</html>

View File

@ -0,0 +1,23 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
* { -moz-outline-offset: -1px; outline-offset: -1px; }
body > span { outline: 1px dotted black; }
/* can't compare to border combined with negative margin because of
margin collapsing */
body > div { display: block; outline: 1px dotted black; width: -moz-max-content; width: max-content; }
</style>
</head>
<body>
<span></span><div>text<br>Some words that must be wider than 10em<br>text</div>
</body>
</html>

View File

@ -0,0 +1,24 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
<title>reftest, bug 424236</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
body { font-size: 16px; }
* { -moz-outline-offset: -1px; outline-offset: -1px; }
body > span { outline: 1px dotted black; }
body > span > span { display: block; width: 10em; }
body > span > span + span { display:inline; }
body > span > span + span + span { display: block; width: 5em; }
</style>
</head>
<body>
<span><span>text</span><span>Some words that must be wider than 10em</span><span>text</span></span>
</body>
</html>

View File

@ -802,6 +802,15 @@ skip-if(MOZ_WIDGET_TOOLKIT=="cocoa") == 413292-1.html 413292-1-ref.html # disabl
== 424074-1.xul 424074-1-ref.xul
!= 424074-1.xul 424074-1-ref2.xul
fails-if(MOZ_WIDGET_TOOLKIT=="gtk2") == 424074-1-ref2.xul 424074-1-ref3.xul
== 424236-1.html 424236-1-ref.html
== 424236-2.html 424236-2-ref.html
== 424236-3.html 424236-3-ref.html
== 424236-4.html 424236-4-ref.html
== 424236-5.html 424236-5-ref.html
== 424236-6.html 424236-6-ref.html
== 424236-7.html 424236-7-ref.html
== 424236-8.html 424236-8-ref.html
== 424236-9.html 424236-9-ref.html
== 424236-10.html 424236-10-ref.html
== 424434-1.html 424434-1-ref.html
== 424631-1.html 424631-1-ref.html

View File

@ -130,6 +130,12 @@
position: static !important;
}
*|*::-moz-anonymous-block, *|*::-moz-anonymous-positioned-block {
/* we currently inherit from the inline that is split */
outline: inherit;
-moz-outline-offset: inherit;
}
*|*::-moz-xul-anonymous-block {
display: block ! important;
position: static ! important;