Add support for spreadMethod=reflect and repeat on SVG gradients (for CoreGraphics...
authorcommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 14 Sep 2018 23:55:37 +0000 (23:55 +0000)
committercommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 14 Sep 2018 23:55:37 +0000 (23:55 +0000)
https://bugs.webkit.org/show_bug.cgi?id=5968

Source/WebCore:

Add support for spreadMethod=repeat and reflect. Also, the opacity of a gradient is now
the result of multiplying stop-opacity with the opacity of the color.

Patch by Justin Michaud <justin_michaud@apple.com> on 2018-09-14
Reviewed by Simon Fraser.

Tests: svg/gradients/spreadMethod-expected.svg
       svg/gradients/spreadMethod.svg
       svg/gradients/spreadMethodAlpha-expected.svg
       svg/gradients/spreadMethodAlpha.svg
       svg/gradients/spreadMethodClose0-expected-mismatch.svg
       svg/gradients/spreadMethodClose0.svg
       svg/gradients/spreadMethodClose1-expected-mismatch.svg
       svg/gradients/spreadMethodClose1.svg
       svg/gradients/spreadMethodClose2-expected.svg
       svg/gradients/spreadMethodClose2.svg
       svg/gradients/spreadMethodDiagonal-expected.svg
       svg/gradients/spreadMethodDiagonal.svg
       svg/gradients/spreadMethodDiagonal2-expected.svg
       svg/gradients/spreadMethodDiagonal2.svg
       svg/gradients/spreadMethodDuplicateStop-expected.svg
       svg/gradients/spreadMethodDuplicateStop.svg
       svg/gradients/spreadMethodReversed-expected.svg
       svg/gradients/spreadMethodReversed.svg
       svg/gradients/stopAlpha-expected.svg
       svg/gradients/stopAlpha.svg

* platform/graphics/cg/GradientCG.cpp:
(WebCore::Gradient::paint):
* svg/SVGStopElement.cpp:
(WebCore::SVGStopElement::stopColorIncludingOpacity const):

LayoutTests:

Add new svg tests for linear gradients with spreadMethod, and alpha values specified in
both stop-opacity and color.

Patch by Justin Michaud <justin_michaud@apple.com> on 2018-09-14
Reviewed by Simon Fraser.

* platform/mac/svg/W3C-SVG-1.1/pservers-grad-10-b-expected.png:
* svg/gradients/spreadMethod-expected.svg: Added.
* svg/gradients/spreadMethod.svg: Added.
* svg/gradients/spreadMethodAlpha-expected.svg: Added.
* svg/gradients/spreadMethodAlpha.svg: Added.
* svg/gradients/spreadMethodClose0-expected-mismatch.svg: Added.
* svg/gradients/spreadMethodClose0.svg: Added.
* svg/gradients/spreadMethodClose1-expected-mismatch.svg: Added.
* svg/gradients/spreadMethodClose1.svg: Added.
* svg/gradients/spreadMethodClose2-expected.svg: Added.
* svg/gradients/spreadMethodClose2.svg: Added.
* svg/gradients/spreadMethodDiagonal-expected.svg: Added.
* svg/gradients/spreadMethodDiagonal.svg: Added.
* svg/gradients/spreadMethodDiagonal2-expected.svg: Added.
* svg/gradients/spreadMethodDiagonal2.svg: Added.
* svg/gradients/spreadMethodDuplicateStop-expected.svg: Added.
* svg/gradients/spreadMethodDuplicateStop.svg: Added.
* svg/gradients/spreadMethodReversed-expected.svg: Added.
* svg/gradients/spreadMethodReversed.svg: Added.
* svg/gradients/stopAlpha-expected.svg: Added.
* svg/gradients/stopAlpha.svg: Added.

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

29 files changed:
LayoutTests/ChangeLog
LayoutTests/platform/mac/svg/W3C-SVG-1.1/pservers-grad-10-b-expected.png
LayoutTests/svg/gradients/spreadMethod-expected.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethod.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodAlpha-expected.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodAlpha.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodClose0-expected-mismatch.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodClose0.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodClose1-expected-mismatch.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodClose1.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodClose2-expected.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodClose2.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodDiagonal-expected.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodDiagonal.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodDiagonal2-expected.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodDiagonal2.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodDiagonal3-expected.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodDiagonal3.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodDiagonal4-expected.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodDiagonal4.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodDuplicateStop-expected.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodDuplicateStop.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodReversed-expected.svg [new file with mode: 0644]
LayoutTests/svg/gradients/spreadMethodReversed.svg [new file with mode: 0644]
LayoutTests/svg/gradients/stopAlpha-expected.svg [new file with mode: 0644]
LayoutTests/svg/gradients/stopAlpha.svg [new file with mode: 0644]
Source/WebCore/ChangeLog
Source/WebCore/platform/graphics/cg/GradientCG.cpp
Source/WebCore/svg/SVGStopElement.cpp

index 740c539..2bb9398 100644 (file)
@@ -1,3 +1,35 @@
+2018-09-14  Justin Michaud  <justin_michaud@apple.com>
+
+        Add support for spreadMethod=reflect and repeat on SVG gradients (for CoreGraphics platforms)
+        https://bugs.webkit.org/show_bug.cgi?id=5968
+
+        Add new svg tests for linear gradients with spreadMethod, and alpha values specified in
+        both stop-opacity and color.
+
+        Reviewed by Simon Fraser.
+
+        * platform/mac/svg/W3C-SVG-1.1/pservers-grad-10-b-expected.png:
+        * svg/gradients/spreadMethod-expected.svg: Added.
+        * svg/gradients/spreadMethod.svg: Added.
+        * svg/gradients/spreadMethodAlpha-expected.svg: Added.
+        * svg/gradients/spreadMethodAlpha.svg: Added.
+        * svg/gradients/spreadMethodClose0-expected-mismatch.svg: Added.
+        * svg/gradients/spreadMethodClose0.svg: Added.
+        * svg/gradients/spreadMethodClose1-expected-mismatch.svg: Added.
+        * svg/gradients/spreadMethodClose1.svg: Added.
+        * svg/gradients/spreadMethodClose2-expected.svg: Added.
+        * svg/gradients/spreadMethodClose2.svg: Added.
+        * svg/gradients/spreadMethodDiagonal-expected.svg: Added.
+        * svg/gradients/spreadMethodDiagonal.svg: Added.
+        * svg/gradients/spreadMethodDiagonal2-expected.svg: Added.
+        * svg/gradients/spreadMethodDiagonal2.svg: Added.
+        * svg/gradients/spreadMethodDuplicateStop-expected.svg: Added.
+        * svg/gradients/spreadMethodDuplicateStop.svg: Added.
+        * svg/gradients/spreadMethodReversed-expected.svg: Added.
+        * svg/gradients/spreadMethodReversed.svg: Added.
+        * svg/gradients/stopAlpha-expected.svg: Added.
+        * svg/gradients/stopAlpha.svg: Added.
+
 2018-09-14  Ross Kirsling  <ross.kirsling@sony.com>
 
         [WinCairo] Unreviewed test gardening.
index 8c23bbf..f2c81e4 100644 (file)
Binary files a/LayoutTests/platform/mac/svg/W3C-SVG-1.1/pservers-grad-10-b-expected.png and b/LayoutTests/platform/mac/svg/W3C-SVG-1.1/pservers-grad-10-b-expected.png differ
diff --git a/LayoutTests/svg/gradients/spreadMethod-expected.svg b/LayoutTests/svg/gradients/spreadMethod-expected.svg
new file mode 100644 (file)
index 0000000..cb49098
--- /dev/null
@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <rect x="10" y="35" width="115" height="55" fill="green"/>
+    <rect x="125" y="35" width="345" height="55" fill="blue"/>
+
+    <rect x="10" y="120" width="115" height="55" fill="green"/>
+    <rect x="125" y="120" width="115" height="55" fill="blue"/>
+    <rect x="240" y="120" width="115" height="55" fill="blue"/>
+    <rect x="355" y="120" width="115" height="55" fill="green"/>
+
+    <rect x="10" y="205" width="115" height="55" fill="green"/>
+    <rect x="125" y="205" width="115" height="55" fill="blue"/>
+    <rect x="240" y="205" width="115" height="55" fill="green"/>
+    <rect x="355" y="205" width="115" height="55" fill="blue"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethod.svg b/LayoutTests/svg/gradients/spreadMethod.svg
new file mode 100644 (file)
index 0000000..d822980
--- /dev/null
@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <linearGradient id="base-grad" x1="0" y1="0" x2="50%" y2="0">
+        <stop stop-color="green" offset="0"/>
+        <stop stop-color="green" offset="0.5"/>
+        <stop stop-color="blue" offset="0.5"/>
+        <stop stop-color="blue" offset="1"/>
+    </linearGradient>
+
+    <linearGradient id="pad-grad" xlink:href="#base-grad" spreadMethod="pad" />
+    <linearGradient id="pad-reflect" xlink:href="#base-grad" spreadMethod="reflect" />
+    <linearGradient id="pad-repeat" xlink:href="#base-grad" spreadMethod="repeat" />
+
+    <rect x="10" y="35" width="460" height="55" fill="url(#pad-grad)"/>
+
+    <rect x="10" y="120" width="460" height="55" fill="url(#pad-reflect)"/>
+
+    <rect x="10" y="205" width="460" height="55" fill="url(#pad-repeat)"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodAlpha-expected.svg b/LayoutTests/svg/gradients/spreadMethodAlpha-expected.svg
new file mode 100644 (file)
index 0000000..0f34829
--- /dev/null
@@ -0,0 +1,13 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <rect x="10" y="35" width="115" height="55" fill="rgba(0,0,255,0.5)"/>
+    <rect x="125" y="35" width="345" height="55" fill="rgba(0,255,0,0.5)"/>
+
+    <rect x="10" y="120" width="115" height="55" fill="rgba(0,0,255,0.5)"/>
+    <rect x="125" y="120" width="230" height="55" fill="rgba(0,255,0,0.5)"/>
+    <rect x="355" y="120" width="115" height="55" fill="rgba(0,0,255,0.5)"/>
+
+    <rect x="10" y="205" width="115" height="55" fill="rgba(0,0,255,0.5)"/>
+    <rect x="125" y="205" width="115" height="55" fill="rgba(0,255,0,0.5)"/>
+    <rect x="240" y="205" width="115" height="55" fill="rgba(0,0,255,0.5)"/>
+    <rect x="355" y="205" width="115" height="55" fill="rgba(0,255,0,0.5)"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodAlpha.svg b/LayoutTests/svg/gradients/spreadMethodAlpha.svg
new file mode 100644 (file)
index 0000000..82cb08c
--- /dev/null
@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <linearGradient id="base-grad" x1="0" y1="0" x2="50%" y2="0">
+        <stop stop-color="rgba(0,0,255,0.5)" offset="0"/>
+        <stop stop-color="rgba(0,0,255,0.5)" offset="0.5"/>
+        <stop stop-color="rgba(0,255,0,0.5)" offset="0.5"/>
+        <stop stop-color="rgba(0,255,0,0.5)" offset="1"/>
+    </linearGradient>
+
+    <linearGradient id="pad-grad" xlink:href="#base-grad" spreadMethod="pad" />
+    <linearGradient id="pad-reflect" xlink:href="#base-grad" spreadMethod="reflect" />
+    <linearGradient id="pad-repeat" xlink:href="#base-grad" spreadMethod="repeat" />
+
+    <rect x="10" y="35" width="460" height="55" fill="url(#pad-grad)"/>
+
+    <rect x="10" y="120" width="460" height="55" fill="url(#pad-reflect)"/>
+
+    <rect x="10" y="205" width="460" height="55" fill="url(#pad-repeat)"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodClose0-expected-mismatch.svg b/LayoutTests/svg/gradients/spreadMethodClose0-expected-mismatch.svg
new file mode 100644 (file)
index 0000000..1b35d04
--- /dev/null
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <rect x="10" y="35" width="460" height="55" fill="green"/>
+  <rect x="10" y="120" width="460" height="55" fill="green"/>
+  <rect x="10" y="205" width="460" height="55" fill="green"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodClose0.svg b/LayoutTests/svg/gradients/spreadMethodClose0.svg
new file mode 100644 (file)
index 0000000..44f367e
--- /dev/null
@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <linearGradient id="base-grad" x1="0.49" y1="0" x2="0.5" y2="0">
+        <stop stop-color="green" offset="0"/>
+        <stop stop-color="green" offset="0.5"/>
+        <stop stop-color="blue" offset="0.5"/>
+        <stop stop-color="blue" offset="1"/>
+    </linearGradient>
+
+    <linearGradient id="pad-grad" xlink:href="#base-grad" spreadMethod="pad" />
+    <linearGradient id="pad-reflect" xlink:href="#base-grad" spreadMethod="reflect" />
+    <linearGradient id="pad-repeat" xlink:href="#base-grad" spreadMethod="repeat" />
+
+    <rect x="10" y="35" width="100" height="55" fill="url(#pad-grad)"/>
+
+    <rect x="10" y="120" width="100" height="55" fill="url(#pad-reflect)"/>
+
+    <rect x="10" y="205" width="100" height="55" fill="url(#pad-repeat)"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodClose1-expected-mismatch.svg b/LayoutTests/svg/gradients/spreadMethodClose1-expected-mismatch.svg
new file mode 100644 (file)
index 0000000..1b35d04
--- /dev/null
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <rect x="10" y="35" width="460" height="55" fill="green"/>
+  <rect x="10" y="120" width="460" height="55" fill="green"/>
+  <rect x="10" y="205" width="460" height="55" fill="green"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodClose1.svg b/LayoutTests/svg/gradients/spreadMethodClose1.svg
new file mode 100644 (file)
index 0000000..607dca2
--- /dev/null
@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <linearGradient id="base-grad" x1="0.4999999" y1="0" x2="0.5" y2="0">
+        <stop stop-color="green" offset="0"/>
+        <stop stop-color="green" offset="0.5"/>
+        <stop stop-color="blue" offset="0.5"/>
+        <stop stop-color="blue" offset="1"/>
+    </linearGradient>
+
+    <linearGradient id="pad-grad" xlink:href="#base-grad" spreadMethod="pad" />
+    <linearGradient id="pad-reflect" xlink:href="#base-grad" spreadMethod="reflect" />
+    <linearGradient id="pad-repeat" xlink:href="#base-grad" spreadMethod="repeat" />
+
+    <rect x="10" y="35" width="100" height="55" fill="url(#pad-grad)"/>
+
+    <rect x="10" y="120" width="100" height="55" fill="url(#pad-reflect)"/>
+
+    <rect x="10" y="205" width="100" height="55" fill="url(#pad-repeat)"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodClose2-expected.svg b/LayoutTests/svg/gradients/spreadMethodClose2-expected.svg
new file mode 100644 (file)
index 0000000..a0ab55f
--- /dev/null
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <rect x="10" y="35" width="460" height="55" fill="green"/>
+    <rect x="10" y="120" width="460" height="55" fill="green"/>
+    <rect x="10" y="205" width="460" height="55" fill="green"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodClose2.svg b/LayoutTests/svg/gradients/spreadMethodClose2.svg
new file mode 100644 (file)
index 0000000..578dcac
--- /dev/null
@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <linearGradient id="base-grad" x1="0.5" y1="0" x2="0.5" y2="0">
+        <stop stop-color="green" offset="0"/>
+        <stop stop-color="green" offset="0.5"/>
+        <stop stop-color="blue" offset="0.5"/>
+        <stop stop-color="blue" offset="1"/>
+    </linearGradient>
+
+    <linearGradient id="pad-grad" xlink:href="#base-grad" spreadMethod="pad" />
+    <linearGradient id="pad-reflect" xlink:href="#base-grad" spreadMethod="reflect" />
+    <linearGradient id="pad-repeat" xlink:href="#base-grad" spreadMethod="repeat" />
+
+    <rect x="10" y="35" width="460" height="55" fill="url(#pad-grad)"/>
+
+    <rect x="10" y="120" width="460" height="55" fill="url(#pad-reflect)"/>
+
+    <rect x="10" y="205" width="460" height="55" fill="url(#pad-repeat)"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodDiagonal-expected.svg b/LayoutTests/svg/gradients/spreadMethodDiagonal-expected.svg
new file mode 100644 (file)
index 0000000..210c331
--- /dev/null
@@ -0,0 +1,22 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <rect x="10" y="35" width="460" height="13.75" fill="green"/>
+    <rect x="10" y="48.75" width="460" height="41.25" fill="blue"/>
+
+    <rect x="10" y="120" width="460" height="13.75" fill="green"/>
+    <rect x="10" y="133.75" width="460" height="27.5" fill="blue"/>
+    <rect x="10" y="161.25" width="460" height="13.75" fill="green"/>
+
+    <rect x="10" y="205" width="460" height="13.75" fill="green"/>
+    <rect x="10" y="218.75" width="460" height="13.75" fill="blue"/>
+    <rect x="10" y="232.5" width="460" height="13.75" fill="green"/>
+    <rect x="10" y="246.25" width="460" height="13.75" fill="blue"/>
+
+    <rect x="10" y="48" width="460" height="2" fill="grey"/>
+
+    <rect x="10" y="133" width="460" height="2" fill="grey"/>
+    <rect x="10" y="161" width="460" height="2" fill="grey"/>
+
+    <rect x="10" y="218" width="460" height="2" fill="grey"/>
+    <rect x="10" y="232" width="460" height="2" fill="grey"/>
+    <rect x="10" y="246" width="460" height="2" fill="grey"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodDiagonal.svg b/LayoutTests/svg/gradients/spreadMethodDiagonal.svg
new file mode 100644 (file)
index 0000000..8f759a1
--- /dev/null
@@ -0,0 +1,27 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <linearGradient id="base-grad" x1="0" y1="0" x2="50%" y2="0">
+        <stop stop-color="green" offset="0"/>
+        <stop stop-color="green" offset="0.5"/>
+        <stop stop-color="blue" offset="0.5"/>
+        <stop stop-color="blue" offset="1"/>
+    </linearGradient>
+
+    <linearGradient id="pad-grad" xlink:href="#base-grad" spreadMethod="pad" gradientTransform="rotate(90)" />
+    <linearGradient id="pad-reflect" xlink:href="#base-grad" spreadMethod="reflect" gradientTransform="rotate(90)" />
+    <linearGradient id="pad-repeat" xlink:href="#base-grad" spreadMethod="repeat" gradientTransform="rotate(90)" />
+
+    <rect x="10" y="35" width="460" height="55" fill="url(#pad-grad)"/>
+
+    <rect x="10" y="120" width="460" height="55" fill="url(#pad-reflect)"/>
+
+    <rect x="10" y="205" width="460" height="55" fill="url(#pad-repeat)"/>
+
+    <rect x="10" y="48" width="460" height="2" fill="grey"/>
+
+    <rect x="10" y="133" width="460" height="2" fill="grey"/>
+    <rect x="10" y="161" width="460" height="2" fill="grey"/>
+
+    <rect x="10" y="218" width="460" height="2" fill="grey"/>
+    <rect x="10" y="232" width="460" height="2" fill="grey"/>
+    <rect x="10" y="246" width="460" height="2" fill="grey"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodDiagonal2-expected.svg b/LayoutTests/svg/gradients/spreadMethodDiagonal2-expected.svg
new file mode 100644 (file)
index 0000000..210c331
--- /dev/null
@@ -0,0 +1,22 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <rect x="10" y="35" width="460" height="13.75" fill="green"/>
+    <rect x="10" y="48.75" width="460" height="41.25" fill="blue"/>
+
+    <rect x="10" y="120" width="460" height="13.75" fill="green"/>
+    <rect x="10" y="133.75" width="460" height="27.5" fill="blue"/>
+    <rect x="10" y="161.25" width="460" height="13.75" fill="green"/>
+
+    <rect x="10" y="205" width="460" height="13.75" fill="green"/>
+    <rect x="10" y="218.75" width="460" height="13.75" fill="blue"/>
+    <rect x="10" y="232.5" width="460" height="13.75" fill="green"/>
+    <rect x="10" y="246.25" width="460" height="13.75" fill="blue"/>
+
+    <rect x="10" y="48" width="460" height="2" fill="grey"/>
+
+    <rect x="10" y="133" width="460" height="2" fill="grey"/>
+    <rect x="10" y="161" width="460" height="2" fill="grey"/>
+
+    <rect x="10" y="218" width="460" height="2" fill="grey"/>
+    <rect x="10" y="232" width="460" height="2" fill="grey"/>
+    <rect x="10" y="246" width="460" height="2" fill="grey"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodDiagonal2.svg b/LayoutTests/svg/gradients/spreadMethodDiagonal2.svg
new file mode 100644 (file)
index 0000000..7659665
--- /dev/null
@@ -0,0 +1,27 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <linearGradient id="base-grad" x1="0" y1="0" x2="0" y2="50%">
+        <stop stop-color="green" offset="0"/>
+        <stop stop-color="green" offset="0.5"/>
+        <stop stop-color="blue" offset="0.5"/>
+        <stop stop-color="blue" offset="1"/>
+    </linearGradient>
+
+    <linearGradient id="pad-grad" xlink:href="#base-grad" spreadMethod="pad" />
+    <linearGradient id="pad-reflect" xlink:href="#base-grad" spreadMethod="reflect" />
+    <linearGradient id="pad-repeat" xlink:href="#base-grad" spreadMethod="repeat" />
+
+    <rect x="10" y="35" width="460" height="55" fill="url(#pad-grad)"/>
+
+    <rect x="10" y="120" width="460" height="55" fill="url(#pad-reflect)"/>
+
+    <rect x="10" y="205" width="460" height="55" fill="url(#pad-repeat)"/>
+
+    <rect x="10" y="48" width="460" height="2" fill="grey"/>
+
+    <rect x="10" y="133" width="460" height="2" fill="grey"/>
+    <rect x="10" y="161" width="460" height="2" fill="grey"/>
+
+    <rect x="10" y="218" width="460" height="2" fill="grey"/>
+    <rect x="10" y="232" width="460" height="2" fill="grey"/>
+    <rect x="10" y="246" width="460" height="2" fill="grey"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodDiagonal3-expected.svg b/LayoutTests/svg/gradients/spreadMethodDiagonal3-expected.svg
new file mode 100644 (file)
index 0000000..124a13d
--- /dev/null
@@ -0,0 +1,56 @@
+<html><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="2000px" height="2000px">
+    <linearGradient id="base-grad" x1="-100%" y1="-100%" x2="-50%" y2="-50%">
+        <stop stop-color="green" offset="0"/>
+        <stop stop-color="green" offset="0.5"/>
+        <stop stop-color="blue" offset="0.5"/>
+        <stop stop-color="blue" offset="1"/>
+    </linearGradient>
+
+    <linearGradient id="pad-grad" xlink:href="#base-grad" spreadMethod="pad" />
+    <linearGradient id="pad-reflect" xlink:href="#base-grad" spreadMethod="reflect" />
+    <linearGradient id="pad-repeat" xlink:href="#base-grad" spreadMethod="repeat" />
+
+    <mask id="mymask">
+      <g transform="translate(-10 -50) scale(0.5) rotate(-7) translate(-200 0)">
+        <rect x="100" y="400" width="1100" height="105" fill="white" />
+      </g>
+    </mask>
+    <!-- Invert the mask for the other rect, so that we don't get anti-aliasing differences -->
+    <mask id="mymask-inv">
+      <rect x="0" y="0" width="2000" height="2000" fill="white" />
+      <g transform="translate(-10 -50) scale(0.5) rotate(-7) translate(-200 0)">
+        <rect x="100" y="400" width="1100" height="105" fill="black" />
+      </g>
+    </mask>
+
+    <mask id="mymask2">
+      <g transform="translate(-10 -50) scale(0.5) rotate(-7) translate(-200 0)">
+        <rect x="100" y="510" width="1100" height="55" fill="white" />
+        <rect x="100" y="620" width="1100" height="55" fill="white" />
+      </g>
+    </mask>
+    <mask id="mymask2-inv">
+      <rect x="0" y="0" width="2000" height="2000" fill="white" />
+      <g transform="translate(-10 -50) scale(0.5) rotate(-7) translate(-200 0)">
+        <rect x="100" y="510" width="1100" height="55" fill="black" />
+        <rect x="100" y="620" width="1100" height="55" fill="black" />
+      </g>
+    </mask>
+
+    <g transform="translate(200 0) rotate(7) scale(2)">
+      <rect x="10" y="35" width="460" height="55" fill="blue"/>
+
+      <rect x="10" y="120" width="460" height="55" fill="green" mask="url(#mymask-inv)"/>
+      <rect x="10" y="120" width="460" height="55" fill="blue" mask="url(#mymask)" />
+
+      <rect x="10" y="205" width="460" height="55" fill="blue" mask="url(#mymask2-inv)"/>
+      <rect x="10" y="205" width="460" height="55" fill="green" mask="url(#mymask2)"/>
+    </g>
+
+    <rect x="180" y="65" width="50" height="55" fill="grey" />
+    <rect x="100" y="295" width="1100" height="10" fill="grey" />
+    <rect x="100" y="400" width="1100" height="10" fill="grey" />
+    <rect x="100" y="460" width="1100" height="10" fill="grey" />
+    <rect x="100" y="517" width="1100" height="10" fill="grey" />
+    <rect x="100" y="570" width="1100" height="10" fill="grey" />
+</svg></html>
diff --git a/LayoutTests/svg/gradients/spreadMethodDiagonal3.svg b/LayoutTests/svg/gradients/spreadMethodDiagonal3.svg
new file mode 100644 (file)
index 0000000..60827e4
--- /dev/null
@@ -0,0 +1,27 @@
+<html><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="2000px" height="2000px">
+    <linearGradient id="base-grad" x1="-100%" y1="-100%" x2="-50%" y2="-50%">
+        <stop stop-color="green" offset="0"/>
+        <stop stop-color="green" offset="0.5"/>
+        <stop stop-color="blue" offset="0.5"/>
+        <stop stop-color="blue" offset="1"/>
+    </linearGradient>
+
+    <linearGradient id="pad-grad" xlink:href="#base-grad" spreadMethod="pad" />
+    <linearGradient id="pad-reflect" xlink:href="#base-grad" spreadMethod="reflect" />
+    <linearGradient id="pad-repeat" xlink:href="#base-grad" spreadMethod="repeat" />
+
+    <g transform="translate(200 0) rotate(7) scale(2)">
+      <rect x="10" y="35" width="460" height="55" fill="url(#pad-grad)"/>
+
+      <rect x="10" y="120" width="460" height="55" fill="url(#pad-reflect)"/>
+
+      <rect x="10" y="205" width="460" height="55" fill="url(#pad-repeat)"/>
+    </g>
+
+    <rect x="180" y="65" width="50" height="55" fill="grey" />
+    <rect x="100" y="295" width="1100" height="10" fill="grey" />
+    <rect x="100" y="400" width="1100" height="10" fill="grey" />
+    <rect x="100" y="460" width="1100" height="10" fill="grey" />
+    <rect x="100" y="517" width="1100" height="10" fill="grey" />
+    <rect x="100" y="570" width="1100" height="10" fill="grey" />
+</svg></html>
diff --git a/LayoutTests/svg/gradients/spreadMethodDiagonal4-expected.svg b/LayoutTests/svg/gradients/spreadMethodDiagonal4-expected.svg
new file mode 100644 (file)
index 0000000..f5fc58e
--- /dev/null
@@ -0,0 +1,70 @@
+<html><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="2000px" height="2000px">
+    <linearGradient id="base-grad" x1="-100%" y1="-100%" x2="-50%" y2="-50%">
+        <stop stop-color="green" offset="0"/>
+        <stop stop-color="green" offset="0.5"/>
+        <stop stop-color="blue" offset="0.5"/>
+        <stop stop-color="blue" offset="1"/>
+    </linearGradient>
+
+    <linearGradient id="pad-grad" xlink:href="#base-grad" spreadMethod="pad" />
+    <linearGradient id="pad-reflect" xlink:href="#base-grad" spreadMethod="reflect" />
+    <linearGradient id="pad-repeat" xlink:href="#base-grad" spreadMethod="repeat" />
+
+    <mask id="mymask0">
+      <g transform="translate(-10 -50) scale(0.5) rotate(-7) translate(-200 0)">
+        <rect x="100" y="120" width="1100" height="105" fill="white" />
+      </g>
+    </mask>
+    <mask id="mymask0-inv">
+      <rect x="0" y="0" width="2000" height="2000" fill="white" />
+      <g transform="translate(-10 -50) scale(0.5) rotate(-7) translate(-200 0)">
+        <rect x="100" y="120" width="1100" height="105" fill="black" />
+      </g>
+    </mask>
+
+    <mask id="mymask">
+      <g transform="translate(-10 -50) scale(0.5) rotate(-7) translate(-200 0)">
+        <rect x="100" y="400" width="1100" height="105" fill="white" />
+      </g>
+    </mask>
+    <mask id="mymask-inv">
+      <rect x="0" y="0" width="2000" height="2000" fill="white" />
+      <g transform="translate(-10 -50) scale(0.5) rotate(-7) translate(-200 0)">
+        <rect x="100" y="400" width="1100" height="105" fill="black" />
+      </g>
+    </mask>
+
+    <mask id="mymask2">
+      <g transform="translate(-10 -50) scale(0.5) rotate(-7) translate(-200 0)">
+        <rect x="100" y="510" width="1100" height="55" fill="white" />
+        <rect x="100" y="620" width="1100" height="55" fill="white" />
+      </g>
+    </mask>
+    <mask id="mymask2-inv">
+      <rect x="0" y="0" width="2000" height="2000" fill="white" />
+      <g transform="translate(-10 -50) scale(0.5) rotate(-7) translate(-200 0)">
+        <rect x="100" y="510" width="1100" height="55" fill="black" />
+        <rect x="100" y="620" width="1100" height="55" fill="black" />
+      </g>
+    </mask>
+
+    <g transform="translate(200 0) rotate(7) scale(2)">
+      <rect x="10" y="35" width="460" height="55" fill="blue" mask="url(#mymask0-inv)"/>
+      <rect x="10" y="35" width="460" height="55" fill="green" mask="url(#mymask0)" />
+
+      <rect x="10" y="120" width="460" height="55" fill="green" mask="url(#mymask-inv)"/>
+      <rect x="10" y="120" width="460" height="55" fill="blue" mask="url(#mymask)" />
+
+      <rect x="10" y="205" width="460" height="55" fill="blue" mask="url(#mymask2-inv)"/>
+      <rect x="10" y="205" width="460" height="55" fill="green" mask="url(#mymask2)"/>
+    </g>
+
+    <rect x="180" y="65" width="50" height="55" fill="grey" />
+
+    <rect x="100" y="120" width="1100" height="10" fill="grey" />
+    <rect x="100" y="295" width="1100" height="10" fill="grey" />
+    <rect x="100" y="400" width="1100" height="10" fill="grey" />
+    <rect x="100" y="460" width="1100" height="10" fill="grey" />
+    <rect x="100" y="517" width="1100" height="10" fill="grey" />
+    <rect x="100" y="570" width="1100" height="10" fill="grey" />
+</svg></html>
diff --git a/LayoutTests/svg/gradients/spreadMethodDiagonal4.svg b/LayoutTests/svg/gradients/spreadMethodDiagonal4.svg
new file mode 100644 (file)
index 0000000..2a25866
--- /dev/null
@@ -0,0 +1,28 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="2000px" height="2000px">
+    <linearGradient id="base-grad" x1="0" y1="0" x2="50%" y2="50%">
+        <stop stop-color="green" offset="0"/>
+        <stop stop-color="green" offset="0.5"/>
+        <stop stop-color="blue" offset="0.5"/>
+        <stop stop-color="blue" offset="1"/>
+    </linearGradient>
+
+    <linearGradient id="pad-grad" xlink:href="#base-grad" spreadMethod="pad" />
+    <linearGradient id="pad-reflect" xlink:href="#base-grad" spreadMethod="reflect" />
+    <linearGradient id="pad-repeat" xlink:href="#base-grad" spreadMethod="repeat" />
+
+    <g transform="translate(200 0) rotate(7) scale(2)">
+      <rect x="10" y="35" width="460" height="55" fill="url(#pad-grad)"/>
+
+      <rect x="10" y="120" width="460" height="55" fill="url(#pad-reflect)"/>
+
+      <rect x="10" y="205" width="460" height="55" fill="url(#pad-repeat)"/>
+    </g>
+
+    <rect x="180" y="65" width="50" height="55" fill="grey" />
+    <rect x="100" y="120" width="1100" height="10" fill="grey" />
+    <rect x="100" y="295" width="1100" height="10" fill="grey" />
+    <rect x="100" y="400" width="1100" height="10" fill="grey" />
+    <rect x="100" y="460" width="1100" height="10" fill="grey" />
+    <rect x="100" y="517" width="1100" height="10" fill="grey" />
+    <rect x="100" y="570" width="1100" height="10" fill="grey" />
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodDuplicateStop-expected.svg b/LayoutTests/svg/gradients/spreadMethodDuplicateStop-expected.svg
new file mode 100644 (file)
index 0000000..cb49098
--- /dev/null
@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <rect x="10" y="35" width="115" height="55" fill="green"/>
+    <rect x="125" y="35" width="345" height="55" fill="blue"/>
+
+    <rect x="10" y="120" width="115" height="55" fill="green"/>
+    <rect x="125" y="120" width="115" height="55" fill="blue"/>
+    <rect x="240" y="120" width="115" height="55" fill="blue"/>
+    <rect x="355" y="120" width="115" height="55" fill="green"/>
+
+    <rect x="10" y="205" width="115" height="55" fill="green"/>
+    <rect x="125" y="205" width="115" height="55" fill="blue"/>
+    <rect x="240" y="205" width="115" height="55" fill="green"/>
+    <rect x="355" y="205" width="115" height="55" fill="blue"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodDuplicateStop.svg b/LayoutTests/svg/gradients/spreadMethodDuplicateStop.svg
new file mode 100644 (file)
index 0000000..d52dcb8
--- /dev/null
@@ -0,0 +1,19 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <linearGradient id="base-grad" x1="0" y1="0" x2="0.5" y2="0">
+        <stop stop-color="green" offset="0"/>
+        <stop stop-color="green" offset="0.5"/>
+        <stop stop-color="red" offset="0.5"/>
+        <stop stop-color="blue" offset="0.5"/>
+        <stop stop-color="blue" offset="1"/>
+    </linearGradient>
+
+    <linearGradient id="pad-grad" xlink:href="#base-grad" spreadMethod="pad" />
+    <linearGradient id="pad-reflect" xlink:href="#base-grad" spreadMethod="reflect" />
+    <linearGradient id="pad-repeat" xlink:href="#base-grad" spreadMethod="repeat" />
+
+    <rect x="10" y="35" width="460" height="55" fill="url(#pad-grad)"/>
+
+    <rect x="10" y="120" width="460" height="55" fill="url(#pad-reflect)"/>
+
+    <rect x="10" y="205" width="460" height="55" fill="url(#pad-repeat)"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodReversed-expected.svg b/LayoutTests/svg/gradients/spreadMethodReversed-expected.svg
new file mode 100644 (file)
index 0000000..aa7f212
--- /dev/null
@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <rect x="10" y="35" width="115" height="55" fill="blue"/>
+    <rect x="125" y="35" width="345" height="55" fill="green"/>
+
+    <rect x="10" y="120" width="115" height="55" fill="blue"/>
+    <rect x="125" y="120" width="115" height="55" fill="green"/>
+    <rect x="240" y="120" width="115" height="55" fill="green"/>
+    <rect x="355" y="120" width="115" height="55" fill="blue"/>
+
+    <rect x="10" y="205" width="115" height="55" fill="blue"/>
+    <rect x="125" y="205" width="115" height="55" fill="green"/>
+    <rect x="240" y="205" width="115" height="55" fill="blue"/>
+    <rect x="355" y="205" width="115" height="55" fill="green"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/spreadMethodReversed.svg b/LayoutTests/svg/gradients/spreadMethodReversed.svg
new file mode 100644 (file)
index 0000000..3c192a1
--- /dev/null
@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <linearGradient id="base-grad" x1="50%" y1="0" x2="0" y2="0">
+        <stop stop-color="green" offset="0"/>
+        <stop stop-color="green" offset="0.5"/>
+        <stop stop-color="blue" offset="0.5"/>
+        <stop stop-color="blue" offset="1"/>
+    </linearGradient>
+
+    <linearGradient id="pad-grad" xlink:href="#base-grad" spreadMethod="pad" />
+    <linearGradient id="pad-reflect" xlink:href="#base-grad" spreadMethod="reflect" />
+    <linearGradient id="pad-repeat" xlink:href="#base-grad" spreadMethod="repeat" />
+
+    <rect x="10" y="35" width="460" height="55" fill="url(#pad-grad)"/>
+
+    <rect x="10" y="120" width="460" height="55" fill="url(#pad-reflect)"/>
+
+    <rect x="10" y="205" width="460" height="55" fill="url(#pad-repeat)"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/stopAlpha-expected.svg b/LayoutTests/svg/gradients/stopAlpha-expected.svg
new file mode 100644 (file)
index 0000000..382ed92
--- /dev/null
@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <rect x="10" y="35" width="115" height="55" fill="rgba(0,255,0,0.25)"/>
+    <rect x="125" y="35" width="345" height="55" fill="rgba(0,0,255,0.25)"/>
+
+    <rect x="10" y="120" width="115" height="55" fill="rgba(0,255,0,0.25)"/>
+    <rect x="125" y="120" width="115" height="55" fill="rgba(0,0,255,0.25)"/>
+    <rect x="240" y="120" width="115" height="55" fill="rgba(0,0,255,0.25)"/>
+    <rect x="355" y="120" width="115" height="55" fill="rgba(0,255,0,0.25)"/>
+
+    <rect x="10" y="205" width="115" height="55" fill="rgba(0,255,0,0.25)"/>
+    <rect x="125" y="205" width="115" height="55" fill="rgba(0,0,255,0.25)"/>
+    <rect x="240" y="205" width="115" height="55" fill="rgba(0,255,0,0.25)"/>
+    <rect x="355" y="205" width="115" height="55" fill="rgba(0,0,255,0.25)"/>
+</svg>
diff --git a/LayoutTests/svg/gradients/stopAlpha.svg b/LayoutTests/svg/gradients/stopAlpha.svg
new file mode 100644 (file)
index 0000000..bcfbd7b
--- /dev/null
@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <linearGradient id="base-grad" x1="0" y1="0" x2="50%" y2="0">
+        <stop stop-color="rgba(0,255,0,0.5)" offset="0" stop-opacity="0.5" />
+        <stop stop-color="rgba(0,255,0,0.5)" offset="0.5" stop-opacity="0.5" />
+        <stop stop-color="rgba(0,0,255,0.5)" offset="0.5" stop-opacity="0.5" />
+        <stop stop-color="rgba(0,0,255,0.5)" offset="1" stop-opacity="0.5" />
+    </linearGradient>
+
+    <linearGradient id="pad-grad" xlink:href="#base-grad" spreadMethod="pad" />
+    <linearGradient id="pad-reflect" xlink:href="#base-grad" spreadMethod="reflect" />
+    <linearGradient id="pad-repeat" xlink:href="#base-grad" spreadMethod="repeat" />
+
+    <rect x="10" y="35" width="460" height="55" fill="url(#pad-grad)"/>
+
+    <rect x="10" y="120" width="460" height="55" fill="url(#pad-reflect)"/>
+
+    <rect x="10" y="205" width="460" height="55" fill="url(#pad-repeat)"/>
+</svg>
index 44a7cfc..4e234db 100644 (file)
@@ -1,3 +1,39 @@
+2018-09-14  Justin Michaud  <justin_michaud@apple.com>
+
+        Add support for spreadMethod=reflect and repeat on SVG gradients (for CoreGraphics platforms)
+        https://bugs.webkit.org/show_bug.cgi?id=5968
+
+        Add support for spreadMethod=repeat and reflect. Also, the opacity of a gradient is now
+        the result of multiplying stop-opacity with the opacity of the color.
+
+        Reviewed by Simon Fraser.
+
+        Tests: svg/gradients/spreadMethod-expected.svg
+               svg/gradients/spreadMethod.svg
+               svg/gradients/spreadMethodAlpha-expected.svg
+               svg/gradients/spreadMethodAlpha.svg
+               svg/gradients/spreadMethodClose0-expected-mismatch.svg
+               svg/gradients/spreadMethodClose0.svg
+               svg/gradients/spreadMethodClose1-expected-mismatch.svg
+               svg/gradients/spreadMethodClose1.svg
+               svg/gradients/spreadMethodClose2-expected.svg
+               svg/gradients/spreadMethodClose2.svg
+               svg/gradients/spreadMethodDiagonal-expected.svg
+               svg/gradients/spreadMethodDiagonal.svg
+               svg/gradients/spreadMethodDiagonal2-expected.svg
+               svg/gradients/spreadMethodDiagonal2.svg
+               svg/gradients/spreadMethodDuplicateStop-expected.svg
+               svg/gradients/spreadMethodDuplicateStop.svg
+               svg/gradients/spreadMethodReversed-expected.svg
+               svg/gradients/spreadMethodReversed.svg
+               svg/gradients/stopAlpha-expected.svg
+               svg/gradients/stopAlpha.svg
+
+        * platform/graphics/cg/GradientCG.cpp:
+        (WebCore::Gradient::paint):
+        * svg/SVGStopElement.cpp:
+        (WebCore::SVGStopElement::stopColorIncludingOpacity const):
+
 2018-09-14  Ryan Haddad  <ryanhaddad@apple.com>
 
         Unreviewed, attempt to fix the iOSMac build after r236015.
index 93e50d7..0ef4f65 100644 (file)
@@ -106,10 +106,63 @@ void Gradient::paint(GraphicsContext& context)
 void Gradient::paint(CGContextRef platformContext)
 {
     CGGradientDrawingOptions extendOptions = kCGGradientDrawsBeforeStartLocation | kCGGradientDrawsAfterEndLocation;
+    CGGradientRef gradient = platformGradient();
 
     WTF::switchOn(m_data,
         [&] (const LinearData& data) {
-            CGContextDrawLinearGradient(platformContext, platformGradient(), data.point0, data.point1, extendOptions);
+            switch (m_spreadMethod) {
+            case SpreadMethodRepeat:
+            case SpreadMethodReflect: {
+                CGContextStateSaver saveState(platformContext);
+
+                FloatPoint gradientVectorNorm(data.point1 - data.point0);
+                gradientVectorNorm.normalize();
+                CGFloat angle = acos(gradientVectorNorm.dot({ 1, 0 }));
+                CGContextRotateCTM(platformContext, angle);
+
+                CGAffineTransform transform = CGAffineTransformMakeRotation(-angle);
+                FloatPoint point0 = CGPointApplyAffineTransform(data.point0, transform);
+                FloatPoint point1 = CGPointApplyAffineTransform(data.point1, transform);
+
+                CGRect boundingBox = CGContextGetClipBoundingBox(platformContext);
+                CGFloat width = point1.x() - point0.x();
+                CGFloat pixelSize = CGFAbs(CGContextConvertSizeToUserSpace(platformContext, CGSizeMake(1, 1)).width);
+
+                if (width > 0 && !CGRectIsInfinite(boundingBox) && !CGRectIsEmpty(boundingBox)) {
+                    extendOptions = 0;
+                    if (width < pixelSize)
+                        width = pixelSize;
+
+                    CGFloat gradientStart = point0.x();
+                    CGFloat gradientEnd = point1.x();
+                    bool flip = m_spreadMethod == SpreadMethodReflect;
+
+                    // Find first gradient position to the left of the bounding box
+                    int n = CGFloor((boundingBox.origin.x - gradientStart) / width);
+                    gradientStart += n * width;
+                    if (!(n % 2))
+                        flip = false;
+
+                    gradientEnd -= CGFloor((gradientEnd - CGRectGetMaxX(boundingBox)) / width) * width;
+
+                    for (CGFloat start = gradientStart; start <= gradientEnd; start += width) {
+                        CGPoint left = CGPointMake(flip ? start + width : start, boundingBox.origin.y);
+                        CGPoint right = CGPointMake(flip ? start : start + width, boundingBox.origin.y);
+
+                        CGContextDrawLinearGradient(platformContext, gradient, left, right, extendOptions);
+
+                        if (m_spreadMethod == SpreadMethodReflect)
+                            flip = !flip;
+                    }
+
+                    break;
+                }
+
+                FALLTHROUGH;
+            }
+            case SpreadMethodPad:
+                CGContextDrawLinearGradient(platformContext, gradient, data.point0, data.point1, extendOptions);
+            }
         },
         [&] (const RadialData& data) {
             bool needScaling = data.aspectRatio != 1;
@@ -123,7 +176,7 @@ void Gradient::paint(CGContextRef platformContext)
                 CGContextTranslateCTM(platformContext, -data.point0.x(), -data.point0.y());
             }
 
-            CGContextDrawRadialGradient(platformContext, platformGradient(), data.point0, data.startRadius, data.point1, data.endRadius, extendOptions);
+            CGContextDrawRadialGradient(platformContext, gradient, data.point0, data.startRadius, data.point1, data.endRadius, extendOptions);
 
             if (needScaling)
                 CGContextRestoreGState(platformContext);
index 2ab2afb..ecc20c4 100644 (file)
@@ -99,7 +99,8 @@ Color SVGStopElement::stopColorIncludingOpacity() const
         return Color(Color::transparent, true); // Transparent black.
 
     const SVGRenderStyle& svgStyle = style->svgStyle();
-    return colorWithOverrideAlpha(svgStyle.stopColor().rgb(), svgStyle.stopOpacity());
+    float colorAlpha = svgStyle.stopColor().alpha() / 255.0;
+    return colorWithOverrideAlpha(svgStyle.stopColor().rgb(), colorAlpha * svgStyle.stopOpacity());
 }
 
 }