Negative radii in radial gradients should be rejected.
authorjh718.park@samsung.com <jh718.park@samsung.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 4 Oct 2019 17:30:16 +0000 (17:30 +0000)
committerjh718.park@samsung.com <jh718.park@samsung.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 4 Oct 2019 17:30:16 +0000 (17:30 +0000)
https://bugs.webkit.org/show_bug.cgi?id=202412

Per the spec, https://drafts.csswg.org/css-images-3/#radial-gradients
"Negative values are invalid.",
we reject negative radii values in radial-gradient.

This patch rejects negative radii during radial-gradient parsing
for both webkit prefixed and non-prefixed ones.

Reviewed by Antti Koivisto.

LayoutTests/imported/w3c:

* web-platform-tests/compat/webkit-radial-gradient-radii-expected.txt: Added.
* web-platform-tests/compat/webkit-radial-gradient-radii.html: Added.
* web-platform-tests/css/css-backgrounds/parsing/background-image-invalid-expected.txt: Added.
* web-platform-tests/css/css-backgrounds/parsing/background-image-invalid.html: Added.

Source/WebCore:

Tests: imported/blink/css-parser/webkit-gradient.html
       imported/w3c/web-platform-tests/compat/webkit-radial-gradient-radii.html
       imported/w3c/web-platform-tests/css/css-backgrounds/parsing/background-image-invalid.html

* css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::consumeDeprecatedGradient):
(WebCore::CSSPropertyParserHelpers::consumeDeprecatedRadialGradient):
(WebCore::CSSPropertyParserHelpers::consumeRadialGradient):

LayoutTests:

* imported/blink/css-parser/webkit-gradient-expected.txt: Added.
* imported/blink/css-parser/webkit-gradient.html: Added.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@250730 268f45cc-cd09-0410-ab3c-d52691b4dbfc

LayoutTests/ChangeLog
LayoutTests/imported/blink/css-parser/webkit-gradient-expected.txt [new file with mode: 0644]
LayoutTests/imported/blink/css-parser/webkit-gradient.html [new file with mode: 0644]
LayoutTests/imported/w3c/ChangeLog
LayoutTests/imported/w3c/web-platform-tests/compat/webkit-radial-gradient-radii-expected.txt [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/compat/webkit-radial-gradient-radii.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-backgrounds/parsing/background-image-invalid-expected.txt [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-backgrounds/parsing/background-image-invalid.html [new file with mode: 0644]
Source/WebCore/ChangeLog
Source/WebCore/css/parser/CSSPropertyParserHelpers.cpp

index 26b331e..2bc9782 100644 (file)
@@ -1,3 +1,20 @@
+2019-10-04  Joonghun Park  <jh718.park@samsung.com>
+
+        Negative radii in radial gradients should be rejected.
+        https://bugs.webkit.org/show_bug.cgi?id=202412
+
+        Per the spec, https://drafts.csswg.org/css-images-3/#radial-gradients
+        "Negative values are invalid.",
+        we reject negative radii values in radial-gradient.
+
+        This patch rejects negative radii during radial-gradient parsing
+        for both webkit prefixed and non-prefixed ones.
+
+        Reviewed by Antti Koivisto.
+
+        * imported/blink/css-parser/webkit-gradient-expected.txt: Added.
+        * imported/blink/css-parser/webkit-gradient.html: Added.
+
 2019-10-04  youenn fablet  <youenn@apple.com>
 
         AbortSignal does not always emit the abort signal
diff --git a/LayoutTests/imported/blink/css-parser/webkit-gradient-expected.txt b/LayoutTests/imported/blink/css-parser/webkit-gradient-expected.txt
new file mode 100644 (file)
index 0000000..02615d9
--- /dev/null
@@ -0,0 +1,5 @@
+
+PASS -webkit-gradient accepts positive radii. 
+PASS -webkit-gradient accepts zero radii. 
+PASS -webkit-gradient rejects negative radii. 
+
diff --git a/LayoutTests/imported/blink/css-parser/webkit-gradient.html b/LayoutTests/imported/blink/css-parser/webkit-gradient.html
new file mode 100644 (file)
index 0000000..b964996
--- /dev/null
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<script src="../../../resources/testharness.js"></script>
+<script src="../../../resources/testharnessreport.js"></script>
+<script>
+test(function() {
+    assert_true(CSS.supports("background-image", "-webkit-gradient(radial, 1% 2%, 3, 4% 5%, 6)"));
+}, '-webkit-gradient accepts positive radii.');
+
+test(function() {
+    assert_true(CSS.supports("background-image", "-webkit-gradient(radial, 1% 2%, 3, 4% 5%, 0)"));
+}, '-webkit-gradient accepts zero radii.');
+
+test(function() {
+    assert_false(CSS.supports("background-image", "-webkit-gradient(radial, 1% 2%, -3, 4% 5%, 6)"));
+    assert_false(CSS.supports("background-image", "-webkit-gradient(radial, 1% 2%, 3, 4% 5%, -6)"));
+    assert_false(CSS.supports("background-image", "-webkit-gradient(radial, 1% 2%, -3, 4% 5%, -6)"));
+}, '-webkit-gradient rejects negative radii.');
+</script>
index a9bbb3e..b17eda6 100644 (file)
@@ -1,3 +1,22 @@
+2019-10-04  Joonghun Park  <jh718.park@samsung.com>
+
+        Negative radii in radial gradients should be rejected.
+        https://bugs.webkit.org/show_bug.cgi?id=202412
+
+        Per the spec, https://drafts.csswg.org/css-images-3/#radial-gradients
+        "Negative values are invalid.",
+        we reject negative radii values in radial-gradient.
+
+        This patch rejects negative radii during radial-gradient parsing
+        for both webkit prefixed and non-prefixed ones.
+
+        Reviewed by Antti Koivisto.
+
+        * web-platform-tests/compat/webkit-radial-gradient-radii-expected.txt: Added.
+        * web-platform-tests/compat/webkit-radial-gradient-radii.html: Added.
+        * web-platform-tests/css/css-backgrounds/parsing/background-image-invalid-expected.txt: Added.
+        * web-platform-tests/css/css-backgrounds/parsing/background-image-invalid.html: Added.
+
 2019-10-04  Chris Lord  <clord@igalia.com>
 
         ImageBitmap should be serializable
diff --git a/LayoutTests/imported/w3c/web-platform-tests/compat/webkit-radial-gradient-radii-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/compat/webkit-radial-gradient-radii-expected.txt
new file mode 100644 (file)
index 0000000..3e6abdf
--- /dev/null
@@ -0,0 +1,5 @@
+
+PASS -webkit-radial-gradient accepts positive radii. 
+PASS -webkit-radial-gradient accepts zero radii. 
+PASS -webkit-radial-gradient rejects negative radii. 
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/compat/webkit-radial-gradient-radii.html b/LayoutTests/imported/w3c/web-platform-tests/compat/webkit-radial-gradient-radii.html
new file mode 100644 (file)
index 0000000..f34e352
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<link rel="help" href="https://compat.spec.whatwg.org/#css-gradients-webkit-radial-gradient">
+<link rel="help" href="https://www.w3.org/TR/css3-images/#radial-gradients">
+<meta name="assert" content="Negative radii values are invalid.">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script>
+test(function() {
+    assert_true(CSS.supports("background-image", "-webkit-radial-gradient(1px 2px, 3% 4%, red, blue)"));
+}, '-webkit-radial-gradient accepts positive radii.');
+
+test(function() {
+    assert_true(CSS.supports("background-image", "-webkit-radial-gradient(1px 2px, 0% 4%, red, blue)"));
+}, '-webkit-radial-gradient accepts zero radii.');
+
+test(function() {
+    assert_false(CSS.supports("background-image", "-webkit-radial-gradient(1px 2px, -3% 4%, red, blue)"));
+    assert_false(CSS.supports("background-image", "-webkit-radial-gradient(1px 2px, 3% -4%, red, blue)"));
+    assert_false(CSS.supports("background-image", "-webkit-radial-gradient(1px 2px, -3% -4%, red, blue)"));
+}, '-webkit-radial-gradient rejects negative radii.');
+</script>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-backgrounds/parsing/background-image-invalid-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/css/css-backgrounds/parsing/background-image-invalid-expected.txt
new file mode 100644 (file)
index 0000000..ea75733
--- /dev/null
@@ -0,0 +1,9 @@
+
+PASS e.style['background-image'] = "none, auto" should not set the property value 
+PASS e.style['background-image'] = "radial-gradient(circle -10px at center, red, blue)" should not set the property value 
+PASS e.style['background-image'] = "repeating-radial-gradient(-10px at center, red, blue)" should not set the property value 
+PASS e.style['background-image'] = "radial-gradient(ellipse -20px 30px at center, red, blue)" should not set the property value 
+PASS e.style['background-image'] = "repeating-radial-gradient(-20% 30% at center, red, blue)" should not set the property value 
+PASS e.style['background-image'] = "radial-gradient(20px -30px at center, red, blue)" should not set the property value 
+PASS e.style['background-image'] = "repeating-radial-gradient(20px -30px ellipse at center, red, blue)" should not set the property value 
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-backgrounds/parsing/background-image-invalid.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-backgrounds/parsing/background-image-invalid.html
new file mode 100644 (file)
index 0000000..7f1bc98
--- /dev/null
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Backgrounds and Borders Module Level 3: parsing background-image with invalid values</title>
+<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#background-image">
+<link rel="help" href="https://drafts.csswg.org/css-images/#radial-gradients">
+<meta name="assert" content="background-image supports only the grammar '<bg-image>#'.">
+<meta name="assert" content="Negative radial-gradient radii are invalid.">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/css/support/parsing-testcommon.js"></script>
+</head>
+<body>
+<script>
+test_invalid_value("background-image", "none, auto");
+
+// Negative radii are invalid.
+test_invalid_value("background-image", "radial-gradient(circle -10px at center, red, blue)");
+test_invalid_value("background-image", "repeating-radial-gradient(-10px at center, red, blue)");
+test_invalid_value("background-image", "radial-gradient(ellipse -20px 30px at center, red, blue)");
+test_invalid_value("background-image", "repeating-radial-gradient(-20% 30% at center, red, blue)");
+test_invalid_value("background-image", "radial-gradient(20px -30px at center, red, blue)");
+test_invalid_value("background-image", "repeating-radial-gradient(20px -30px ellipse at center, red, blue)");
+</script>
+</body>
+</html>
index df347fd..377bff8 100644 (file)
@@ -1,3 +1,26 @@
+2019-10-04  Joonghun Park  <jh718.park@samsung.com>
+
+        Negative radii in radial gradients should be rejected.
+        https://bugs.webkit.org/show_bug.cgi?id=202412
+
+        Per the spec, https://drafts.csswg.org/css-images-3/#radial-gradients
+        "Negative values are invalid.",
+        we reject negative radii values in radial-gradient.
+
+        This patch rejects negative radii during radial-gradient parsing
+        for both webkit prefixed and non-prefixed ones.
+
+        Reviewed by Antti Koivisto.
+
+        Tests: imported/blink/css-parser/webkit-gradient.html
+               imported/w3c/web-platform-tests/compat/webkit-radial-gradient-radii.html
+               imported/w3c/web-platform-tests/css/css-backgrounds/parsing/background-image-invalid.html
+
+        * css/parser/CSSPropertyParserHelpers.cpp:
+        (WebCore::CSSPropertyParserHelpers::consumeDeprecatedGradient):
+        (WebCore::CSSPropertyParserHelpers::consumeDeprecatedRadialGradient):
+        (WebCore::CSSPropertyParserHelpers::consumeRadialGradient):
+
 2019-10-04  Alex Christensen  <achristensen@webkit.org>
 
         Move WKProcessPool._registerURLSchemeServiceWorkersCanHandle to _WKWebsiteDataStoreConfiguration
index 2005fc0..18153a4 100644 (file)
@@ -995,7 +995,7 @@ static RefPtr<CSSValue> consumeDeprecatedGradient(CSSParserTokenRange& args, CSS
     if (!result || !consumeCommaIncludingWhitespace(args))
         return nullptr;
 
-    RefPtr<CSSPrimitiveValue> point = consumeDeprecatedGradientPoint(args, true);
+    auto point = consumeDeprecatedGradientPoint(args, true);
     if (!point)
         return nullptr;
     result->setFirstX(point.copyRef());
@@ -1009,7 +1009,7 @@ static RefPtr<CSSValue> consumeDeprecatedGradient(CSSParserTokenRange& args, CSS
 
     // For radial gradients only, we now expect a numeric radius.
     if (isDeprecatedRadialGradient) {
-        RefPtr<CSSPrimitiveValue> radius = consumeNumber(args, ValueRangeAll);
+        auto radius = consumeNumber(args, ValueRangeNonNegative);
         if (!radius || !consumeCommaIncludingWhitespace(args))
             return nullptr;
         downcast<CSSRadialGradientValue>(result.get())->setFirstRadius(radius.copyRef());
@@ -1028,7 +1028,7 @@ static RefPtr<CSSValue> consumeDeprecatedGradient(CSSParserTokenRange& args, CSS
     if (isDeprecatedRadialGradient) {
         if (!consumeCommaIncludingWhitespace(args))
             return nullptr;
-        RefPtr<CSSPrimitiveValue> radius = consumeNumber(args, ValueRangeAll);
+        auto radius = consumeNumber(args, ValueRangeNonNegative);
         if (!radius)
             return nullptr;
         downcast<CSSRadialGradientValue>(result.get())->setSecondRadius(radius.copyRef());
@@ -1112,8 +1112,8 @@ static RefPtr<CSSValue> consumeDeprecatedRadialGradient(CSSParserTokenRange& arg
     result->setSecondX(centerX.copyRef());
     result->setSecondY(centerY.copyRef());
 
-    RefPtr<CSSPrimitiveValue> shape = consumeIdent<CSSValueCircle, CSSValueEllipse>(args);
-    RefPtr<CSSPrimitiveValue> sizeKeyword = consumeIdent<CSSValueClosestSide, CSSValueClosestCorner, CSSValueFarthestSide, CSSValueFarthestCorner, CSSValueContain, CSSValueCover>(args);
+    auto shape = consumeIdent<CSSValueCircle, CSSValueEllipse>(args);
+    auto sizeKeyword = consumeIdent<CSSValueClosestSide, CSSValueClosestCorner, CSSValueFarthestSide, CSSValueFarthestCorner, CSSValueContain, CSSValueCover>(args);
     if (!shape)
         shape = consumeIdent<CSSValueCircle, CSSValueEllipse>(args);
     result->setShape(shape.copyRef());
@@ -1121,10 +1121,10 @@ static RefPtr<CSSValue> consumeDeprecatedRadialGradient(CSSParserTokenRange& arg
 
     // Or, two lengths or percentages
     if (!shape && !sizeKeyword) {
-        RefPtr<CSSPrimitiveValue> horizontalSize = consumeLengthOrPercent(args, cssParserMode, ValueRangeAll);
+        auto horizontalSize = consumeLengthOrPercent(args, cssParserMode, ValueRangeNonNegative);
         RefPtr<CSSPrimitiveValue> verticalSize;
         if (horizontalSize) {
-            verticalSize = consumeLengthOrPercent(args, cssParserMode, ValueRangeAll);
+            verticalSize = consumeLengthOrPercent(args, cssParserMode, ValueRangeNonNegative);
             if (!verticalSize)
                 return nullptr;
             consumeCommaIncludingWhitespace(args);
@@ -1168,13 +1168,13 @@ static RefPtr<CSSValue> consumeRadialGradient(CSSParserTokenRange& args, CSSPars
                 break;
             }
         } else {
-            RefPtr<CSSPrimitiveValue> center = consumeLengthOrPercent(args, cssParserMode, ValueRangeAll);
+            auto center = consumeLengthOrPercent(args, cssParserMode, ValueRangeNonNegative);
             if (!center)
                 break;
             if (horizontalSize)
                 return nullptr;
             horizontalSize = center;
-            center = consumeLengthOrPercent(args, cssParserMode, ValueRangeAll);
+            center = consumeLengthOrPercent(args, cssParserMode, ValueRangeNonNegative);
             if (center) {
                 verticalSize = center;
                 ++i;