Correctly interpret from angle for conic gradients
authormegan_gardner@apple.com <megan_gardner@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 10 Sep 2018 22:23:05 +0000 (22:23 +0000)
committermegan_gardner@apple.com <megan_gardner@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 10 Sep 2018 22:23:05 +0000 (22:23 +0000)
https://bugs.webkit.org/show_bug.cgi?id=189445
<rdar://problem/44158271>

Reviewed by Tim Horton.

Source/WebCore:

Test: fast/gradients/conic-from-angle.html

We were pulling the angle as degrees when we really need radians.

* css/CSSGradientValue.cpp:
(WebCore::CSSConicGradientValue::createGradient):

LayoutTests:

Adding a test for a conic gradient that starts at an angle.
Cover the edges because triangles and conic gradients aren't rendered
exactly the same.

* TestExpectations:
* fast/gradients/conic-from-angle-expected.html: Added.
* fast/gradients/conic-from-angle.html: Added.
* platform/ios-12/TestExpectations:
* platform/mac/TestExpectations:

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

LayoutTests/ChangeLog
LayoutTests/TestExpectations
LayoutTests/fast/gradients/conic-from-angle-expected.html [new file with mode: 0644]
LayoutTests/fast/gradients/conic-from-angle.html [new file with mode: 0644]
LayoutTests/platform/ios-12/TestExpectations
LayoutTests/platform/mac/TestExpectations
Source/WebCore/ChangeLog
Source/WebCore/css/CSSGradientValue.cpp

index d9fe2b4..6100f1e 100644 (file)
@@ -1,3 +1,21 @@
+2018-09-10  Megan Gardner  <megan_gardner@apple.com>
+
+        Correctly interpret from angle for conic gradients
+        https://bugs.webkit.org/show_bug.cgi?id=189445
+        <rdar://problem/44158271>
+
+        Reviewed by Tim Horton.
+
+        Adding a test for a conic gradient that starts at an angle.
+        Cover the edges because triangles and conic gradients aren't rendered
+        exactly the same.
+
+        * TestExpectations:
+        * fast/gradients/conic-from-angle-expected.html: Added.
+        * fast/gradients/conic-from-angle.html: Added.
+        * platform/ios-12/TestExpectations:
+        * platform/mac/TestExpectations:
+
 2018-09-10  James Savage  <james.savage@apple.com>
 
         Expose -apple-system-container-border color to internal web views.
index cb40aa5..a081bb2 100644 (file)
@@ -2242,3 +2242,4 @@ fast/gradients/conic.html [ Skip ]
 fast/gradients/conic-off-center.html [ Skip ]
 fast/gradients/conic-center-outside-box.html [ Skip ]
 fast/gradients/conic-extended-stops.html [ Skip ]
+fast/gradients/conic-from-angle.html [ Skip ]
diff --git a/LayoutTests/fast/gradients/conic-from-angle-expected.html b/LayoutTests/fast/gradients/conic-from-angle-expected.html
new file mode 100644 (file)
index 0000000..072265d
--- /dev/null
@@ -0,0 +1,44 @@
+<html>
+<head>
+    <style>
+        div {
+            width: 200px;
+            height: 200px;
+        }
+        #top {
+            width: 0; 
+            height: 0; 
+            border-left: 100px solid green;
+            border-right: 100px solid blue;
+            border-top: 100px solid yellow;
+        }
+        #bottom {
+            width: 0; 
+            height: 0; 
+            border-left: 100px solid green;
+            border-right: 100px solid blue;
+            border-bottom: 100px solid orange;
+        }
+        .box {
+            position: absolute;
+        }
+        .x {
+            position: absolute;
+            -webkit-clip-path: polygon(0% 0%, 0% 5%, 45% 50%, 0% 95%, 0% 100%, 5% 100%, 50% 55%, 95% 100%, 100% 100%, 100% 95%, 55% 50%, 100% 5%, 100% 0%, 95% 0%, 50% 45%, 5% 0%);
+        }
+        #x {
+            background-color:black;
+        }
+        
+    </style>
+</head>
+<body>
+    <div>
+        <div class="box">
+            <div id="top"></div>
+            <div id="bottom"></div>
+        </div>
+        <div id="x" class="x"></div>
+    </div>
+</body>
+</html>
diff --git a/LayoutTests/fast/gradients/conic-from-angle.html b/LayoutTests/fast/gradients/conic-from-angle.html
new file mode 100644 (file)
index 0000000..aa0af1a
--- /dev/null
@@ -0,0 +1,32 @@
+<html>
+<head>
+    <style>
+        div {
+            width: 200px;
+            height: 200px;
+        }
+        #grad {
+          position: absolute;
+          background: conic-gradient(from 45deg,
+                blue 0deg, blue 90deg,
+                orange 0deg, orange 180deg,
+                green 0deg, green 270deg,
+                yellow 0deg, yellow 360deg);
+        }
+        .x {
+            position: absolute;
+            -webkit-clip-path: polygon(0% 0%, 0% 5%, 45% 50%, 0% 95%, 0% 100%, 5% 100%, 50% 55%, 95% 100%, 100% 100%, 100% 95%, 55% 50%, 100% 5%, 100% 0%, 95% 0%, 50% 45%, 5% 0%);
+        }
+        #x {
+            background-color:black;
+        }
+        
+    </style>
+</head>
+<body>
+    <div>
+        <div id="grad"></div>
+        <div id="x" class="x"></div>
+    </div>
+</body>
+</html>
\ No newline at end of file
index fd6c15d..362cd87 100644 (file)
@@ -31,4 +31,5 @@ fast/gradients/conic-repeating.html [ Pass ]
 fast/gradients/conic.html [ Pass ]
 fast/gradients/conic-off-center.html [ Pass ]
 fast/gradients/conic-center-outside-box.html [ Pass ]
-fast/gradients/conic-extended-stops.html [ Pass ]
\ No newline at end of file
+fast/gradients/conic-extended-stops.html [ Pass ]
+fast/gradients/conic-from-angle.html [ Pass ]
\ No newline at end of file
index 414e2d3..b4d9fc4 100644 (file)
@@ -1763,4 +1763,5 @@ webkit.org/b/187393 imported/w3c/web-platform-tests/2dcontext/imagebitmap/create
 [ Mojave+ ] fast/gradients/conic-off-center.html [ Pass ]
 [ Mojave+ ] fast/gradients/conic-center-outside-box.html [ Pass ]
 [ Mojave+ ] fast/gradients/conic-extended-stops.html [ Pass ]
+[ Mojave+ ] fast/gradients/conic-from-angle.html [ Pass ]
 
index faffda5..102a590 100644 (file)
@@ -1,3 +1,18 @@
+2018-09-10  Megan Gardner  <megan_gardner@apple.com>
+
+        Correctly interpret from angle for conic gradients
+        https://bugs.webkit.org/show_bug.cgi?id=189445
+        <rdar://problem/44158271>
+
+        Reviewed by Tim Horton.
+
+        Test: fast/gradients/conic-from-angle.html
+
+        We were pulling the angle as degrees when we really need radians.
+
+        * css/CSSGradientValue.cpp:
+        (WebCore::CSSConicGradientValue::createGradient):
+
 2018-09-10  James Savage  <james.savage@apple.com>
 
         Expose -apple-system-container-border color to internal web views.
index 8eb338b..385ae32 100644 (file)
@@ -1436,7 +1436,7 @@ Ref<Gradient> CSSConicGradientValue::createGradient(RenderElement& renderer, con
 
     float angle = 0;
     if (m_angle)
-        angle = m_angle->floatValue(CSSPrimitiveValue::CSS_DEG);
+        angle = m_angle->floatValue(CSSPrimitiveValue::CSS_RAD);
 
     Gradient::ConicData data { centerPoint, angle };
     ConicGradientAdapter adapter;