Bug 570896: Allow separate background-origin and background-clip to be set in the background shorthand. r=bzbarsky

This commit is contained in:
L. David Baron 2013-03-07 17:59:32 -08:00
parent deb161f139
commit 6301e3b6dc
4 changed files with 52 additions and 21 deletions

View File

@ -461,9 +461,12 @@ Declaration::GetValue(nsCSSProperty aProperty, nsAString& aValue) const
if (clip->mValue.GetIntValue() != NS_STYLE_BG_CLIP_BORDER ||
origin->mValue.GetIntValue() != NS_STYLE_BG_ORIGIN_PADDING) {
// The shorthand only has a single clip/origin value which sets
// both properties. So if they're different (and non-default),
// we can't represent the state using the shorthand.
MOZ_ASSERT(nsCSSProps::kKeywordTableTable[
eCSSProperty_background_origin] ==
nsCSSProps::kBackgroundOriginKTable);
MOZ_ASSERT(nsCSSProps::kKeywordTableTable[
eCSSProperty_background_clip] ==
nsCSSProps::kBackgroundOriginKTable);
MOZ_STATIC_ASSERT(NS_STYLE_BG_CLIP_BORDER ==
NS_STYLE_BG_ORIGIN_BORDER &&
NS_STYLE_BG_CLIP_PADDING ==
@ -471,13 +474,13 @@ Declaration::GetValue(nsCSSProperty aProperty, nsAString& aValue) const
NS_STYLE_BG_CLIP_CONTENT ==
NS_STYLE_BG_ORIGIN_CONTENT,
"bg-clip and bg-origin style constants must agree");
if (clip->mValue != origin->mValue) {
aValue.Truncate();
return;
}
aValue.Append(PRUnichar(' '));
clip->mValue.AppendToString(eCSSProperty_background_clip, aValue);
origin->mValue.AppendToString(eCSSProperty_background_origin, aValue);
if (clip->mValue != origin->mValue) {
aValue.Append(PRUnichar(' '));
clip->mValue.AppendToString(eCSSProperty_background_clip, aValue);
}
}
image = image->mNext;

View File

@ -6618,12 +6618,12 @@ CSSParserImpl::ParseBackgroundItem(CSSParserImpl::BackgroundParseState& aState)
aState.mSize->mYValue.SetAutoValue();
bool haveColor = false,
haveImage = false,
haveRepeat = false,
haveAttach = false,
havePositionAndSize = false,
haveOrigin = false,
haveSomething = false;
haveImage = false,
haveRepeat = false,
haveAttach = false,
havePositionAndSize = false,
haveOrigin = false,
haveSomething = false;
while (GetToken(true)) {
nsCSSTokenType tt = mToken.mType;
@ -6698,6 +6698,17 @@ CSSParserImpl::ParseBackgroundItem(CSSParserImpl::BackgroundParseState& aState)
NS_NOTREACHED("should be able to parse");
return false;
}
// The spec allows a second box value (for background-clip),
// immediately following the first one (for background-origin).
// 'background-clip' and 'background-origin' use the same keyword table
MOZ_ASSERT(nsCSSProps::kKeywordTableTable[
eCSSProperty_background_origin] ==
nsCSSProps::kBackgroundOriginKTable);
MOZ_ASSERT(nsCSSProps::kKeywordTableTable[
eCSSProperty_background_clip] ==
nsCSSProps::kBackgroundOriginKTable);
MOZ_STATIC_ASSERT(NS_STYLE_BG_CLIP_BORDER ==
NS_STYLE_BG_ORIGIN_BORDER &&
NS_STYLE_BG_CLIP_PADDING ==
@ -6706,7 +6717,13 @@ CSSParserImpl::ParseBackgroundItem(CSSParserImpl::BackgroundParseState& aState)
NS_STYLE_BG_ORIGIN_CONTENT,
"bg-clip and bg-origin style constants must agree");
aState.mClip->mValue = aState.mOrigin->mValue;
if (!ParseSingleValueProperty(aState.mClip->mValue,
eCSSProperty_background_clip)) {
// When exactly one <box> value is set, it is used for both
// 'background-origin' and 'background-clip'.
// See assertions above showing these values are compatible.
aState.mClip->mValue = aState.mOrigin->mValue;
}
} else {
if (haveColor)
return false;

View File

@ -1325,6 +1325,9 @@ var gCSSProperties = {
"url(404.png) green padding-box",
"url(404.png) border-box transparent",
"content-box url(404.png) blue",
"url(404.png) green padding-box padding-box",
"url(404.png) green padding-box border-box",
"content-box border-box url(404.png) blue",
],
invalid_values: [
/* mixes with keywords have to be in correct order */
@ -1351,6 +1354,11 @@ var gCSSProperties = {
/* bug 513395: old syntax for gradients */
"-moz-radial-gradient(10% bottom, 30px, 20px 20px, 10px, from(#ffffff), to(black)) scroll no-repeat",
"-moz-linear-gradient(10px 10px, 20px 20px, from(red), to(blue)) repeat",
/* clip and origin separated in the shorthand */
"url(404.png) padding-box green border-box",
"url(404.png) padding-box green padding-box",
"transparent padding-box url(404.png) border-box",
"transparent padding-box url(404.png) padding-box",
]
},
"background-attachment": {

View File

@ -107,9 +107,8 @@ is(e.style.font, "", "should not have font shorthand");
e.setAttribute("style", "font: medium serif; font-stretch: condensed");
is(e.style.font, "", "should not have font shorthand");
// For background, we can only express the value as a shorthand if
// origin and clip are both their default, or if they're both the same.
// ... or at least we will once we support them in the shorthand.
// Test that all combinations of background-clip and background-origin
// can be expressed in the shorthand (which wasn't the case previously).
e.setAttribute("style", "background: red");
isnot(e.style.background, "", "should have background shorthand");
e.setAttribute("style", "background: red; background-origin: border-box");
@ -117,17 +116,21 @@ isnot(e.style.background, "", "should have background shorthand (origin:border-b
e.setAttribute("style", "background: red; background-clip: padding-box");
isnot(e.style.background, "", "should have background shorthand (clip:padding-box)");
e.setAttribute("style", "background: red; background-origin: content-box");
is(e.style.background, "", "should not have background shorthand (origin:content-box)");
isnot(e.style.background, "", "should have background shorthand (origin:content-box)");
e.setAttribute("style", "background: red; background-clip: content-box");
is(e.style.background, "", "should not have background shorthand (clip:content-box)");
isnot(e.style.background, "", "should have background shorthand (clip:content-box)");
e.setAttribute("style", "background: red; background-clip: content-box; background-origin: content-box;");
isnot(e.style.background, "", "should have background shorthand (clip:content-box;origin:content-box)");
// Test background-size in the background shorthand.
e.setAttribute("style", "background: red; background-size: 100% 100%");
isnot(e.style.background, "", "should have background shorthand (size:100% 100%)");
e.setAttribute("style", "background: red; background-size: 100% auto");
isnot(e.style.background, "", "should have background shorthand (size:100% auto)");
e.setAttribute("style", "background: red; background-size: auto 100%");
isnot(e.style.background, "", "should have background shorthand (size:auto 100%)");
// Test background-inline-policy not interacting with the background shorthand.
e.setAttribute("style", "background: red; -moz-background-inline-policy: each-box");
isnot(e.style.background, "", "should have background shorthand (-moz-background-inline-policy not relevant)");