Title: [136683] trunk
Revision
136683
Author
[email protected]
Date
2012-12-05 07:10:32 -0800 (Wed, 05 Dec 2012)

Log Message

[CSS3 Backgrounds and Borders] Allow the CSS3 background position offset for background shorthand.
https://bugs.webkit.org/show_bug.cgi?id=104014

Reviewed by Dirk Schulze.

Source/WebCore:

Add the support of the new <position> type if set from within the
background shorthand. The patch just modify the way we count the values
of the current context by checking wether we encounter a comma (it is
then the next background layer), or if we encounter a '/' (which is in the
background shorthand context the background-size) or any value that is
not a valid background-position keyword or length (which means we are
already parsing the next property of the background shorthand).

Tests: LayoutTests/fast/backgrounds/background-position-parsing-2.html
has been modified to cover this use case.

* css/CSSParser.cpp:
(WebCore::CSSParser::isPositionValue):
(WebCore):
(WebCore::CSSParser::parseFillBackgroundPosition):
(WebCore::CSSParser::parseFillProperty):
* css/CSSParser.h:

LayoutTests:

Extend the current parsing tests of background-position to cover the
case when it is set part of the background shorthand.

* fast/backgrounds/background-position-parsing-2-expected.txt:
* fast/backgrounds/background-position-parsing-2.html:

Modified Paths

Diff

Modified: trunk/LayoutTests/ChangeLog (136682 => 136683)


--- trunk/LayoutTests/ChangeLog	2012-12-05 14:30:57 UTC (rev 136682)
+++ trunk/LayoutTests/ChangeLog	2012-12-05 15:10:32 UTC (rev 136683)
@@ -1,3 +1,16 @@
+2012-12-05  Alexis Menard  <[email protected]>
+
+        [CSS3 Backgrounds and Borders] Allow the CSS3 background position offset for background shorthand.
+        https://bugs.webkit.org/show_bug.cgi?id=104014
+
+        Reviewed by Dirk Schulze.
+
+        Extend the current parsing tests of background-position to cover the
+        case when it is set part of the background shorthand.
+
+        * fast/backgrounds/background-position-parsing-2-expected.txt:
+        * fast/backgrounds/background-position-parsing-2.html:
+
 2012-12-06  Keishi Hattori  <[email protected]>
 
         [Chromium] Rebaseline suggestion picker tests because of CSS change in r136674

Modified: trunk/LayoutTests/fast/backgrounds/background-position-parsing-2-expected.txt (136682 => 136683)


--- trunk/LayoutTests/fast/backgrounds/background-position-parsing-2-expected.txt	2012-12-05 14:30:57 UTC (rev 136682)
+++ trunk/LayoutTests/fast/backgrounds/background-position-parsing-2-expected.txt	2012-12-05 15:10:32 UTC (rev 136683)
@@ -195,6 +195,68 @@
 PASS computedStyle.backgroundPosition is 'right 0% top 15px, right 20px bottom 0%'
 PASS style.backgroundPosition is 'right 0% top 15px, right 20px bottom 0%'
 PASS computedStyle.backgroundPosition is 'right 0% top 15px, right 20px bottom 0%'
+background-position inside the background shorthand
+PASS style.background is 'left 30% top 10% / 10em round fixed border-box border-box gray'
+PASS computedStyle.background is 'rgb(128, 128, 128) none round fixed left 30% top 10% / 160px border-box border-box'
+PASS style.background is 'right 0% top 15px / 10em round fixed border-box border-box gray'
+PASS computedStyle.background is 'rgb(128, 128, 128) none round fixed right 0% top 15px / 160px border-box border-box'
+PASS style.background is 'left 10px top 50% / 10em round fixed border-box border-box gray'
+PASS computedStyle.background is 'rgb(128, 128, 128) none round fixed left 10px top 50% / 160px border-box border-box'
+PASS style.background is 'left 10px top 50% round fixed border-box border-box'
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none round fixed left 10px top 50% / auto border-box border-box'
+PASS style.background is 'left 50% top 20px round fixed border-box border-box'
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none round fixed left 50% top 20px / auto border-box border-box'
+PASS style.background is 'left 50% top 20px round fixed border-box border-box'
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none round fixed left 50% top 20px / auto border-box border-box'
+PASS style.background is '50% 0% round fixed border-box border-box'
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none round fixed 50% 0% / auto border-box border-box'
+PASS style.background is '50px 60px / 50px round fixed border-box border-box'
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none round fixed 50px 60px / 50px border-box border-box'
+PASS style.background is '50px 50% / 50px round fixed border-box border-box'
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none round fixed 50px 50% / 50px border-box border-box'
+PASS style.background is 'left 0% top 60px / 50px round fixed border-box border-box'
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none round fixed left 0% top 60px / 50px border-box border-box'
+PASS style.background is 'left -20px top 60px / 50px round fixed border-box border-box'
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none round fixed left -20px top 60px / 50px border-box border-box'
+PASS style.background is 'left 20px top 0% / 50px round fixed border-box border-box'
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none round fixed left 20px top 0% / 50px border-box border-box'
+PASS style.background is 'left 20px top 0% / 50px round fixed border-box border-box'
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none round fixed left 20px top 0% / 50px border-box border-box'
+PASS style.background is 'left 20px top 40px / 50px round fixed border-box border-box'
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none round fixed left 20px top 40px / 50px border-box border-box'
+PASS style.background is 'left 20px top 40px round fixed border-box border-box'
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none round fixed left 20px top 40px / auto border-box border-box'
+PASS style.background is 'left 30% top 10% round fixed border-box border-box gray'
+PASS computedStyle.background is 'rgb(128, 128, 128) none round fixed left 30% top 10% / auto border-box border-box'
+background-position inside the background shorthand, some invalid cases, no changes expected
+PASS style.background is ''
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'
+PASS style.background is ''
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'
+PASS style.background is ''
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'
+PASS style.background is ''
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'
+PASS style.background is ''
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'
+PASS style.background is ''
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'
+PASS style.background is ''
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'
+PASS style.background is ''
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'
+PASS style.background is ''
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'
+PASS style.background is ''
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'
+PASS style.background is ''
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'
+PASS style.background is ''
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'
+PASS style.background is ''
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'
+PASS style.background is ''
+PASS computedStyle.background is 'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'
 PASS successfullyParsed is true
 
 TEST COMPLETE

Modified: trunk/LayoutTests/fast/backgrounds/background-position-parsing-2.html (136682 => 136683)


--- trunk/LayoutTests/fast/backgrounds/background-position-parsing-2.html	2012-12-05 14:30:57 UTC (rev 136682)
+++ trunk/LayoutTests/fast/backgrounds/background-position-parsing-2.html	2012-12-05 15:10:32 UTC (rev 136683)
@@ -402,6 +402,130 @@
 shouldBe("style.backgroundPosition", "'right 0% top 15px, right 20px bottom 0%'");
 shouldBe("computedStyle.backgroundPosition", "'right 0% top 15px, right 20px bottom 0%'");
 
+debug("background-position inside the background shorthand");
+style.background = "" 10% left 30% / 10em gray round fixed border-box";
+shouldBe("style.background", "'left 30% top 10% / 10em round fixed border-box border-box gray'");
+shouldBe("computedStyle.background", "'rgb(128, 128, 128) none round fixed left 30% top 10% / 160px border-box border-box'");
+
+style.background = "" top 15px / 10em gray round fixed border-box";
+shouldBe("style.background", "'right 0% top 15px / 10em round fixed border-box border-box gray'");
+shouldBe("computedStyle.background", "'rgb(128, 128, 128) none round fixed right 0% top 15px / 160px border-box border-box'");
+
+style.background = "" 10px center / 10em gray round fixed border-box";
+shouldBe("style.background", "'left 10px top 50% / 10em round fixed border-box border-box gray'");
+shouldBe("computedStyle.background", "'rgb(128, 128, 128) none round fixed left 10px top 50% / 160px border-box border-box'");
+
+style.background = "" 10px center round fixed border-box";
+shouldBe("style.background", "'left 10px top 50% round fixed border-box border-box'");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none round fixed left 10px top 50% / auto border-box border-box'");
+
+style.background = "" top 20px round fixed border-box";
+shouldBe("style.background", "'left 50% top 20px round fixed border-box border-box'");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none round fixed left 50% top 20px / auto border-box border-box'");
+
+style.background = "" 20px center round fixed border-box";
+shouldBe("style.background", "'left 50% top 20px round fixed border-box border-box'");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none round fixed left 50% top 20px / auto border-box border-box'");
+
+style.background = "" center round fixed border-box";
+shouldBe("style.background", "'50% 0% round fixed border-box border-box'");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none round fixed 50% 0% / auto border-box border-box'");
+
+style.background = "" 60px / 50px round fixed border-box";
+shouldBe("style.background", "'50px 60px / 50px round fixed border-box border-box'");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none round fixed 50px 60px / 50px border-box border-box'");
+
+style.background = "" / 50px round fixed border-box";
+shouldBe("style.background", "'50px 50% / 50px round fixed border-box border-box'");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none round fixed 50px 50% / 50px border-box border-box'");
+
+style.background = "" top 60px / 50px round fixed border-box";
+shouldBe("style.background", "'left 0% top 60px / 50px round fixed border-box border-box'");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none round fixed left 0% top 60px / 50px border-box border-box'");
+
+style.background = "" -20px top 60px / 50px round fixed border-box";
+shouldBe("style.background", "'left -20px top 60px / 50px round fixed border-box border-box'");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none round fixed left -20px top 60px / 50px border-box border-box'");
+
+style.background = "" left 20px top / 50px round fixed";
+shouldBe("style.background", "'left 20px top 0% / 50px round fixed border-box border-box'");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none round fixed left 20px top 0% / 50px border-box border-box'");
+
+style.background = "" round fixed left 20px top / 50px";
+shouldBe("style.background", "'left 20px top 0% / 50px round fixed border-box border-box'");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none round fixed left 20px top 0% / 50px border-box border-box'");
+
+style.background = "" round fixed left 20px top 40px / 50px";
+shouldBe("style.background", "'left 20px top 40px / 50px round fixed border-box border-box'");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none round fixed left 20px top 40px / 50px border-box border-box'");
+
+style.background = "" round fixed left 20px top 40px";
+shouldBe("style.background", "'left 20px top 40px round fixed border-box border-box'");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none round fixed left 20px top 40px / auto border-box border-box'");
+
+style.background = "" 10% left 30% gray round fixed border-box";
+shouldBe("style.background", "'left 30% top 10% round fixed border-box border-box gray'");
+shouldBe("computedStyle.background", "'rgb(128, 128, 128) none round fixed left 30% top 10% / auto border-box border-box'");
+
+debug("background-position inside the background shorthand, some invalid cases, no changes expected");
+style.background = ""
+style.background = "" 10% left 30% 50% gray round fixed border-box";
+shouldBe("style.background", "''");
+// This is the default computed style.
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'");
+
+style.background = "" 10% solid 30% gray round fixed border-box";
+shouldBe("style.background", "''");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'");
+
+style.background = "" 10% left round gray round fixed border-box";
+shouldBe("style.background", "''");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'");
+
+style.background = "" 10% top 30% gray round fixed border-box";
+shouldBe("style.background", "''");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'");
+
+style.background = "" center center / 10em gray round fixed border-box";
+shouldBe("style.background", "''");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'");
+
+style.background = "" center 30px / 10em gray round fixed border-box";
+shouldBe("style.background", "''");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'");
+
+style.background = "" center left / 10em gray round fixed border-box";
+shouldBe("style.background", "''");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'");
+
+style.background = "" left / 10em gray round fixed border-box";
+shouldBe("style.background", "''");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'");
+
+style.background = "" / 10em gray round fixed border-box";
+shouldBe("style.background", "''");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'");
+
+style.background = "" 10% left 20px 50% 50px gray round fixed border-box";
+shouldBe("style.background", "''");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'");
+
+style.background = "" 20px 30px / 40px gray round fixed border-box";
+shouldBe("style.background", "''");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'");
+
+style.background = "" 20px 30px 60px / 40px gray round fixed border-box";
+shouldBe("style.background", "''");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'");
+
+style.background = "" 20px 30px 60px 70px / 40px gray round fixed border-box";
+shouldBe("style.background", "''");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'");
+
+style.background = "" 20px 30px / 40px gray top left round fixed border-box";
+shouldBe("style.background", "''");
+shouldBe("computedStyle.background", "'rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box'");
+
 document.body.removeChild(testContainer);
 </script>
 <script src=""

Modified: trunk/Source/WebCore/ChangeLog (136682 => 136683)


--- trunk/Source/WebCore/ChangeLog	2012-12-05 14:30:57 UTC (rev 136682)
+++ trunk/Source/WebCore/ChangeLog	2012-12-05 15:10:32 UTC (rev 136683)
@@ -1,3 +1,28 @@
+2012-12-05  Alexis Menard  <[email protected]>
+
+        [CSS3 Backgrounds and Borders] Allow the CSS3 background position offset for background shorthand.
+        https://bugs.webkit.org/show_bug.cgi?id=104014
+
+        Reviewed by Dirk Schulze.
+
+        Add the support of the new <position> type if set from within the
+        background shorthand. The patch just modify the way we count the values
+        of the current context by checking wether we encounter a comma (it is
+        then the next background layer), or if we encounter a '/' (which is in the
+        background shorthand context the background-size) or any value that is
+        not a valid background-position keyword or length (which means we are
+        already parsing the next property of the background shorthand).
+
+        Tests: LayoutTests/fast/backgrounds/background-position-parsing-2.html
+        has been modified to cover this use case.
+
+        * css/CSSParser.cpp:
+        (WebCore::CSSParser::isPositionValue):
+        (WebCore):
+        (WebCore::CSSParser::parseFillBackgroundPosition):
+        (WebCore::CSSParser::parseFillProperty):
+        * css/CSSParser.h:
+
 2012-12-05  Elliott Sprehn  <[email protected]>
 
         ShadowRoot should recalcStyle for itself

Modified: trunk/Source/WebCore/css/CSSParser.cpp (136682 => 136683)


--- trunk/Source/WebCore/css/CSSParser.cpp	2012-12-05 14:30:57 UTC (rev 136682)
+++ trunk/Source/WebCore/css/CSSParser.cpp	2012-12-05 15:10:32 UTC (rev 136683)
@@ -3857,12 +3857,17 @@
 #endif
 }
 
+inline bool CSSParser::isPositionValue(CSSParserValue* value)
+{
+    return isBackgroundPositionKeyword(value->id) || validUnit(value, FPercent | FLength);
+}
+
 void CSSParser::parseFillBackgroundPosition(CSSParserValueList* valueList, RefPtr<CSSValue>& value1, RefPtr<CSSValue>& value2)
 {
     unsigned numberOfValues = 0;
     for (unsigned i = valueList->currentIndex(); i < valueList->size(); ++i, ++numberOfValues) {
         CSSParserValue* current = valueList->valueAt(i);
-        if (isComma(current) || !current)
+        if (isComma(current) || !current || (current->unit == CSSParserValue::Operator && current->iValue == '/') || !isPositionValue(current))
             break;
     }
 
@@ -4131,16 +4136,14 @@
                     break;
                 case CSSPropertyBackgroundPosition:
 #if ENABLE(CSS3_BACKGROUND)
-                    if (!inShorthand()) {
-                        parseFillBackgroundPosition(m_valueList.get(), currValue, currValue2);
-                        // parseFillBackgroundPosition advances the m_valueList pointer
-                        break;
-                    }
+                    parseFillBackgroundPosition(m_valueList.get(), currValue, currValue2);
+                    // parseFillBackgroundPosition advances the m_valueList pointer.
+                    break;
                     // Fall through to CSS 2.1 parsing.
 #endif
                 case CSSPropertyWebkitMaskPosition:
                     parseFillPosition(m_valueList.get(), currValue, currValue2);
-                    // parseFillPosition advances the m_valueList pointer
+                    // parseFillPosition advances the m_valueList pointer.
                     break;
                 case CSSPropertyBackgroundPositionX:
                 case CSSPropertyWebkitMaskPositionX: {

Modified: trunk/Source/WebCore/css/CSSParser.h (136682 => 136683)


--- trunk/Source/WebCore/css/CSSParser.h	2012-12-05 14:30:57 UTC (rev 136682)
+++ trunk/Source/WebCore/css/CSSParser.h	2012-12-05 15:10:32 UTC (rev 136683)
@@ -119,6 +119,7 @@
     PassRefPtr<CSSValue> parseFillPositionY(CSSParserValueList*);
     void parseFillPosition(CSSParserValueList*, RefPtr<CSSValue>&, RefPtr<CSSValue>&);
 #if ENABLE(CSS3_BACKGROUND)
+    bool isPositionValue(CSSParserValue*);
     void parseFillBackgroundPosition(CSSParserValueList*, RefPtr<CSSValue>&, RefPtr<CSSValue>&);
     void parse3ValuesBackgroundPosition(CSSParserValueList*, RefPtr<CSSValue>&, RefPtr<CSSValue>&, PassRefPtr<CSSPrimitiveValue>, PassRefPtr<CSSPrimitiveValue>);
     void parse4ValuesBackgroundPosition(CSSParserValueList*, RefPtr<CSSValue>&, RefPtr<CSSValue>&, PassRefPtr<CSSPrimitiveValue>, PassRefPtr<CSSPrimitiveValue>);
_______________________________________________
webkit-changes mailing list
[email protected]
http://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to