Changeset 285235 in webkit

Timestamp:

Nov 3, 2021 3:18:37 PM (9 months ago)

Author:

jh718.park@samsung.com

Message:

border-radius inline style should serialize with valid syntax
​https://bugs.webkit.org/show_bug.cgi?id=183994

This patch have border-radius property serializes in canonical order
as specified in ​https://drafts.csswg.org/css-backgrounds/#border-radius.

Reviewed by Darin Adler.

LayoutTests/imported/w3c:

• web-platform-tests/css/css-backgrounds/parsing/border-radius-valid-expected.txt: Add more test case results.
• web-platform-tests/css/css-backgrounds/parsing/border-radius-valid.html: Add more test cases.

Source/WebCore:

• css/StyleProperties.cpp:

(WebCore::StyleProperties::getPropertyValue const):
(WebCore::StyleProperties::borderRadiusValue const):

• css/StyleProperties.h:
• css/parser/CSSPropertyParser.cpp:

Location:

trunk

Files:

• LayoutTests/imported/w3c/ChangeLog (modified) (1 diff)
• LayoutTests/imported/w3c/web-platform-tests/css/css-backgrounds/parsing/border-radius-valid-expected.txt (modified) (1 diff)
• LayoutTests/imported/w3c/web-platform-tests/css/css-backgrounds/parsing/border-radius-valid.html (modified) (1 diff)
• Source/WebCore/ChangeLog (modified) (1 diff)
• Source/WebCore/css/StyleProperties.cpp (modified) (3 diffs)
• Source/WebCore/css/StyleProperties.h (modified) (1 diff)
• Source/WebCore/css/parser/CSSPropertyParser.cpp (modified) (1 diff)

trunk/LayoutTests/imported/w3c/ChangeLog

@@ +1 @@
+2021-11-03  Joonghun Park  <jh718.park@samsung.com>
+
+        border-radius inline style should serialize with valid syntax
+        https://bugs.webkit.org/show_bug.cgi?id=183994
+
+        This patch have border-radius property serializes in canonical order
+        as specified in https://drafts.csswg.org/css-backgrounds/#border-radius.
+
+        Reviewed by Darin Adler.
+
+        * web-platform-tests/css/css-backgrounds/parsing/border-radius-valid-expected.txt: Add more test case results.
+        * web-platform-tests/css/css-backgrounds/parsing/border-radius-valid.html: Add more test cases.
+
 2021-11-03  Chris Dumez  <cdumez@apple.com>
 

trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-backgrounds/parsing/border-radius-valid-expected.txt

@@ -1 +1 @@
 
 PASS e.style['border-radius'] = "1px" should set the property value
+PASS e.style['border-radius'] = "1px 5%" should set the property value
+PASS e.style['border-radius'] = "1px 2% 3px" should set the property value
 PASS e.style['border-radius'] = "1px 2% 3px 4%" should set the property value
-FAIL e.style['border-radius'] = "5em / 1px 2% 3px 4%" should set the property value assert_equals: serialization should be canonical expected "5em / 1px 2% 3px 4%" but got "5em 1px 5em 2% 5em 3px 5em 4%"
-FAIL e.style['border-radius'] = "1px 2% 3px 4% / 5em" should set the property value assert_equals: serialization should be canonical expected "1px 2% 3px 4% / 5em" but got "1px 5em 2% 5em 3px 5em 4% 5em"
-FAIL e.style['border-radius'] = "1px 1px 1px 2% / 1px 2% 1px 2%" should set the property value assert_equals: serialization should be canonical expected "1px 1px 1px 2% / 1px 2%" but got "1px 1px 2% 1px 2%"
-FAIL e.style['border-radius'] = "1px 1px 1px 1px / 1px 1px 2% 1px" should set the property value assert_equals: serialization should be canonical expected "1px / 1px 1px 2%" but got "1px 1px 1px 2%"
+PASS e.style['border-radius'] = "1px / 2px" should set the property value
+PASS e.style['border-radius'] = "5em / 1px 2% 3px 4%" should set the property value
+PASS e.style['border-radius'] = "1px 2% / 3px 4px" should set the property value
+PASS e.style['border-radius'] = "1px 2px 3em / 1px 2px 3%" should set the property value
+PASS e.style['border-radius'] = "1px 2% / 2px 3em 4px 5em" should set the property value
+PASS e.style['border-radius'] = "1px 2% 3px 4% / 5em" should set the property value
+PASS e.style['border-radius'] = "1px 1px 1px 2% / 1px 2% 1px 2%" should set the property value
+PASS e.style['border-radius'] = "1px 1px 1px 1px / 1px 1px 2% 1px" should set the property value
 PASS e.style['border-radius'] = "1px 1px 2% 2%" should set the property value
 PASS e.style['border-radius'] = "1px 2% 1px 1px" should set the property value
-FAIL e.style['border-radius'] = "1px 2% 2% 2% / 1px 2% 3px 2%" should set the property value assert_equals: serialization should be canonical expected "1px 2% 2% / 1px 2% 3px" but got "1px 2% 2% 3px"
+PASS e.style['border-radius'] = "1px 2% 2% 2% / 1px 2% 3px 2%" should set the property value
 PASS e.style['border-top-left-radius'] = "10px" should set the property value
 PASS e.style['border-top-right-radius'] = "20%" should set the property value

trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-backgrounds/parsing/border-radius-valid.html

@@ -13 +13 @@
 <script>
 test_valid_value("border-radius", "1px");
+test_valid_value("border-radius", "1px 5%");
+test_valid_value("border-radius", "1px 2% 3px");
 test_valid_value("border-radius", "1px 2% 3px 4%");
+test_valid_value("border-radius", "1px / 2px");
 test_valid_value("border-radius", "5em / 1px 2% 3px 4%");
+test_valid_value("border-radius", "1px 2% / 3px 4px");
+test_valid_value("border-radius", "1px 2px 3em / 1px 2px 3%");
+test_valid_value("border-radius", "1px 2% / 2px 3em 4px 5em");
 test_valid_value("border-radius", "1px 2% 3px 4% / 5em");
 

trunk/Source/WebCore/ChangeLog

@@ +1 @@
+2021-11-03  Joonghun Park  <jh718.park@samsung.com>
+
+        border-radius inline style should serialize with valid syntax
+        https://bugs.webkit.org/show_bug.cgi?id=183994
+
+        This patch have border-radius property serializes in canonical order
+        as specified in https://drafts.csswg.org/css-backgrounds/#border-radius.
+
+        Reviewed by Darin Adler.
+
+        * css/StyleProperties.cpp:
+        (WebCore::StyleProperties::getPropertyValue const):
+        (WebCore::StyleProperties::borderRadiusValue const):
+        * css/StyleProperties.h:
+        * css/parser/CSSPropertyParser.cpp:
+
 2021-11-03  David Kilzer  <ddkilzer@apple.com>
 

trunk/Source/WebCore/css/StyleProperties.cpp

@@ -36 +36 @@
 #include "Color.h"
 #include "Document.h"
+#include "Pair.h"
 #include "PropertySetCSSStyleDeclaration.h"
 #include "StylePropertyShorthand.h"
@@ -320 +321 @@
         return String();
     case CSSPropertyBorderRadius:
-        return get4Values(borderRadiusShorthand());
+        return borderRadiusValue(borderRadiusShorthand());
     case CSSPropertyGap:
         return get2Values(gapShorthand());
@@ -362 +363 @@
         return value->cssText();
     return String();
+}
+
+String StyleProperties::borderRadiusValue(const StylePropertyShorthand& shorthand) const
+{
+    auto serialize = [](const CSSValue* topLeft, const CSSValue* topRight, const CSSValue* bottomRight, const CSSValue* bottomLeft) -> String {
+        bool showBottomLeft = !(*topRight == *bottomLeft);
+        bool showBottomRight = !(*topLeft == *bottomRight) || showBottomLeft;
+        bool showTopRight = !(*topLeft == *topRight) || showBottomRight;
+
+        return makeString(topLeft->cssText(), showTopRight ? " " : "", showTopRight ? topRight->cssText() : "", showBottomRight ? " " : "", showBottomRight ? bottomRight->cssText() : "", showBottomLeft ? " " : "", showBottomLeft ? bottomLeft->cssText() : "");
+    };
+
+    int topLeftValueIndex = findPropertyIndex(shorthand.properties()[0]);
+    int topRightValueIndex = findPropertyIndex(shorthand.properties()[1]);
+    int bottomRightValueIndex = findPropertyIndex(shorthand.properties()[2]);
+    int bottomLeftValueIndex = findPropertyIndex(shorthand.properties()[3]);
+
+    if (topLeftValueIndex == -1 || topRightValueIndex == -1 || bottomRightValueIndex == -1 || bottomLeftValueIndex == -1)
+        return String();
+
+    PropertyReference topLeft = propertyAt(topLeftValueIndex);
+    PropertyReference topRight = propertyAt(topRightValueIndex);
+    PropertyReference bottomRight = propertyAt(bottomRightValueIndex);
+    PropertyReference bottomLeft = propertyAt(bottomLeftValueIndex);
+
+    auto* topLeftValue = topLeft.value();
+    auto* topRightValue = topRight.value();
+    auto* bottomRightValue = bottomRight.value();
+    auto* bottomLeftValue = bottomLeft.value();
+
+    // All 4 properties must be specified.
+    if (!topLeftValue || !topRightValue || !bottomRightValue || !bottomLeftValue)
+        return String();
+
+    // Important flags must be the same
+    if (topLeft.isImportant() != topRight.isImportant() || topRight.isImportant() != bottomRight.isImportant() || bottomRight.isImportant() != bottomLeft.isImportant())
+        return String();
+
+    if (topLeftValue->isInheritedValue() && topRightValue->isInheritedValue() && bottomRightValue->isInheritedValue() && bottomLeftValue->isInheritedValue())
+        return getValueName(CSSValueInherit);
+
+    if (topLeftValue->isInitialValue() || topRightValue->isInitialValue() || bottomRightValue->isInitialValue() || bottomLeftValue->isInitialValue()) {
+        if (topLeftValue->isInitialValue() && topRightValue->isInitialValue() && bottomRightValue->isInitialValue() && bottomLeftValue->isInitialValue() && !topLeft.isImplicit()) {
+            // All components are "initial" and "topLeft" is not implicit.
+            return getValueName(CSSValueInitial);
+        }
+        return String();
+    }
+
+    auto& topLeftPair = *downcast<CSSPrimitiveValue>(*topLeftValue).pairValue();
+    auto& topRightPair = *downcast<CSSPrimitiveValue>(*topRightValue).pairValue();
+    auto& bottomRightPair = *downcast<CSSPrimitiveValue>(*bottomRightValue).pairValue();
+    auto& bottomLeftPair = *downcast<CSSPrimitiveValue>(*bottomLeftValue).pairValue();
+
+    auto first = serialize(topLeftPair.first(), topRightPair.first(), bottomRightPair.first(), bottomLeftPair.first());
+    auto second = serialize(topLeftPair.second(), topRightPair.second(), bottomRightPair.second(), bottomLeftPair.second());
+    if (first == second)
+        return first;
+
+    return makeString(first, " / ", second);
 }
 

trunk/Source/WebCore/css/StyleProperties.h

@@ -171 +171 @@
     String get2Values(const StylePropertyShorthand&) const;
     String get4Values(const StylePropertyShorthand&) const;
+    String borderRadiusValue(const StylePropertyShorthand&) const;
     String borderSpacingValue(const StylePropertyShorthand&) const;
     String fontValue() const;

trunk/Source/WebCore/css/parser/CSSPropertyParser.cpp

@@ -64 +64 @@
 #include "FontFace.h"
 #include "HashTools.h"
+// FIXME-NEWPARSER: CSSPrimitiveValue is a large class that holds many unrelated objects,
+// switching behavior on the type of the object it is holding.
+// Since CSSValue is already a class hierarchy, this adds an unnecessary second level to the hierarchy that complicates code.
+// So we need to remove the various behaviors from CSSPrimitiveValue and split them into separate subclasses of CSSValue.
 // FIXME-NEWPARSER: Replace Pair and Rect with actual CSSValue subclasses (CSSValuePair and CSSQuadValue).
 #include "Pair.h"