summaryrefslogtreecommitdiffstats
path: root/gfx/wr/wrench/reftests/gradient
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 01:47:29 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 01:47:29 +0000
commit0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d (patch)
treea31f07c9bcca9d56ce61e9a1ffd30ef350d513aa /gfx/wr/wrench/reftests/gradient
parentInitial commit. (diff)
downloadfirefox-esr-0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d.tar.xz
firefox-esr-0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d.zip
Adding upstream version 115.8.0esr.upstream/115.8.0esr
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'gfx/wr/wrench/reftests/gradient')
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-angle-wraparound-negative.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-angle-wraparound.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-angle.pngbin0 -> 24700 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-angle.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-backdrop-ref.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-backdrop-with-spacing-ref.yaml13
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-backdrop-with-spacing.yaml18
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-backdrop.yaml16
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-center.pngbin0 -> 1695 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-center.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-color-wheel.pngbin0 -> 35963 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-color-wheel.yaml14
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-large-hard-stop-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-large-hard-stop.yaml14
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-large-ref.yaml16
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-large.yaml12
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-nan.yaml41
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-ref.yaml18
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-simple.pngbin0 -> 24158 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic-simple.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/conic.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/gradient_cache_5stops.yaml13
-rw-r--r--gfx/wr/wrench/reftests/gradient/gradient_cache_5stops_ref.yaml18
-rw-r--r--gfx/wr/wrench/reftests/gradient/gradient_cache_5stops_vertical.yaml13
-rw-r--r--gfx/wr/wrench/reftests/gradient/gradient_cache_5stops_vertical_ref.yaml18
-rw-r--r--gfx/wr/wrench/reftests/gradient/gradient_cache_clamp.yaml20
-rw-r--r--gfx/wr/wrench/reftests/gradient/gradient_cache_clamp_ref.yaml30
-rw-r--r--gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop.yaml19
-rw-r--r--gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop_clip.yaml27
-rw-r--r--gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop_clip_ref.yaml41
-rw-r--r--gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop_ref.yaml24
-rw-r--r--gfx/wr/wrench/reftests/gradient/gradient_cache_repeat.yaml119
-rw-r--r--gfx/wr/wrench/reftests/gradient/gradient_cache_repeat_ref.yaml119
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-adjust-tile-size-ref.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-adjust-tile-size.yaml10
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-aligned-border-radius.pngbin0 -> 6851 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-aligned-border-radius.yaml46
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-aligned-clip-ref.yaml16
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-aligned-clip.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-backdrop-ref.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-backdrop-with-spacing-ref.yaml14
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-backdrop-with-spacing.yaml18
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-backdrop.yaml16
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-bug-1703141.yaml12
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-clamp-1-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-clamp-1a.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-clamp-1b.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-clamp-2-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-clamp-2.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-double.yaml13
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-far-endpoints.yaml10
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-hard-stop-ref.pngbin0 -> 2031 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-hard-stop-repeat-large-ref.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-hard-stop-repeat-large.yaml14
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-hard-stop.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-large-ref.yaml12
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-large.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-nan.yaml213
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-ref.pngbin0 -> 3227 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-ref.yaml18
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-repeat-clip-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-repeat-clip.yaml13
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-reverse-2-ref.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-reverse-2.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-reverse-3-ref.yaml13
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-reverse-3.yaml13
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-reverse.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-stops-ref.pngbin0 -> 7360 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear-stops.yaml7
-rw-r--r--gfx/wr/wrench/reftests/gradient/linear.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-conic-1-ref.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-conic-1.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-conic-2-ref.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-conic-2.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-conic-3-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-conic-3.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-conic-4-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-conic-4.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-conic-degenerate-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-conic-degenerate.yaml14
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-linear-1-ref.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-linear-1.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-linear-2-ref.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-linear-2.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-linear-3-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-linear-3.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-linear-4-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-linear-4.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-linear-degenerate-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-linear-degenerate.yaml14
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-radial-1-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-radial-1.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-radial-2-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-radial-2.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-radial-3-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-radial-3.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-radial-degenerate-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/norm-radial-degenerate.yaml14
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-aligned-2.pngbin0 -> 10340 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-aligned-2.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-aligned.pngbin0 -> 11635 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-aligned.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-angle-2.pngbin0 -> 19390 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-angle-2.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-angle.pngbin0 -> 18487 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-angle.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-conic-2.pngbin0 -> 14475 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-conic-2.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-conic.pngbin0 -> 16782 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-conic.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-radial-2.pngbin0 -> 14593 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-radial-2.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-radial.pngbin0 -> 18857 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/premultiplied-radial.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-backdrop-ref.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-backdrop-with-spacing-ref.yaml13
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-backdrop-with-spacing.yaml18
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-backdrop.yaml16
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-circle-ref.pngbin0 -> 27523 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-circle.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-ellipse-ref.pngbin0 -> 22812 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-ellipse.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-large-ref.pngbin0 -> 36904 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-large.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-nan.yaml35
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-optimized-2-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-optimized-2.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-optimized-ref.yaml33
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-optimized.yaml12
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-tiling-optimized-ref.yaml24
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-tiling-optimized.yaml13
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-zero-size-1.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-zero-size-2.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-zero-size-3.yaml6
-rw-r--r--gfx/wr/wrench/reftests/gradient/radial-zero-size-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/gradient/reftest.list128
-rw-r--r--gfx/wr/wrench/reftests/gradient/repeat-border-radius.pngbin0 -> 31999 bytes
-rw-r--r--gfx/wr/wrench/reftests/gradient/repeat-border-radius.yaml136
-rw-r--r--gfx/wr/wrench/reftests/gradient/repeat-conic-negative.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/repeat-conic-ref.yaml27
-rw-r--r--gfx/wr/wrench/reftests/gradient/repeat-conic.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/repeat-linear-ref.yaml27
-rw-r--r--gfx/wr/wrench/reftests/gradient/repeat-linear-reverse.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/repeat-linear.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/repeat-radial-negative.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/repeat-radial-ref.yaml38
-rw-r--r--gfx/wr/wrench/reftests/gradient/repeat-radial.yaml9
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-conic-1-ref.yaml27
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-conic-1.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-conic-2-ref.yaml27
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-conic-2.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-conic-3-ref.yaml27
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-conic-3.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-linear-1-ref.yaml27
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-linear-1.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-linear-2-ref.yaml27
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-linear-2.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-linear-3-ref.yaml15
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-linear-3.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-radial-1-ref.yaml27
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-radial-1.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-radial-2-ref.yaml27
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-radial-2.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-radial-3-ref.yaml27
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-radial-3.yaml11
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-radial-4-ref.yaml27
-rw-r--r--gfx/wr/wrench/reftests/gradient/tiling-radial-4.yaml11
167 files changed, 2639 insertions, 0 deletions
diff --git a/gfx/wr/wrench/reftests/gradient/conic-angle-wraparound-negative.yaml b/gfx/wr/wrench/reftests/gradient/conic-angle-wraparound-negative.yaml
new file mode 100644
index 0000000000..f2053c42b6
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-angle-wraparound-negative.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ angle: -5.497787143782138
+ stops: [0.0, red, 1.0, yellow] \ No newline at end of file
diff --git a/gfx/wr/wrench/reftests/gradient/conic-angle-wraparound.yaml b/gfx/wr/wrench/reftests/gradient/conic-angle-wraparound.yaml
new file mode 100644
index 0000000000..67a1370eac
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-angle-wraparound.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ angle: 7.0685834705770345
+ stops: [0.0, red, 1.0, yellow] \ No newline at end of file
diff --git a/gfx/wr/wrench/reftests/gradient/conic-angle.png b/gfx/wr/wrench/reftests/gradient/conic-angle.png
new file mode 100644
index 0000000000..81ec931cec
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-angle.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/conic-angle.yaml b/gfx/wr/wrench/reftests/gradient/conic-angle.yaml
new file mode 100644
index 0000000000..11a068c9e6
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-angle.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ angle: 0.7853981633974483
+ stops: [0.0, red, 1.0, yellow] \ No newline at end of file
diff --git a/gfx/wr/wrench/reftests/gradient/conic-backdrop-ref.yaml b/gfx/wr/wrench/reftests/gradient/conic-backdrop-ref.yaml
new file mode 100644
index 0000000000..e4d55171d3
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-backdrop-ref.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: 0 0 800 450
+ color: red
+ - type: conic-gradient
+ bounds: 0 0 800 450
+ center: 400 225
+ angle: 0.0
+ stops: [ 0.0, [255, 255, 255, 1], 1.0, [0,0,0,1] ]
diff --git a/gfx/wr/wrench/reftests/gradient/conic-backdrop-with-spacing-ref.yaml b/gfx/wr/wrench/reftests/gradient/conic-backdrop-with-spacing-ref.yaml
new file mode 100644
index 0000000000..2f9bd2225b
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-backdrop-with-spacing-ref.yaml
@@ -0,0 +1,13 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: 0 0 800 450
+ color: red
+ - type: conic-gradient
+ bounds: 0 0 800 450
+ center: 100 100
+ angle: 0.0
+ stops: [ 0.0, [255, 255, 255, 1], 1.0, [0,0,0,1] ]
+ tile-size: 100 100
+ tile-spacing: 20 20
diff --git a/gfx/wr/wrench/reftests/gradient/conic-backdrop-with-spacing.yaml b/gfx/wr/wrench/reftests/gradient/conic-backdrop-with-spacing.yaml
new file mode 100644
index 0000000000..695e600dff
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-backdrop-with-spacing.yaml
@@ -0,0 +1,18 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: 0 0 800 450
+ color: red
+ - type: "scroll-frame"
+ bounds: 0 0 800 450
+ clip-rect: 0 0 800 450
+ id: 2
+ - type: conic-gradient
+ bounds: 0 0 800 450
+ spatial-id: 2
+ center: 100 100
+ angle: 0.0
+ stops: [ 0.0, [255, 255, 255, 1], 1.0, [0,0,0,1] ]
+ tile-size: 100 100
+ tile-spacing: 20 20
diff --git a/gfx/wr/wrench/reftests/gradient/conic-backdrop.yaml b/gfx/wr/wrench/reftests/gradient/conic-backdrop.yaml
new file mode 100644
index 0000000000..bc654a50ac
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-backdrop.yaml
@@ -0,0 +1,16 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: 0 0 800 450
+ color: red
+ - type: "scroll-frame"
+ bounds: 0 0 800 450
+ clip-rect: 0 0 800 450
+ id: 2
+ - type: conic-gradient
+ bounds: 0 0 800 450
+ spatial-id: 2
+ center: 400 225
+ angle: 0.0
+ stops: [ 0.0, [255, 255, 255, 1], 1.0, [0,0,0,1] ]
diff --git a/gfx/wr/wrench/reftests/gradient/conic-center.png b/gfx/wr/wrench/reftests/gradient/conic-center.png
new file mode 100644
index 0000000000..9843a2efb5
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-center.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/conic-center.yaml b/gfx/wr/wrench/reftests/gradient/conic-center.yaml
new file mode 100644
index 0000000000..d01ebc9c8e
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-center.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ center: 50 50
+ angle: 0.0
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.5, blue, 0.75, blue,
+ 0.75, black, 1.0, black] \ No newline at end of file
diff --git a/gfx/wr/wrench/reftests/gradient/conic-color-wheel.png b/gfx/wr/wrench/reftests/gradient/conic-color-wheel.png
new file mode 100644
index 0000000000..3fff3c32d4
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-color-wheel.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/conic-color-wheel.yaml b/gfx/wr/wrench/reftests/gradient/conic-color-wheel.yaml
new file mode 100644
index 0000000000..60e6bad865
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-color-wheel.yaml
@@ -0,0 +1,14 @@
+---
+root:
+ items:
+ - type: clip
+ id: 2
+ complex:
+ - rect: [50, 50, 300, 300]
+ radius: 300
+ - type: conic-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ angle: 0.0
+ stops: [0.0, red, 0.16666, yellow, 0.33333, green, 0.5, [0,255,255,1], 0.66666, blue, 0.83333, [255,0,255,1], 1.0, red]
+ clip-chain: [2]
diff --git a/gfx/wr/wrench/reftests/gradient/conic-large-hard-stop-ref.yaml b/gfx/wr/wrench/reftests/gradient/conic-large-hard-stop-ref.yaml
new file mode 100644
index 0000000000..95c4daf636
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-large-hard-stop-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 250 250
+ center: 100 100
+ angle: 0
+ stops: [0.0, red, 0.2, red, 0.2, yellow, 1.0, yellow]
diff --git a/gfx/wr/wrench/reftests/gradient/conic-large-hard-stop.yaml b/gfx/wr/wrench/reftests/gradient/conic-large-hard-stop.yaml
new file mode 100644
index 0000000000..5656035f5b
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-large-hard-stop.yaml
@@ -0,0 +1,14 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 2048 2048
+ center: 100 100
+ angle: 0
+ stops: [0.0, red, 0.2, red, 0.2, yellow, 1.0, yellow]
+ - type: rect
+ bounds: 0 300 2048 2048
+ color: white
+ - type: rect
+ bounds: 300 0 2048 2048
+ color: white
diff --git a/gfx/wr/wrench/reftests/gradient/conic-large-ref.yaml b/gfx/wr/wrench/reftests/gradient/conic-large-ref.yaml
new file mode 100644
index 0000000000..9441175cf1
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-large-ref.yaml
@@ -0,0 +1,16 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: 50 50 2000 300
+ color: blue
+
+ - type: conic-gradient
+ bounds: 50 50 2000 300
+ center: 150 150
+ angle: 0.0
+ stops: [0.0, red,
+ 0.125, blue,
+ 0.375, blue,
+ 0.5, yellow,
+ 1.0, red] \ No newline at end of file
diff --git a/gfx/wr/wrench/reftests/gradient/conic-large.yaml b/gfx/wr/wrench/reftests/gradient/conic-large.yaml
new file mode 100644
index 0000000000..78bf305f54
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-large.yaml
@@ -0,0 +1,12 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 2000 300
+ center: 150 150
+ angle: 0.0
+ stops: [0.0, red,
+ 0.125, blue,
+ 0.375, blue,
+ 0.5, yellow,
+ 1.0, red] \ No newline at end of file
diff --git a/gfx/wr/wrench/reftests/gradient/conic-nan.yaml b/gfx/wr/wrench/reftests/gradient/conic-nan.yaml
new file mode 100644
index 0000000000..6cc6234611
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-nan.yaml
@@ -0,0 +1,41 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 200 NaN
+ center: 100 100
+ angle: 0.0
+ stops: [0.0, red, 0.25, green, 0.5, blue, 0.75, black]
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ center: NaN 100
+ angle: 0.0
+ stops: [0.0, red, 0.25, green, 0.5, blue, 0.75, black]
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ center: 100 100
+ angle: NaN
+ stops: [0.0, red, 0.25, green, 0.5, blue, 0.75, black]
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ center: 100 100
+ angle: 0.0
+ stops: [0.0, red, NaN, green, 0.5, blue, 0.75, black]
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ tile-size: NaN 200
+ center: 100 100
+ angle: 0.0
+ stops: [0.0, red, 0.25, green, 0.5, blue, 0.75, black]
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ clip-rect: NaN 0 100 100
+ center: 100 100
+ angle: 0.0
+ stops: [0.0, red, 0.25, green, 0.5, blue, 0.75, black]
+ - type: conic-gradient
+ bounds: NaN NaN NaN NaN
+ clip-rect: NaN NaN NaN NaN
+ center: NaN NaN
+ angle: NaN
+ stops: [NaN, red, NaN, green, NaN, blue, NaN, black]
diff --git a/gfx/wr/wrench/reftests/gradient/conic-ref.yaml b/gfx/wr/wrench/reftests/gradient/conic-ref.yaml
new file mode 100644
index 0000000000..c29484ae9c
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-ref.yaml
@@ -0,0 +1,18 @@
+---
+root:
+ items:
+ - type: stacking-context
+ bounds: 50 50 100 100
+ items:
+ - type: rect
+ bounds: 0 0 100 100
+ color: black
+ - type: rect
+ bounds: 100 0 100 100
+ color: red
+ - type: rect
+ bounds: 100 100 100 100
+ color: green
+ - type: rect
+ bounds: 0 100 100 100
+ color: blue
diff --git a/gfx/wr/wrench/reftests/gradient/conic-simple.png b/gfx/wr/wrench/reftests/gradient/conic-simple.png
new file mode 100644
index 0000000000..79d0885c40
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-simple.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/conic-simple.yaml b/gfx/wr/wrench/reftests/gradient/conic-simple.yaml
new file mode 100644
index 0000000000..c40c878403
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic-simple.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ angle: 0.0
+ stops: [0.0, red, 1.0, yellow] \ No newline at end of file
diff --git a/gfx/wr/wrench/reftests/gradient/conic.yaml b/gfx/wr/wrench/reftests/gradient/conic.yaml
new file mode 100644
index 0000000000..ad034d6a9b
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/conic.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ center: 100 100
+ angle: 0.0
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.5, blue, 0.75, blue,
+ 0.75, black, 1.0, black] \ No newline at end of file
diff --git a/gfx/wr/wrench/reftests/gradient/gradient_cache_5stops.yaml b/gfx/wr/wrench/reftests/gradient/gradient_cache_5stops.yaml
new file mode 100644
index 0000000000..d448723002
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/gradient_cache_5stops.yaml
@@ -0,0 +1,13 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 0 0 960 540
+ start: 0 0
+ end: 960 0
+ stops: [0.0, red,
+ 0.25, green,
+ 0.5, blue,
+ 0.75, [40,40,40,1],
+ 1.0, [100,200,50,1]]
+
diff --git a/gfx/wr/wrench/reftests/gradient/gradient_cache_5stops_ref.yaml b/gfx/wr/wrench/reftests/gradient/gradient_cache_5stops_ref.yaml
new file mode 100644
index 0000000000..34b6b0e01c
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/gradient_cache_5stops_ref.yaml
@@ -0,0 +1,18 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 0 0 480 540
+ start: 0 0
+ end: 480 0
+ stops: [0.0, red,
+ 0.5, green,
+ 1.0, blue]
+ - type: gradient
+ bounds: 480 0 480 540
+ start: 0 0
+ end: 480 0
+ stops: [ 0.0, blue,
+ 0.5, [40,40,40,1],
+ 1.0, [100,200,50,1]]
+
diff --git a/gfx/wr/wrench/reftests/gradient/gradient_cache_5stops_vertical.yaml b/gfx/wr/wrench/reftests/gradient/gradient_cache_5stops_vertical.yaml
new file mode 100644
index 0000000000..dd2c8b7c9d
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/gradient_cache_5stops_vertical.yaml
@@ -0,0 +1,13 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 0 0 960 540
+ start: 0 0
+ end: 0 540
+ stops: [0.0, red,
+ 0.25, green,
+ 0.5, blue,
+ 0.75, [40,40,40,1],
+ 1.0, [100,200,50,1]]
+
diff --git a/gfx/wr/wrench/reftests/gradient/gradient_cache_5stops_vertical_ref.yaml b/gfx/wr/wrench/reftests/gradient/gradient_cache_5stops_vertical_ref.yaml
new file mode 100644
index 0000000000..704b5be2f6
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/gradient_cache_5stops_vertical_ref.yaml
@@ -0,0 +1,18 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 0 0 960 270
+ start: 0 0
+ end: 0 270
+ stops: [0.0, red,
+ 0.5, green,
+ 1.0, blue]
+ - type: gradient
+ bounds: 0 270 960 270
+ start: 0 0
+ end: 0 270
+ stops: [ 0.0, blue,
+ 0.5, [40,40,40,1],
+ 1.0, [100,200,50,1]]
+
diff --git a/gfx/wr/wrench/reftests/gradient/gradient_cache_clamp.yaml b/gfx/wr/wrench/reftests/gradient/gradient_cache_clamp.yaml
new file mode 100644
index 0000000000..1c55a269a1
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/gradient_cache_clamp.yaml
@@ -0,0 +1,20 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 0 0 400 200
+ start: 0 100
+ end: 100 100
+ stops: [0.0, blue, 1.0, blue, 1.0, red]
+ - type: gradient
+ bounds: 0 300 400 200
+ start: 100 100
+ end: 200 100
+ stops: [0.0, blue, 1.0, blue, 1.0, red]
+ - type: gradient
+ bounds: 0 600 200 400
+ start: 0 100
+ end: 0 300
+ stops: [
+ 0.0, blue,
+ 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/gradient_cache_clamp_ref.yaml b/gfx/wr/wrench/reftests/gradient/gradient_cache_clamp_ref.yaml
new file mode 100644
index 0000000000..4631192cd8
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/gradient_cache_clamp_ref.yaml
@@ -0,0 +1,30 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 0 0 400 200
+ start: 0 100
+ end: 400 100
+ stops: [
+ 0.0, blue,
+ 0.25, blue,
+ 0.25, red,
+ 1.0, red]
+ - type: gradient
+ bounds: 0 300 400 200
+ start: 0 100
+ end: 400 100
+ stops: [
+ 0.0, blue,
+ 0.5, blue,
+ 0.5, red,
+ 1.0, red]
+ - type: gradient
+ bounds: 0 600 200 400
+ start: 0 0
+ end: 0 400
+ stops: [
+ 0.0, blue,
+ 0.25, blue,
+ 0.75, red,
+ 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop.yaml b/gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop.yaml
new file mode 100644
index 0000000000..53c908fb22
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop.yaml
@@ -0,0 +1,19 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 0 0 960 540
+ start: 0 0
+ end: 960 0
+ stops: [0.0, red,
+ 0.125, yellow,
+ 0.25, red,
+ 0.25, green,
+ 0.375, yellow,
+ 0.5, green,
+ 0.5, blue,
+ 0.625, yellow,
+ 0.75, blue,
+ 0.75, white,
+ 1.0, [100,200,50,1]]
+
diff --git a/gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop_clip.yaml b/gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop_clip.yaml
new file mode 100644
index 0000000000..1af3894406
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop_clip.yaml
@@ -0,0 +1,27 @@
+---
+root:
+ items:
+ - type: clip
+ id: 101
+ complex:
+ - rect: [100, 100, 760, 340]
+ radius: [32, 32]
+ - type: clip-chain
+ id: 201
+ clips: [101]
+ - type: gradient
+ bounds: 0 0 960 540
+ start: 0 0
+ end: 960 0
+ stops: [0.0, red,
+ 0.125, yellow,
+ 0.25, red,
+ 0.25, green,
+ 0.375, yellow,
+ 0.5, green,
+ 0.5, blue,
+ 0.625, yellow,
+ 0.75, blue,
+ 0.75, white,
+ 1.0, [100,200,50,1]]
+ clip-chain: 201
diff --git a/gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop_clip_ref.yaml b/gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop_clip_ref.yaml
new file mode 100644
index 0000000000..ac13881be8
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop_clip_ref.yaml
@@ -0,0 +1,41 @@
+---
+root:
+ items:
+ - type: clip
+ id: 101
+ complex:
+ - rect: [100, 100, 760, 340]
+ radius: [32, 32]
+ - type: clip-chain
+ id: 201
+ clips: [101]
+ - type: gradient
+ bounds: 0 0 480 540
+ start: 0 0
+ end: 480 0
+ stops: [0.0, red,
+ 0.25, yellow,
+ 0.5, red,
+ 0.5, green,
+ 0.75, yellow,
+ 1.0, green]
+ clip-chain: 201
+
+ - type: clip
+ id: 102
+ complex:
+ - rect: [100, 100, 760, 340]
+ radius: [32, 32]
+ - type: clip-chain
+ id: 202
+ clips: [102]
+ - type: gradient
+ bounds: 480 0 480 540
+ start: 0 0
+ end: 480 0
+ stops: [0.0, blue,
+ 0.25, yellow,
+ 0.5, blue,
+ 0.5, white,
+ 1.0, [100,200,50,1]]
+ clip-chain: 202
diff --git a/gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop_ref.yaml b/gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop_ref.yaml
new file mode 100644
index 0000000000..e4b3928046
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/gradient_cache_hardstop_ref.yaml
@@ -0,0 +1,24 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 0 0 480 540
+ start: 0 0
+ end: 480 0
+ stops: [0.0, red,
+ 0.25, yellow,
+ 0.5, red,
+ 0.5, green,
+ 0.75, yellow,
+ 1.0, green]
+ - type: gradient
+ bounds: 480 0 480 540
+ start: 0 0
+ end: 480 0
+ stops: [0.0, blue,
+ 0.25, yellow,
+ 0.5, blue,
+ 0.5, white,
+ 1.0, [100,200,50,1]]
+
+
diff --git a/gfx/wr/wrench/reftests/gradient/gradient_cache_repeat.yaml b/gfx/wr/wrench/reftests/gradient/gradient_cache_repeat.yaml
new file mode 100644
index 0000000000..20a07a72a6
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/gradient_cache_repeat.yaml
@@ -0,0 +1,119 @@
+---
+root:
+ items:
+ # non-repeating
+ - type: gradient
+ bounds: 100 50 500 10
+ start: 100 0
+ end: 200 0
+ repeat: false
+ stops: [0.0, green,
+ 0.5, green,
+ 0.5, blue,
+ 1.0, blue ]
+
+ # repeat 4 times
+ - type: gradient
+ bounds: 100 100 500 10
+ start: 100 0
+ end: 200 0
+ repeat: true
+ stops: [0.0, green,
+ 0.5, green,
+ 0.5, blue,
+ 1.0, blue ]
+
+ # same but start doesn't line up with 0
+ - type: gradient
+ bounds: 100 150 500 10
+ start: 125 0
+ end: 225 0
+ repeat: true
+ stops: [0.0, green,
+ 0.5, green,
+ 0.5, blue,
+ 1.0, blue ]
+
+ # more hard stops, non-uniform distribution
+ - type: gradient
+ bounds: 100 250 500 10
+ start: 200 0
+ end: 300 0
+ repeat: false
+ stops: [0.0, green,
+ 0.25, green,
+ 0.25, red,
+ 0.75, red,
+ 0.75, blue,
+ 1.0, blue ]
+
+ # repeat the hard stops
+ - type: gradient
+ bounds: 100 300 500 10
+ start: 200 0
+ end: 300 0
+ repeat: true
+ stops: [0.0, green,
+ 0.25, green,
+ 0.25, red,
+ 0.75, red,
+ 0.75, blue,
+ 1.0, blue ]
+
+ # same but start doesn't line up with 0
+ - type: gradient
+ bounds: 100 350 500 10
+ start: 175 0
+ end: 275 0
+ repeat: true
+ stops: [0.0, green,
+ 0.25, green,
+ 0.25, red,
+ 0.75, red,
+ 0.75, blue,
+ 1.0, blue ]
+
+ # the entire gradient from 0 to 1 is
+ # "offscreen", we're only seeing its
+ # repeats. the gradient is 100 wide
+ # and ends at -75, so the first
+ # three-quarters of it would be hidden,
+ # that is, it should start with blue.
+ - type: gradient
+ bounds: 100 400 500 10
+ start: -175 0
+ end: -75 0
+ repeat: true
+ stops: [0.0, green,
+ 0.25, green,
+ 0.25, red,
+ 0.75, red,
+ 0.75, blue,
+ 1.0, blue ]
+
+ # same but over on the right
+ - type: gradient
+ bounds: 100 450 500 10
+ start: 575 0
+ end: 675 0
+ repeat: true
+ stops: [0.0, green,
+ 0.25, green,
+ 0.25, red,
+ 0.75, red,
+ 0.75, blue,
+ 1.0, blue ]
+
+ # a repeat, but not really because only part
+ # of the gradient is visible
+ - type: gradient
+ bounds: 100 500 500 10
+ start: -50 0
+ end: 550 0
+ repeat: true
+ stops: [0.0, green,
+ 0.25, green,
+ 0.25, red,
+ 0.75, red,
+ 0.75, blue,
+ 1.0, blue ]
diff --git a/gfx/wr/wrench/reftests/gradient/gradient_cache_repeat_ref.yaml b/gfx/wr/wrench/reftests/gradient/gradient_cache_repeat_ref.yaml
new file mode 100644
index 0000000000..e1682622f8
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/gradient_cache_repeat_ref.yaml
@@ -0,0 +1,119 @@
+---
+root:
+ items:
+ # non-repeating
+ - type: gradient
+ bounds: 100 50 500 10
+ start: 100 0
+ end: 200 0.001
+ repeat: false
+ stops: [0.0, green,
+ 0.5, green,
+ 0.5, blue,
+ 1.0, blue ]
+
+ # repeat 4 times
+ - type: gradient
+ bounds: 100 100 500 10
+ start: 100 0
+ end: 200 0.001
+ repeat: true
+ stops: [0.0, green,
+ 0.5, green,
+ 0.5, blue,
+ 1.0, blue ]
+
+ # same but start doesn't line up with 0
+ - type: gradient
+ bounds: 100 150 500 10
+ start: 125 0
+ end: 225 0.001
+ repeat: true
+ stops: [0.0, green,
+ 0.5, green,
+ 0.5, blue,
+ 1.0, blue ]
+
+ # more hard stops, non-uniform distribution
+ - type: gradient
+ bounds: 100 250 500 10
+ start: 200 0
+ end: 300 0.001
+ repeat: false
+ stops: [0.0, green,
+ 0.25, green,
+ 0.25, red,
+ 0.75, red,
+ 0.75, blue,
+ 1.0, blue ]
+
+ # repeat the hard stops
+ - type: gradient
+ bounds: 100 300 500 10
+ start: 200 0
+ end: 300 0.001
+ repeat: true
+ stops: [0.0, green,
+ 0.25, green,
+ 0.25, red,
+ 0.75, red,
+ 0.75, blue,
+ 1.0, blue ]
+
+ # same but start doesn't line up with 0
+ - type: gradient
+ bounds: 100 350 500 10
+ start: 175 0
+ end: 275 0.001
+ repeat: true
+ stops: [0.0, green,
+ 0.25, green,
+ 0.25, red,
+ 0.75, red,
+ 0.75, blue,
+ 1.0, blue ]
+
+ # the entire gradient from 0 to 1 is
+ # "offscreen", we're only seeing its
+ # repeats. the gradient is 100 wide
+ # and ends at -75, so the first
+ # three-quarters of it would be hidden,
+ # that is, it should start with blue.
+ - type: gradient
+ bounds: 100 400 500 10
+ start: -175 0
+ end: -75 0.001
+ repeat: true
+ stops: [0.0, green,
+ 0.25, green,
+ 0.25, red,
+ 0.75, red,
+ 0.75, blue,
+ 1.0, blue ]
+
+ # same but over on the right
+ - type: gradient
+ bounds: 100 450 500 10
+ start: 575 0
+ end: 675 0.001
+ repeat: true
+ stops: [0.0, green,
+ 0.25, green,
+ 0.25, red,
+ 0.75, red,
+ 0.75, blue,
+ 1.0, blue ]
+
+ # a repeat, but not really because only part
+ # of the gradient is visible
+ - type: gradient
+ bounds: 100 500 500 10
+ start: -50 0
+ end: 550 0.001
+ repeat: true
+ stops: [0.0, green,
+ 0.25, green,
+ 0.25, red,
+ 0.75, red,
+ 0.75, blue,
+ 1.0, blue ]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-adjust-tile-size-ref.yaml b/gfx/wr/wrench/reftests/gradient/linear-adjust-tile-size-ref.yaml
new file mode 100644
index 0000000000..c9145fc5e6
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-adjust-tile-size-ref.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 15.47998046875 18 684.39990234375 643.199951171875
+ start: 10.286011695861816 653.47998046875
+ end: 143.13165283203125 520.7279663085938
+ stops: [0.0, red, 1.0, blue]
+ repeat: true
diff --git a/gfx/wr/wrench/reftests/gradient/linear-adjust-tile-size.yaml b/gfx/wr/wrench/reftests/gradient/linear-adjust-tile-size.yaml
new file mode 100644
index 0000000000..4d78b9b99e
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-adjust-tile-size.yaml
@@ -0,0 +1,10 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 15.47998046875 18 684.39990234375 643.199951171875
+ tile-size: 684.4000244140625 643.2000122070313
+ start: 10.286011695861816 653.47998046875
+ end: 143.13165283203125 520.7279663085938
+ stops: [0.0, red, 1.0, blue]
+ repeat: true
diff --git a/gfx/wr/wrench/reftests/gradient/linear-aligned-border-radius.png b/gfx/wr/wrench/reftests/gradient/linear-aligned-border-radius.png
new file mode 100644
index 0000000000..450e0ac56a
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-aligned-border-radius.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/linear-aligned-border-radius.yaml b/gfx/wr/wrench/reftests/gradient/linear-aligned-border-radius.yaml
new file mode 100644
index 0000000000..13e2b324a8
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-aligned-border-radius.yaml
@@ -0,0 +1,46 @@
+---
+root:
+ items:
+ - type: clip
+ id: 2
+ complex:
+ - rect: [20, 20, 100, 100]
+ radius: 32
+ - type: gradient
+ bounds: 20 20 100 100
+ start: 50 0
+ end: 50 100
+ stops: [0.0, red, 1.0, yellow]
+ clip-chain: [2]
+
+ - type: rect
+ bounds: [130, 10, 120, 120]
+ color: blue
+
+ - type: clip
+ id: 3
+ complex:
+ - rect: [140, 20, 100, 100]
+ radius: 32
+ - type: gradient
+ bounds: 140 20 100 100
+ start: 50 0
+ end: 50 100
+ stops: [0.0, red, 1.0, yellow]
+ clip-chain: [3]
+
+ - type: rect
+ bounds: [260, 10, 120, 120]
+ color: black
+
+ - type: clip
+ id: 4
+ complex:
+ - rect: [270, 20, 100, 100]
+ radius: 32
+ - type: gradient
+ bounds: 270 20 100 100
+ start: 50 0
+ end: 50 100
+ stops: [0.0, red, 1.0, yellow]
+ clip-chain: [4]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-aligned-clip-ref.yaml b/gfx/wr/wrench/reftests/gradient/linear-aligned-clip-ref.yaml
new file mode 100644
index 0000000000..08a395dc71
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-aligned-clip-ref.yaml
@@ -0,0 +1,16 @@
+---
+root:
+ items:
+ # an aligned gradient from [0, 400]
+ - type: gradient
+ bounds: 0 0 200 400
+ start: 100 0
+ end: 100 400
+ stops: [0.0, green, 1.0, blue]
+ # manual clipping
+ - type: rect
+ bounds: 0 0 200 100
+ color: white
+ - type: rect
+ bounds: 0 300 200 100
+ color: white
diff --git a/gfx/wr/wrench/reftests/gradient/linear-aligned-clip.yaml b/gfx/wr/wrench/reftests/gradient/linear-aligned-clip.yaml
new file mode 100644
index 0000000000..fad030724f
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-aligned-clip.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ # an aligned gradient from [0, 400] and clipped to [100, 300]
+ - type: gradient
+ bounds: 0 100 200 200
+ start: 100 -100
+ end: 100 300
+ stops: [0.0, green, 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-backdrop-ref.yaml b/gfx/wr/wrench/reftests/gradient/linear-backdrop-ref.yaml
new file mode 100644
index 0000000000..7cc02b573c
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-backdrop-ref.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: 0 0 800 450
+ color: red
+ - type: gradient
+ bounds: 0 0 800 450
+ start: 100 100
+ end: 700 350
+ stops: [ 0.0, [255, 255, 255, 1], 1.0, [0,0,0,1] ]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-backdrop-with-spacing-ref.yaml b/gfx/wr/wrench/reftests/gradient/linear-backdrop-with-spacing-ref.yaml
new file mode 100644
index 0000000000..e72d156433
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-backdrop-with-spacing-ref.yaml
@@ -0,0 +1,14 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: 0 0 800 450
+ color: red
+ - type: gradient
+ bounds: 0 0 800 450
+ start: 20 20
+ end: 80 50
+ stops: [ 0.0, [255, 255, 255, 1], 1.0, [0,0,0,1] ]
+ tile-size: 100 100
+ tile-spacing: 20 20
+
diff --git a/gfx/wr/wrench/reftests/gradient/linear-backdrop-with-spacing.yaml b/gfx/wr/wrench/reftests/gradient/linear-backdrop-with-spacing.yaml
new file mode 100644
index 0000000000..dd85ffdae5
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-backdrop-with-spacing.yaml
@@ -0,0 +1,18 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: 0 0 800 450
+ color: red
+ - type: "scroll-frame"
+ bounds: 0 0 800 450
+ clip-rect: 0 0 800 450
+ id: 2
+ - type: gradient
+ bounds: 0 0 800 450
+ spatial-id: 2
+ start: 20 20
+ end: 80 50
+ stops: [ 0.0, [255, 255, 255, 1], 1.0, [0,0,0,1] ]
+ tile-size: 100 100
+ tile-spacing: 20 20
diff --git a/gfx/wr/wrench/reftests/gradient/linear-backdrop.yaml b/gfx/wr/wrench/reftests/gradient/linear-backdrop.yaml
new file mode 100644
index 0000000000..7b351788d4
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-backdrop.yaml
@@ -0,0 +1,16 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: 0 0 800 450
+ color: red
+ - type: "scroll-frame"
+ bounds: 0 0 800 450
+ clip-rect: 0 0 800 450
+ id: 2
+ - type: gradient
+ bounds: 0 0 800 450
+ spatial-id: 2
+ start: 100 100
+ end: 700 350
+ stops: [ 0.0, [255, 255, 255, 1], 1.0, [0,0,0,1] ]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-bug-1703141.yaml b/gfx/wr/wrench/reftests/gradient/linear-bug-1703141.yaml
new file mode 100644
index 0000000000..9db333277e
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-bug-1703141.yaml
@@ -0,0 +1,12 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: -8396 465 9136 3
+ tile-size: 10498.667 3
+ start: 9448.5 1.5
+ end: 10498.333 1.5
+ repeat: true
+ stops: [0.0, [0,0,0,0], 0.5, [0,0,0,0],
+ 0.5, red, 0.75, red,
+ 0.75, [0,0,0,0], 1.0, [0,0,0,0]]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-clamp-1-ref.yaml b/gfx/wr/wrench/reftests/gradient/linear-clamp-1-ref.yaml
new file mode 100644
index 0000000000..81c366d858
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-clamp-1-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0.0, blue, 0.5, blue, 0.5, red, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-clamp-1a.yaml b/gfx/wr/wrench/reftests/gradient/linear-clamp-1a.yaml
new file mode 100644
index 0000000000..b83963a37a
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-clamp-1a.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 100 100
+ stops: [0.0, blue, 1.0, blue, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-clamp-1b.yaml b/gfx/wr/wrench/reftests/gradient/linear-clamp-1b.yaml
new file mode 100644
index 0000000000..ffe3391999
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-clamp-1b.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 100 100
+ end: 200 100
+ stops: [0.0, blue, 0.0, red, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-clamp-2-ref.yaml b/gfx/wr/wrench/reftests/gradient/linear-clamp-2-ref.yaml
new file mode 100644
index 0000000000..8eb475d0a5
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-clamp-2-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0.0, blue, 0.25, blue, 0.25, green, 0.75, green, 0.75, red, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-clamp-2.yaml b/gfx/wr/wrench/reftests/gradient/linear-clamp-2.yaml
new file mode 100644
index 0000000000..48428b974a
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-clamp-2.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 50 100
+ end: 150 100
+ stops: [0.0, blue, 0.0, green, 1.0, green, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-double.yaml b/gfx/wr/wrench/reftests/gradient/linear-double.yaml
new file mode 100644
index 0000000000..c9e4a44d84
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-double.yaml
@@ -0,0 +1,13 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 300 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0.0, blue, 1.0, red]
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0.0, green, 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-far-endpoints.yaml b/gfx/wr/wrench/reftests/gradient/linear-far-endpoints.yaml
new file mode 100644
index 0000000000..45bb52debc
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-far-endpoints.yaml
@@ -0,0 +1,10 @@
+# Axis-aligned linear gradient with very far endpoints. It goes through the gradient
+# decomposition path which should not choke on overflow or casting failure.
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 500 500
+ start: -19958788096 0
+ end: 19958788096 0
+ stops: [0.0, red, 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-hard-stop-ref.png b/gfx/wr/wrench/reftests/gradient/linear-hard-stop-ref.png
new file mode 100644
index 0000000000..4feb5e4993
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-hard-stop-ref.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/linear-hard-stop-repeat-large-ref.yaml b/gfx/wr/wrench/reftests/gradient/linear-hard-stop-repeat-large-ref.yaml
new file mode 100644
index 0000000000..9287f91dd4
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-hard-stop-repeat-large-ref.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 0 0 800 200
+ tile-size: 200 200
+ clip-rect: 0 0 800 200
+ start: 0 0
+ end: 20 0
+ stops: [0.0, black, 0.1, black, 0.2, white, 1.0, white]
+ repeat: true
diff --git a/gfx/wr/wrench/reftests/gradient/linear-hard-stop-repeat-large.yaml b/gfx/wr/wrench/reftests/gradient/linear-hard-stop-repeat-large.yaml
new file mode 100644
index 0000000000..1abf946263
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-hard-stop-repeat-large.yaml
@@ -0,0 +1,14 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 0 0 4000 200
+ tile-size: 200 200
+ clip-rect: 0 0 4000 200
+ start: 0 0
+ end: 20 0
+ stops: [0.0, black, 0.1, black, 0.2, white, 1.0, white]
+ repeat: true
+ - type: rect
+ bounds: 800 0 4000 200
+ color: white
diff --git a/gfx/wr/wrench/reftests/gradient/linear-hard-stop.yaml b/gfx/wr/wrench/reftests/gradient/linear-hard-stop.yaml
new file mode 100644
index 0000000000..b9249e7f2a
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-hard-stop.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 0
+ end: 0 100
+ stops: [0.0, blue, 0.5 , red, 0.5, green]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-large-ref.yaml b/gfx/wr/wrench/reftests/gradient/linear-large-ref.yaml
new file mode 100644
index 0000000000..472f04fd17
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-large-ref.yaml
@@ -0,0 +1,12 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: 50 50 2000 300
+ color: blue
+
+ - type: gradient
+ bounds: 50 50 400 300
+ start: 0 0
+ end: 100 20
+ stops: [0.0, red, 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-large.yaml b/gfx/wr/wrench/reftests/gradient/linear-large.yaml
new file mode 100644
index 0000000000..cf9c50edd1
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-large.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 2000 300
+ start: 0 0
+ end: 100 20
+ stops: [0.0, red, 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-nan.yaml b/gfx/wr/wrench/reftests/gradient/linear-nan.yaml
new file mode 100644
index 0000000000..687a06d372
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-nan.yaml
@@ -0,0 +1,213 @@
+---
+root:
+ items:
+ # Small-ish gradients
+ - type: gradient
+ bounds: 50 50 NaN 200
+ start: 0 100
+ end: 200 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.5, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: NaN 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.5, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 NaN
+ end: 200 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.5, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ NaN, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.0, blue, 0.75, blue,
+ 0.75, black, NaN, black]
+ - type: gradient
+ bounds: 50 50 200 200
+ clip-rect: 50 50 150 NaN
+ start: 0 100
+ end: 200 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.0, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: 50 50 200 200
+ tile-size: NaN 200
+ start: 0 100
+ end: 200 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.0, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+
+ # Large-ish gradients
+ - type: gradient
+ bounds: 50 50 NaN 500
+ start: 0 100
+ end: 500 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.5, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: 50 50 500 500
+ start: 0 100
+ end: NaN 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.5, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: 50 50 500 500
+ start: 0 NaN
+ end: 500 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.5, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: 50 50 500 500
+ start: 0 100
+ end: 500 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ NaN, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: 50 50 500 500
+ start: 0 100
+ end: 500 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.0, blue, 0.75, blue,
+ 0.75, black, NaN, black]
+ - type: gradient
+ bounds: 50 50 500 500
+ clip-rect: 50 50 150 NaN
+ start: 0 100
+ end: 500 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.0, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: 50 50 500 500
+ tile-size: NaN 500
+ start: 0 100
+ end: 500 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.0, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+
+ # Very large gradients
+ - type: gradient
+ bounds: 50 50 10000 10000
+ start: 0 100
+ end: NaN 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.5, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: 50 50 10000 10000
+ start: 0 NaN
+ end: 10000 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.5, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: 50 50 10000 10000
+ start: 0 100
+ end: 10000 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ NaN, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: 50 50 10000 10000
+ start: 0 100
+ end: 10000 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.0, blue, 0.75, blue,
+ 0.75, black, NaN, black]
+ - type: gradient
+ bounds: 50 50 10000 10000
+ clip-rect: 50 50 150 NaN
+ start: 0 100
+ end: 10000 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.0, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: 50 50 10000 10000
+ tile-size: NaN 10000
+ start: 0 100
+ end: 10000 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.0, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+
+ # Not axis-aligned
+ - type: gradient
+ bounds: 50 50 200 200
+ tile-size: NaN 200
+ start: 0 0
+ end: 200 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.0, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: NaN 50 200 200
+ tile-size: 100 100
+ start: 0 0
+ end: 200 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.0, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0.0 0
+ end: 200 100
+ stops: [NaN, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.0, blue, NaN, blue,
+ 0.75, black, 1.0, black]
+
+ # Post-apocalyptic gradient
+ - type: gradient
+ bounds: NaN NaN NaN NaN
+ tile-size: NaN NaN
+ start: NaN NaN
+ end: NaN NaN
+ stops: [NaN, red, NaN, red,
+ NaN, green, NaN, green,
+ NaN, blue, NaN, blue,
+ NaN, black, NaN, black]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-ref.png b/gfx/wr/wrench/reftests/gradient/linear-ref.png
new file mode 100644
index 0000000000..b157ee4bef
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-ref.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/linear-ref.yaml b/gfx/wr/wrench/reftests/gradient/linear-ref.yaml
new file mode 100644
index 0000000000..83d7248166
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-ref.yaml
@@ -0,0 +1,18 @@
+---
+root:
+ items:
+ - type: stacking-context
+ bounds: 50 50 200 200
+ items:
+ - type: rect
+ bounds: 0 0 50 200
+ color: red
+ - type: rect
+ bounds: 50 0 50 200
+ color: green
+ - type: rect
+ bounds: 100 0 50 200
+ color: blue
+ - type: rect
+ bounds: 150 0 50 200
+ color: black
diff --git a/gfx/wr/wrench/reftests/gradient/linear-repeat-clip-ref.yaml b/gfx/wr/wrench/reftests/gradient/linear-repeat-clip-ref.yaml
new file mode 100644
index 0000000000..d8fd0b3b32
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-repeat-clip-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 0 0 500 500
+ start: 0 -20
+ end: 0 520
+ stops: [0.0, green, 0.5, blue, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-repeat-clip.yaml b/gfx/wr/wrench/reftests/gradient/linear-repeat-clip.yaml
new file mode 100644
index 0000000000..9c84edd714
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-repeat-clip.yaml
@@ -0,0 +1,13 @@
+# This test has a gradient primitive that is much larger than its local clip
+# and some tiling that can be optimized away. The combination of clipping
+# and stretching optimizations used to cause produce the wrong clip.
+---
+root:
+ items:
+ - type: gradient
+ bounds: -500 0 2000 500
+ tile-size: 100 500
+ clip-rect: 0 0 500 500
+ start: 0 -20
+ end: 0 520
+ stops: [0.0, green, 0.5, blue, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-reverse-2-ref.yaml b/gfx/wr/wrench/reftests/gradient/linear-reverse-2-ref.yaml
new file mode 100644
index 0000000000..b85d303503
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-reverse-2-ref.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 50 100
+ end: 150 100
+ stops: [0.0, green, 0.5, blue,
+ 0.5, blue, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-reverse-2.yaml b/gfx/wr/wrench/reftests/gradient/linear-reverse-2.yaml
new file mode 100644
index 0000000000..c74c6b88f9
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-reverse-2.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 150 100
+ end: 50 100
+ stops: [0.0, red, 0.5, blue,
+ 0.5, blue, 1.0, green]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-reverse-3-ref.yaml b/gfx/wr/wrench/reftests/gradient/linear-reverse-3-ref.yaml
new file mode 100644
index 0000000000..088977f50f
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-reverse-3-ref.yaml
@@ -0,0 +1,13 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 100 100
+ start: 0 0
+ end: 110 0
+ stops: [0.0, white, 1.0, black]
+ - type: gradient
+ bounds: 150 50 100 100
+ start: 0 0
+ end: 110 0
+ stops: [0.0, black, 1.0, white]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-reverse-3.yaml b/gfx/wr/wrench/reftests/gradient/linear-reverse-3.yaml
new file mode 100644
index 0000000000..87b675c8ad
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-reverse-3.yaml
@@ -0,0 +1,13 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 100 100
+ start: 0 0
+ end: 110 0
+ stops: [0.0, white, 1.0, black]
+ - type: gradient
+ bounds: 150 50 100 100
+ start: 110 0
+ end: 0 0
+ stops: [0.0, white, 1.0, black]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-reverse.yaml b/gfx/wr/wrench/reftests/gradient/linear-reverse.yaml
new file mode 100644
index 0000000000..ecae199e88
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-reverse.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 200 100
+ end: 000 100
+ stops: [0.0, black, 0.25, black,
+ 0.25, blue, 0.5, blue,
+ 0.5, green, 0.75, green,
+ 0.75, red, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/linear-stops-ref.png b/gfx/wr/wrench/reftests/gradient/linear-stops-ref.png
new file mode 100644
index 0000000000..844b244002
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-stops-ref.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/linear-stops.yaml b/gfx/wr/wrench/reftests/gradient/linear-stops.yaml
new file mode 100644
index 0000000000..f5b8bfbc99
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear-stops.yaml
@@ -0,0 +1,7 @@
+root:
+ items:
+ - type: gradient
+ bounds: [0, 0, 200, 200]
+ start: 0 100
+ end: 200 100
+ stops: [0.0, red, 0.5, green, 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/linear.yaml b/gfx/wr/wrench/reftests/gradient/linear.yaml
new file mode 100644
index 0000000000..53d8d512cd
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/linear.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0.0, red, 0.25, red,
+ 0.25, green, 0.5, green,
+ 0.5, blue, 0.75, blue,
+ 0.75, black, 1.0, black]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-conic-1-ref.yaml b/gfx/wr/wrench/reftests/gradient/norm-conic-1-ref.yaml
new file mode 100644
index 0000000000..a3bb761463
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-conic-1-ref.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [0.0, green, 0.5, green,
+ 0.5, blue, 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-conic-1.yaml b/gfx/wr/wrench/reftests/gradient/norm-conic-1.yaml
new file mode 100644
index 0000000000..8bf6b734c2
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-conic-1.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [0.25, green, 0.5, green,
+ 0.5, blue, 0.75, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-conic-2-ref.yaml b/gfx/wr/wrench/reftests/gradient/norm-conic-2-ref.yaml
new file mode 100644
index 0000000000..a3bb761463
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-conic-2-ref.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [0.0, green, 0.5, green,
+ 0.5, blue, 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-conic-2.yaml b/gfx/wr/wrench/reftests/gradient/norm-conic-2.yaml
new file mode 100644
index 0000000000..ba9b174b51
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-conic-2.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [0.5, green,
+ 0.5, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-conic-3-ref.yaml b/gfx/wr/wrench/reftests/gradient/norm-conic-3-ref.yaml
new file mode 100644
index 0000000000..d5403c498f
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-conic-3-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [0.0, blue, 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-conic-3.yaml b/gfx/wr/wrench/reftests/gradient/norm-conic-3.yaml
new file mode 100644
index 0000000000..962ff4e7aa
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-conic-3.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [-0.5, green,
+ -0.5, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-conic-4-ref.yaml b/gfx/wr/wrench/reftests/gradient/norm-conic-4-ref.yaml
new file mode 100644
index 0000000000..6c0b6e508f
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-conic-4-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [0.0, green, 1.0, green]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-conic-4.yaml b/gfx/wr/wrench/reftests/gradient/norm-conic-4.yaml
new file mode 100644
index 0000000000..6564d84721
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-conic-4.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [1.5, green,
+ 1.5, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-conic-degenerate-ref.yaml b/gfx/wr/wrench/reftests/gradient/norm-conic-degenerate-ref.yaml
new file mode 100644
index 0000000000..1ba6bd2f9e
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-conic-degenerate-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 300 300
+ angle: 0.0
+ center: 150 150
+ stops: [0.0, red, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-conic-degenerate.yaml b/gfx/wr/wrench/reftests/gradient/norm-conic-degenerate.yaml
new file mode 100644
index 0000000000..be96200722
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-conic-degenerate.yaml
@@ -0,0 +1,14 @@
+# see: https://www.w3.org/TR/2012/CR-css3-images-20120417/#repeating-gradients
+# the spec says that repeating gradients with color stops in the same offset
+# must render as a solid rect with color equal to the average color of the
+# gradient. Gecko and Blink seem to draw it with color equal to the last stop
+# so that is the behavior tested here
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 300 300
+ angle: 0.0
+ center: 150 150
+ stops: [0.5, blue, 0.5, red]
+ repeat: true
diff --git a/gfx/wr/wrench/reftests/gradient/norm-linear-1-ref.yaml b/gfx/wr/wrench/reftests/gradient/norm-linear-1-ref.yaml
new file mode 100644
index 0000000000..5b8a0b317a
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-linear-1-ref.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0.0, green, 0.5, green,
+ 0.5, blue, 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-linear-1.yaml b/gfx/wr/wrench/reftests/gradient/norm-linear-1.yaml
new file mode 100644
index 0000000000..d79b8608b1
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-linear-1.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0.25, green, 0.5, green,
+ 0.5, blue, 0.75, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-linear-2-ref.yaml b/gfx/wr/wrench/reftests/gradient/norm-linear-2-ref.yaml
new file mode 100644
index 0000000000..5b8a0b317a
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-linear-2-ref.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0.0, green, 0.5, green,
+ 0.5, blue, 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-linear-2.yaml b/gfx/wr/wrench/reftests/gradient/norm-linear-2.yaml
new file mode 100644
index 0000000000..aa3aa2afe1
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-linear-2.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0.5, green,
+ 0.5, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-linear-3-ref.yaml b/gfx/wr/wrench/reftests/gradient/norm-linear-3-ref.yaml
new file mode 100644
index 0000000000..62bfda97e6
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-linear-3-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0.0, blue, 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-linear-3.yaml b/gfx/wr/wrench/reftests/gradient/norm-linear-3.yaml
new file mode 100644
index 0000000000..cc18371592
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-linear-3.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [-0.5, green,
+ -0.5, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-linear-4-ref.yaml b/gfx/wr/wrench/reftests/gradient/norm-linear-4-ref.yaml
new file mode 100644
index 0000000000..bcd84d8294
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-linear-4-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0.0, green, 1.0, green]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-linear-4.yaml b/gfx/wr/wrench/reftests/gradient/norm-linear-4.yaml
new file mode 100644
index 0000000000..df622bf299
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-linear-4.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [1.5, green,
+ 1.5, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-linear-degenerate-ref.yaml b/gfx/wr/wrench/reftests/gradient/norm-linear-degenerate-ref.yaml
new file mode 100644
index 0000000000..ae61c486cb
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-linear-degenerate-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 300 300
+ start: 0 150
+ end: 300 150
+ stops: [0.0, red, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-linear-degenerate.yaml b/gfx/wr/wrench/reftests/gradient/norm-linear-degenerate.yaml
new file mode 100644
index 0000000000..89b431df32
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-linear-degenerate.yaml
@@ -0,0 +1,14 @@
+# see: https://www.w3.org/TR/2012/CR-css3-images-20120417/#repeating-gradients
+# the spec says that repeating gradients with color stops in the same offset
+# must render as a solid rect with color equal to the average color of the
+# gradient. Gecko and Blink seem to draw it with color equal to the last stop
+# so that is the behavior tested here
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 300 300
+ start: 0 150
+ end: 300 150
+ stops: [0.5, blue, 0.5, red]
+ repeat: true
diff --git a/gfx/wr/wrench/reftests/gradient/norm-radial-1-ref.yaml b/gfx/wr/wrench/reftests/gradient/norm-radial-1-ref.yaml
new file mode 100644
index 0000000000..a67b51ecf8
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-radial-1-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ radius: 200 200
+ stops: [0.0, red, 0.5, red, 0.5, blue, 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-radial-1.yaml b/gfx/wr/wrench/reftests/gradient/norm-radial-1.yaml
new file mode 100644
index 0000000000..7ee6caeafa
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-radial-1.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ radius: 200 200
+ stops: [0.5, red, 0.5, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-radial-2-ref.yaml b/gfx/wr/wrench/reftests/gradient/norm-radial-2-ref.yaml
new file mode 100644
index 0000000000..adfc8d70d4
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-radial-2-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ radius: 200 200
+ stops: [0.0, blue, 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-radial-2.yaml b/gfx/wr/wrench/reftests/gradient/norm-radial-2.yaml
new file mode 100644
index 0000000000..dac1b78361
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-radial-2.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ radius: 200 200
+ stops: [-0.5, red, -0.5, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-radial-3-ref.yaml b/gfx/wr/wrench/reftests/gradient/norm-radial-3-ref.yaml
new file mode 100644
index 0000000000..d90d1ee4f8
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-radial-3-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ radius: 200 200
+ stops: [0.0, red, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-radial-3.yaml b/gfx/wr/wrench/reftests/gradient/norm-radial-3.yaml
new file mode 100644
index 0000000000..fbd5dc929f
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-radial-3.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ radius: 200 200
+ stops: [1.5, red, 1.5, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-radial-degenerate-ref.yaml b/gfx/wr/wrench/reftests/gradient/norm-radial-degenerate-ref.yaml
new file mode 100644
index 0000000000..afe59a770b
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-radial-degenerate-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ radius: 150 150
+ stops: [0.0, red, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/norm-radial-degenerate.yaml b/gfx/wr/wrench/reftests/gradient/norm-radial-degenerate.yaml
new file mode 100644
index 0000000000..26d9935475
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/norm-radial-degenerate.yaml
@@ -0,0 +1,14 @@
+# see: https://www.w3.org/TR/2012/CR-css3-images-20120417/#repeating-gradients
+# the spec says that repeating gradients with color stops in the same offset
+# must render as a solid rect with color equal to the average color of the
+# gradient. Gecko and Blink seem to draw it with color equal to the last stop
+# so that is the behavior tested here
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ radius: 150 150
+ stops: [0.5, blue, 0.5, red]
+ repeat: true
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-aligned-2.png b/gfx/wr/wrench/reftests/gradient/premultiplied-aligned-2.png
new file mode 100644
index 0000000000..b27b9df586
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-aligned-2.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-aligned-2.yaml b/gfx/wr/wrench/reftests/gradient/premultiplied-aligned-2.yaml
new file mode 100644
index 0000000000..ea8acd5f26
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-aligned-2.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0.0, [255.0, 0.0, 0.0, 0.5], 0.5, [0.0, 255.0, 0.0, 0.5], 1.0, [0.0, 0.0, 255.0, 0.5]]
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-aligned.png b/gfx/wr/wrench/reftests/gradient/premultiplied-aligned.png
new file mode 100644
index 0000000000..35fad64b1a
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-aligned.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-aligned.yaml b/gfx/wr/wrench/reftests/gradient/premultiplied-aligned.yaml
new file mode 100644
index 0000000000..a709f845ea
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-aligned.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0.0, red, 0.5, [0.0, 0.0, 0.0, 0.0], 1.0, green]
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-angle-2.png b/gfx/wr/wrench/reftests/gradient/premultiplied-angle-2.png
new file mode 100644
index 0000000000..ea7a5cf7ef
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-angle-2.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-angle-2.yaml b/gfx/wr/wrench/reftests/gradient/premultiplied-angle-2.yaml
new file mode 100644
index 0000000000..35546b0cd2
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-angle-2.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 0
+ end: 200 200
+ stops: [0.0, [255.0, 0.0, 0.0, 0.5], 0.5, [0.0, 255.0, 0.0, 0.5], 1.0, [0.0, 0.0, 255.0, 0.5]]
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-angle.png b/gfx/wr/wrench/reftests/gradient/premultiplied-angle.png
new file mode 100644
index 0000000000..a37120ad7e
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-angle.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-angle.yaml b/gfx/wr/wrench/reftests/gradient/premultiplied-angle.yaml
new file mode 100644
index 0000000000..b665e47150
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-angle.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 0
+ end: 200 200
+ stops: [0.0, red, 0.5, [0.0, 0.0, 0.0, 0.0], 1.0, green]
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-conic-2.png b/gfx/wr/wrench/reftests/gradient/premultiplied-conic-2.png
new file mode 100644
index 0000000000..e589168621
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-conic-2.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-conic-2.yaml b/gfx/wr/wrench/reftests/gradient/premultiplied-conic-2.yaml
new file mode 100644
index 0000000000..dee4cec03b
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-conic-2.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [0.0, [255.0, 0.0, 0.0, 0.5], 0.5, [0.0, 255.0, 0.0, 0.5], 1.0, [0.0, 0.0, 255.0, 0.5]]
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-conic.png b/gfx/wr/wrench/reftests/gradient/premultiplied-conic.png
new file mode 100644
index 0000000000..678dc9c87f
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-conic.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-conic.yaml b/gfx/wr/wrench/reftests/gradient/premultiplied-conic.yaml
new file mode 100644
index 0000000000..d4b442bca7
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-conic.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [0.0, red, 0.5, [0.0, 0.0, 0.0, 0.0], 1.0, green]
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-radial-2.png b/gfx/wr/wrench/reftests/gradient/premultiplied-radial-2.png
new file mode 100644
index 0000000000..cfd7ca2aaa
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-radial-2.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-radial-2.yaml b/gfx/wr/wrench/reftests/gradient/premultiplied-radial-2.yaml
new file mode 100644
index 0000000000..3e682328d1
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-radial-2.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 200 200
+ center: 100 100
+ radius: 100 100
+ stops: [0.0, [255.0, 0.0, 0.0, 0.5], 0.5, [0.0, 255.0, 0.0, 0.5], 1.0, [0.0, 0.0, 255.0, 0.5]]
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-radial.png b/gfx/wr/wrench/reftests/gradient/premultiplied-radial.png
new file mode 100644
index 0000000000..0b2b2c2f21
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-radial.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/premultiplied-radial.yaml b/gfx/wr/wrench/reftests/gradient/premultiplied-radial.yaml
new file mode 100644
index 0000000000..dc3750abd4
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/premultiplied-radial.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 200 200
+ center: 100 100
+ radius: 100 100
+ stops: [0.0, red, 0.5, [0.0, 0.0, 0.0, 0.0], 1.0, green]
diff --git a/gfx/wr/wrench/reftests/gradient/radial-backdrop-ref.yaml b/gfx/wr/wrench/reftests/gradient/radial-backdrop-ref.yaml
new file mode 100644
index 0000000000..a878e2ac0a
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-backdrop-ref.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: 0 0 800 450
+ color: red
+ - type: radial-gradient
+ bounds: 0 0 800 450
+ center: 400 225
+ radius: 200 200
+ stops: [ 0.0, [255, 255, 255, 1], 1.0, [0,0,0,1] ]
diff --git a/gfx/wr/wrench/reftests/gradient/radial-backdrop-with-spacing-ref.yaml b/gfx/wr/wrench/reftests/gradient/radial-backdrop-with-spacing-ref.yaml
new file mode 100644
index 0000000000..2aea254d3a
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-backdrop-with-spacing-ref.yaml
@@ -0,0 +1,13 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: 0 0 800 450
+ color: red
+ - type: radial-gradient
+ bounds: 0 0 800 450
+ center: 50 50
+ radius: 60 60
+ stops: [ 0.0, [255, 255, 255, 1], 1.0, [0,0,0,1] ]
+ tile-size: 100 100
+ tile-spacing: 20 20
diff --git a/gfx/wr/wrench/reftests/gradient/radial-backdrop-with-spacing.yaml b/gfx/wr/wrench/reftests/gradient/radial-backdrop-with-spacing.yaml
new file mode 100644
index 0000000000..f8e2c14b1c
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-backdrop-with-spacing.yaml
@@ -0,0 +1,18 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: 0 0 800 450
+ color: red
+ - type: "scroll-frame"
+ bounds: 0 0 800 450
+ clip-rect: 0 0 800 450
+ id: 2
+ - type: radial-gradient
+ bounds: 0 0 800 450
+ spatial-id: 2
+ center: 50 50
+ radius: 60 60
+ stops: [ 0.0, [255, 255, 255, 1], 1.0, [0,0,0,1] ]
+ tile-size: 100 100
+ tile-spacing: 20 20
diff --git a/gfx/wr/wrench/reftests/gradient/radial-backdrop.yaml b/gfx/wr/wrench/reftests/gradient/radial-backdrop.yaml
new file mode 100644
index 0000000000..91ee3a6ba1
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-backdrop.yaml
@@ -0,0 +1,16 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: 0 0 800 450
+ color: red
+ - type: "scroll-frame"
+ bounds: 0 0 800 450
+ clip-rect: 0 0 800 450
+ id: 2
+ - type: radial-gradient
+ bounds: 0 0 800 450
+ spatial-id: 2
+ center: 400 225
+ radius: 200 200
+ stops: [ 0.0, [255, 255, 255, 1], 1.0, [0,0,0,1] ]
diff --git a/gfx/wr/wrench/reftests/gradient/radial-circle-ref.png b/gfx/wr/wrench/reftests/gradient/radial-circle-ref.png
new file mode 100644
index 0000000000..3f9a748a7e
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-circle-ref.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/radial-circle.yaml b/gfx/wr/wrench/reftests/gradient/radial-circle.yaml
new file mode 100644
index 0000000000..037da7eddc
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-circle.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ radius: 200 200
+ stops: [0, red, 1, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/radial-ellipse-ref.png b/gfx/wr/wrench/reftests/gradient/radial-ellipse-ref.png
new file mode 100644
index 0000000000..b4786cd387
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-ellipse-ref.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/radial-ellipse.yaml b/gfx/wr/wrench/reftests/gradient/radial-ellipse.yaml
new file mode 100644
index 0000000000..7c733f7223
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-ellipse.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ radius: 100 200
+ stops: [0, red, 1, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/radial-large-ref.png b/gfx/wr/wrench/reftests/gradient/radial-large-ref.png
new file mode 100644
index 0000000000..444b876094
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-large-ref.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/radial-large.yaml b/gfx/wr/wrench/reftests/gradient/radial-large.yaml
new file mode 100644
index 0000000000..c03adec6c1
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-large.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 2000 300
+ center: 1000 150
+ radius: 900 200
+ stops: [0, red, 1, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/radial-nan.yaml b/gfx/wr/wrench/reftests/gradient/radial-nan.yaml
new file mode 100644
index 0000000000..f8127a8c7a
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-nan.yaml
@@ -0,0 +1,35 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 NaN 300
+ center: 150 150
+ radius: 200 200
+ stops: [0, red, 1, blue]
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 NaN
+ radius: 200 200
+ stops: [0, red, 1, blue]
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ radius: NaN 200
+ stops: [0, red, 1, blue]
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ radius: 200 200
+ stops: [0, red, NaN, blue]
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ tile-size: 50 NaN
+ center: 150 150
+ radius: 200 200
+ stops: [0, red, 1, blue]
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ clip-rect: 50 10 NaN 300
+ center: 150 150
+ radius: 200 200
+ stops: [0, red, 1, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/radial-optimized-2-ref.yaml b/gfx/wr/wrench/reftests/gradient/radial-optimized-2-ref.yaml
new file mode 100644
index 0000000000..4b900d93fa
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-optimized-2-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 500 500
+ center: 150 150
+ radius: 80 160
+ stops: [0, red, 1, [0,0,0,0]]
diff --git a/gfx/wr/wrench/reftests/gradient/radial-optimized-2.yaml b/gfx/wr/wrench/reftests/gradient/radial-optimized-2.yaml
new file mode 100644
index 0000000000..3fac9042e2
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-optimized-2.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 500 500
+ center: 150 150
+ radius: 20 40
+ stops: [0, red, 4, [0,0,0,0]]
diff --git a/gfx/wr/wrench/reftests/gradient/radial-optimized-ref.yaml b/gfx/wr/wrench/reftests/gradient/radial-optimized-ref.yaml
new file mode 100644
index 0000000000..380384ffe6
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-optimized-ref.yaml
@@ -0,0 +1,33 @@
+# Hand-roll decomposition that webrender would do for radial-optimized.yaml
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 160 160 20 30
+ center: 10 15
+ radius: 10 15
+ stops: [0, [255.0,0,0,0.7], 1, [0,0,255.0,0.7]]
+ - type: rect
+ bounds: 10 20 150 140
+ color: [0,0,255.0,0.7]
+ - type: rect
+ bounds: 160 20 20 140
+ color: [0,0,255.0,0.7]
+ - type: rect
+ bounds: 180 20 130 140
+ color: [0,0,255.0,0.7]
+ - type: rect
+ bounds: 10 160 150 30
+ color: [0,0,255.0,0.7]
+ - type: rect
+ bounds: 180 160 130 30
+ color: [0,0,255.0,0.7]
+ - type: rect
+ bounds: 10 190 150 160
+ color: [0,0,255.0,0.7]
+ - type: rect
+ bounds: 160 190 20 160
+ color: [0,0,255.0,0.7]
+ - type: rect
+ bounds: 180 190 130 160
+ color: [0,0,255.0,0.7]
diff --git a/gfx/wr/wrench/reftests/gradient/radial-optimized.yaml b/gfx/wr/wrench/reftests/gradient/radial-optimized.yaml
new file mode 100644
index 0000000000..cfc668bc66
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-optimized.yaml
@@ -0,0 +1,12 @@
+# A small radial gradient in a large primitive.
+# Most of the primitive is the constant color of the last gradient stop,
+# and webrender will try to optimize these parts by drawing them with
+# solid color primitives.
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 10 20 300 330
+ center: 160 155
+ radius: 10 15
+ stops: [0, [255.0,0,0,0.7], 1, [0,0,255.0,0.7]]
diff --git a/gfx/wr/wrench/reftests/gradient/radial-tiling-optimized-ref.yaml b/gfx/wr/wrench/reftests/gradient/radial-tiling-optimized-ref.yaml
new file mode 100644
index 0000000000..b5b4957f9b
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-tiling-optimized-ref.yaml
@@ -0,0 +1,24 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 40 20 20
+ center: 10 10
+ radius: 10 10
+ stops: [0, red, 1, blue, 1, [0,0,0,0]]
+ - type: radial-gradient
+ bounds: 450 40 20 20
+ center: 10 10
+ radius: 10 10
+ stops: [0, red, 1, blue, 1, [0,0,0,0]]
+ - type: radial-gradient
+ bounds: 450 340 20 20
+ center: 10 10
+ radius: 10 10
+ stops: [0, red, 1, blue, 1, [0,0,0,0]]
+ - type: radial-gradient
+ bounds: 50 340 20 20
+ center: 10 10
+ radius: 10 10
+ stops: [0, red, 1, blue, 1, [0,0,0,0]]
+
diff --git a/gfx/wr/wrench/reftests/gradient/radial-tiling-optimized.yaml b/gfx/wr/wrench/reftests/gradient/radial-tiling-optimized.yaml
new file mode 100644
index 0000000000..a92fd24479
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-tiling-optimized.yaml
@@ -0,0 +1,13 @@
+# A small repeated radial gradient in a large primitive.
+# There is a lot of fully transparent space that webrender
+# will optimize out.
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 10 10 800 600
+ center: 50 40
+ radius: 10 10
+ stops: [0, red, 1, blue, 1, [0,0,0,0]]
+ tile-size: 300 200
+ tile-spacing: 100 100
diff --git a/gfx/wr/wrench/reftests/gradient/radial-zero-size-1.yaml b/gfx/wr/wrench/reftests/gradient/radial-zero-size-1.yaml
new file mode 100644
index 0000000000..43e4ef323d
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-zero-size-1.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 200 200
+ center: 100 100
+ radius: 100 0
+ stops: [0.0, blue, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/radial-zero-size-2.yaml b/gfx/wr/wrench/reftests/gradient/radial-zero-size-2.yaml
new file mode 100644
index 0000000000..94bf6eae73
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-zero-size-2.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 200 200
+ center: 100 100
+ radius: 0 100
+ stops: [0.0, blue, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/radial-zero-size-3.yaml b/gfx/wr/wrench/reftests/gradient/radial-zero-size-3.yaml
new file mode 100644
index 0000000000..3efa1ec307
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-zero-size-3.yaml
@@ -0,0 +1,6 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: 50 50 200 200
+ color: red
diff --git a/gfx/wr/wrench/reftests/gradient/radial-zero-size-ref.yaml b/gfx/wr/wrench/reftests/gradient/radial-zero-size-ref.yaml
new file mode 100644
index 0000000000..b3770b752e
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/radial-zero-size-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 200 200
+ center: 100 100
+ radius: 100 100
+ stops: [0.0, red, 1.0, red]
diff --git a/gfx/wr/wrench/reftests/gradient/reftest.list b/gfx/wr/wrench/reftests/gradient/reftest.list
new file mode 100644
index 0000000000..5c55c29b06
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/reftest.list
@@ -0,0 +1,128 @@
+platform(linux,mac) == premultiplied-aligned.yaml premultiplied-aligned.png
+fuzzy(1,500) platform(linux,mac) == premultiplied-angle.yaml premultiplied-angle.png
+platform(linux,mac) == premultiplied-radial.yaml premultiplied-radial.png
+platform(linux,mac) == premultiplied-conic.yaml premultiplied-conic.png
+
+platform(linux,mac) == premultiplied-aligned-2.yaml premultiplied-aligned-2.png
+platform(linux,mac) == premultiplied-angle-2.yaml premultiplied-angle-2.png
+platform(linux,mac) == premultiplied-radial-2.yaml premultiplied-radial-2.png
+platform(linux,mac) == premultiplied-conic-2.yaml premultiplied-conic-2.png
+
+== linear.yaml linear-ref.png
+== linear-reverse.yaml linear-ref.png
+fuzzy(255,1200) == linear-reverse-2.yaml linear-reverse-2-ref.yaml
+== linear-reverse-3.yaml linear-reverse-3-ref.yaml
+platform(linux,mac) fuzzy(1,35000) == linear-stops.yaml linear-stops-ref.png
+
+== linear-clamp-1a.yaml linear-clamp-1-ref.yaml
+== linear-clamp-1b.yaml linear-clamp-1-ref.yaml
+== linear-clamp-2.yaml linear-clamp-2-ref.yaml
+
+fuzzy-range(<=1,*4800) == linear-hard-stop.yaml linear-hard-stop-ref.png
+fuzzy-if(env(android,device),15,17000) == linear-hard-stop-repeat-large.yaml linear-hard-stop-repeat-large-ref.yaml # Android device is Samsung Galaxy A51
+
+# dithering requires us to fuzz here
+fuzzy(1,20000) == linear.yaml linear-ref.yaml
+fuzzy(1,20000) == linear-reverse.yaml linear-ref.yaml
+
+fuzzy(1,40000) == linear-aligned-clip.yaml linear-aligned-clip-ref.yaml
+
+platform(linux,mac) fuzzy(1,80000) == radial-circle.yaml radial-circle-ref.png
+platform(linux,mac) fuzzy(1,80000) == radial-ellipse.yaml radial-ellipse-ref.png
+
+!= radial-circle.yaml radial-ellipse.yaml
+
+== norm-linear-1.yaml norm-linear-1-ref.yaml
+== norm-linear-2.yaml norm-linear-2-ref.yaml
+== norm-linear-3.yaml norm-linear-3-ref.yaml
+== norm-linear-4.yaml norm-linear-4-ref.yaml
+== norm-linear-degenerate.yaml norm-radial-degenerate-ref.yaml
+
+== norm-radial-1.yaml norm-radial-1-ref.yaml
+== norm-radial-2.yaml norm-radial-2-ref.yaml
+== norm-radial-3.yaml norm-radial-3-ref.yaml
+== norm-radial-degenerate.yaml norm-radial-degenerate-ref.yaml
+
+== norm-conic-1.yaml norm-conic-1-ref.yaml
+== norm-conic-2.yaml norm-conic-2-ref.yaml
+== norm-conic-3.yaml norm-conic-3-ref.yaml
+== norm-conic-4.yaml norm-conic-4-ref.yaml
+== norm-conic-degenerate.yaml norm-conic-degenerate-ref.yaml
+
+# fuzzy because of differences from normalization
+# this might be able to be improved
+fuzzy(255,1200) == repeat-linear.yaml repeat-linear-ref.yaml
+fuzzy(255,1200) == repeat-linear-reverse.yaml repeat-linear-ref.yaml
+fuzzy(255,2666) == repeat-radial.yaml repeat-radial-ref.yaml
+fuzzy(255,2666) == repeat-radial-negative.yaml repeat-radial-ref.yaml
+fuzzy(255,1652) == repeat-conic.yaml repeat-conic-ref.yaml
+fuzzy(255,1652) == repeat-conic-negative.yaml repeat-conic-ref.yaml
+
+# fuzzy because of thin spaced out column of pixels that are 1 off
+fuzzy(1,83164) == tiling-linear-1.yaml tiling-linear-1-ref.yaml
+fuzzy(1,46293) == tiling-linear-2.yaml tiling-linear-2-ref.yaml
+fuzzy(1,62154) == tiling-linear-3.yaml tiling-linear-3-ref.yaml
+
+fuzzy(1,17) == tiling-radial-1.yaml tiling-radial-1-ref.yaml
+fuzzy(1,1) == tiling-radial-2.yaml tiling-radial-2-ref.yaml
+fuzzy(1,3) fuzzy-if(platform(swgl),1,1318) == tiling-radial-3.yaml tiling-radial-3-ref.yaml
+fuzzy(1,17) == tiling-radial-4.yaml tiling-radial-4-ref.yaml
+
+fuzzy(1,17) == tiling-conic-1.yaml tiling-conic-1-ref.yaml
+fuzzy(1,1) == tiling-conic-2.yaml tiling-conic-2-ref.yaml
+fuzzy(1,7) == tiling-conic-3.yaml tiling-conic-3-ref.yaml
+
+== radial-zero-size-1.yaml radial-zero-size-ref.yaml
+== radial-zero-size-2.yaml radial-zero-size-ref.yaml
+== radial-zero-size-3.yaml radial-zero-size-ref.yaml
+
+== linear-adjust-tile-size.yaml linear-adjust-tile-size-ref.yaml
+== linear-repeat-clip.yaml linear-repeat-clip-ref.yaml
+
+platform(linux,mac) == linear-aligned-border-radius.yaml linear-aligned-border-radius.png
+# interpolation fuzz from sampling texture-baked gradient ramps
+platform(linux,mac) fuzzy-range(<=1,*1404) == repeat-border-radius.yaml repeat-border-radius.png
+
+== conic.yaml conic-ref.yaml
+fuzzy(1,57) == conic-simple.yaml conic-simple.png
+fuzzy(255,302) == conic-angle.yaml conic-angle.png
+== conic-center.yaml conic-center.png
+fuzzy(1,2) == conic-angle-wraparound.yaml conic-angle.yaml
+fuzzy-if(env(android,device),254,146) fuzzy-if(not(env(android,device)),1,1) == conic-angle-wraparound-negative.yaml conic-angle.yaml # Android device is Samsung Galaxy A51
+fuzzy(1,333) == conic-color-wheel.yaml conic-color-wheel.png
+
+# gradient caching tests
+# replaces a computed gradient by a sampled texture, so a lot of off-by-one
+# variation from interpolation, which is fine:
+fuzzy-range(<=1,*195000) == gradient_cache_5stops.yaml gradient_cache_5stops_ref.yaml
+fuzzy-range(<=1,*171840) == gradient_cache_5stops_vertical.yaml gradient_cache_5stops_vertical_ref.yaml
+== gradient_cache_hardstop.yaml gradient_cache_hardstop_ref.yaml
+fuzzy-range(<=1,1) == gradient_cache_hardstop_clip.yaml gradient_cache_hardstop_clip_ref.yaml
+== gradient_cache_clamp.yaml gradient_cache_clamp_ref.yaml
+== gradient_cache_repeat.yaml gradient_cache_repeat_ref.yaml
+== linear-bug-1703141.yaml linear-bug-1703141.yaml
+
+# Recognize opaque tiles with gradient backgrounds
+== conic-backdrop-with-spacing.yaml conic-backdrop-with-spacing-ref.yaml
+== conic-backdrop.yaml conic-backdrop-ref.yaml
+== linear-backdrop-with-spacing.yaml linear-backdrop-with-spacing-ref.yaml
+== linear-backdrop.yaml linear-backdrop-ref.yaml
+== radial-backdrop-with-spacing.yaml radial-backdrop-with-spacing-ref.yaml
+== radial-backdrop.yaml radial-backdrop-ref.yaml
+
+# Exercise the radial gradient optimization code path
+== radial-optimized.yaml radial-optimized-ref.yaml
+== radial-optimized-2.yaml radial-optimized-2-ref.yaml
+== radial-tiling-optimized.yaml radial-tiling-optimized-ref.yaml
+
+# Exercise the cached gradient scaling code path
+fuzzy(2,23000) == linear-large.yaml linear-large-ref.yaml
+== conic-large.yaml conic-large-ref.yaml
+fuzzy-if(env(android,device),254,1) == conic-large-hard-stop.yaml conic-large-hard-stop-ref.yaml # Android device is Samsung Galaxy A51
+fuzzy(1,7000) == radial-large.yaml radial-large-ref.png
+
+# crash tests
+== linear-far-endpoints.yaml linear-far-endpoints.yaml
+== linear-nan.yaml linear-nan.yaml
+== radial-nan.yaml radial-nan.yaml
+== conic-nan.yaml conic-nan.yaml
diff --git a/gfx/wr/wrench/reftests/gradient/repeat-border-radius.png b/gfx/wr/wrench/reftests/gradient/repeat-border-radius.png
new file mode 100644
index 0000000000..cc0fa947ae
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/repeat-border-radius.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/gradient/repeat-border-radius.yaml b/gfx/wr/wrench/reftests/gradient/repeat-border-radius.yaml
new file mode 100644
index 0000000000..08904e082f
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/repeat-border-radius.yaml
@@ -0,0 +1,136 @@
+---
+root:
+ items:
+ - type: clip
+ id: 2
+ complex:
+ - rect: [20, 20, 100, 100]
+ radius: 32
+ - type: gradient
+ bounds: 20 20 100 100
+ start: 50 0
+ end: 50 100
+ stops: [0.0, red, 1.0, yellow]
+ repeat: true
+ clip-chain: [2]
+
+ - type: rect
+ bounds: [130, 10, 120, 120]
+ color: blue
+
+ - type: clip
+ id: 3
+ complex:
+ - rect: [140, 20, 100, 100]
+ radius: 32
+ - type: gradient
+ bounds: 140 20 100 100
+ start: 50 0
+ end: 50 100
+ stops: [0.2, red, 1.0, yellow]
+ clip-chain: [3]
+
+ - type: rect
+ bounds: [260, 10, 120, 120]
+ color: black
+
+ - type: clip
+ id: 4
+ complex:
+ - rect: [270, 20, 100, 100]
+ radius: 32
+ - type: gradient
+ bounds: 270 20 100 100
+ start: 50 0
+ end: 51 100
+ stops: [0.0, red, 1.0, yellow]
+ clip-chain: [4]
+
+ - type: clip
+ id: 5
+ complex:
+ - rect: [20, 160, 100, 100]
+ radius: 32
+ - type: radial-gradient
+ bounds: 20 160 100 100
+ center: 50 50
+ radius: 25 25
+ stops: [0.0, red, 1.0, yellow]
+ clip-chain: [5]
+
+ - type: rect
+ bounds: [130, 150, 120, 120]
+ color: blue
+
+ - type: clip
+ id: 6
+ complex:
+ - rect: [140, 160, 100, 100]
+ radius: 32
+ - type: radial-gradient
+ bounds: 140 160 100 100
+ center: 50 50
+ radius: 25 25
+ stops: [0.0, red, 1.0, yellow]
+ clip-chain: [6]
+
+ - type: rect
+ bounds: [260, 150, 120, 120]
+ color: black
+
+ - type: clip
+ id: 7
+ complex:
+ - rect: [270, 160, 100, 100]
+ radius: 32
+ - type: radial-gradient
+ bounds: 270 160 100 100
+ center: 50 50
+ radius: 25 25
+ stops: [0.0, red, 1.0, yellow]
+ clip-chain: [7]
+
+ - type: clip
+ id: 8
+ complex:
+ - rect: [20, 300, 100, 100]
+ radius: 32
+ - type: conic-gradient
+ bounds: 20 300 100 100
+ angle: 0.0
+ center: 50 50
+ stops: [0.0, red, 1.0, yellow]
+ repeat: true
+ clip-chain: [8]
+
+ - type: rect
+ bounds: [130, 290, 120, 120]
+ color: blue
+
+ - type: clip
+ id: 9
+ complex:
+ - rect: [140, 300, 100, 100]
+ radius: 32
+ - type: conic-gradient
+ bounds: 140 300 100 100
+ angle: 0.0
+ center: 50 50
+ stops: [0.0, red, 1.0, yellow]
+ clip-chain: [9]
+
+ - type: rect
+ bounds: [260, 290, 120, 120]
+ color: black
+
+ - type: clip
+ id: 10
+ complex:
+ - rect: [270, 300, 100, 100]
+ radius: 32
+ - type: conic-gradient
+ bounds: 270 300 100 100
+ angle: 0.0
+ center: 50 50
+ stops: [0.0, red, 1.0, yellow]
+ clip-chain: [10]
diff --git a/gfx/wr/wrench/reftests/gradient/repeat-conic-negative.yaml b/gfx/wr/wrench/reftests/gradient/repeat-conic-negative.yaml
new file mode 100644
index 0000000000..e1043562da
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/repeat-conic-negative.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 300 300
+ angle: -0.62831853
+ center: 150 150
+ stops: [0.1, red, 0.2, red, 0.2, blue, 0.3, blue]
+ repeat: true
diff --git a/gfx/wr/wrench/reftests/gradient/repeat-conic-ref.yaml b/gfx/wr/wrench/reftests/gradient/repeat-conic-ref.yaml
new file mode 100644
index 0000000000..b98cc378a7
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/repeat-conic-ref.yaml
@@ -0,0 +1,27 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 300 300
+ angle: 0.0
+ center: 150 150
+ stops: [0.0, red,
+ 0.1, red,
+ 0.1, blue,
+ 0.2, blue,
+ 0.2, red,
+ 0.3, red,
+ 0.3, blue,
+ 0.4, blue,
+ 0.4, red,
+ 0.5, red,
+ 0.5, blue,
+ 0.6, blue,
+ 0.6, red,
+ 0.7, red,
+ 0.7, blue,
+ 0.8, blue,
+ 0.8, red,
+ 0.9, red,
+ 0.9, blue,
+ 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/repeat-conic.yaml b/gfx/wr/wrench/reftests/gradient/repeat-conic.yaml
new file mode 100644
index 0000000000..bbc4202aec
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/repeat-conic.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: conic-gradient
+ bounds: 50 50 300 300
+ angle: 0.0
+ center: 150 150
+ stops: [0.1, blue, 0.2, blue, 0.2, red, 0.3, red]
+ repeat: true
diff --git a/gfx/wr/wrench/reftests/gradient/repeat-linear-ref.yaml b/gfx/wr/wrench/reftests/gradient/repeat-linear-ref.yaml
new file mode 100644
index 0000000000..420a08db01
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/repeat-linear-ref.yaml
@@ -0,0 +1,27 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 300 300
+ start: 0 150
+ end: 300 150
+ stops: [0.0, red,
+ 0.1, red,
+ 0.1, blue,
+ 0.2, blue,
+ 0.2, red,
+ 0.3, red,
+ 0.3, blue,
+ 0.4, blue,
+ 0.4, red,
+ 0.5, red,
+ 0.5, blue,
+ 0.6, blue,
+ 0.6, red,
+ 0.7, red,
+ 0.7, blue,
+ 0.8, blue,
+ 0.8, red,
+ 0.9, red,
+ 0.9, blue,
+ 1.0, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/repeat-linear-reverse.yaml b/gfx/wr/wrench/reftests/gradient/repeat-linear-reverse.yaml
new file mode 100644
index 0000000000..a81bafe1bd
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/repeat-linear-reverse.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 300 300
+ start: 300 150
+ end: 0 150
+ stops: [0.1, red, 0.2, red, 0.2, blue, 0.3, blue]
+ repeat: true
diff --git a/gfx/wr/wrench/reftests/gradient/repeat-linear.yaml b/gfx/wr/wrench/reftests/gradient/repeat-linear.yaml
new file mode 100644
index 0000000000..63e136bc8e
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/repeat-linear.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: gradient
+ bounds: 50 50 300 300
+ start: 0 150
+ end: 300 150
+ stops: [0.1, blue, 0.2, blue, 0.2, red, 0.3, red]
+ repeat: true
diff --git a/gfx/wr/wrench/reftests/gradient/repeat-radial-negative.yaml b/gfx/wr/wrench/reftests/gradient/repeat-radial-negative.yaml
new file mode 100644
index 0000000000..949455f893
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/repeat-radial-negative.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ radius: 150 150
+ stops: [-0.3, blue, -0.2, blue, -0.2, red, -0.1, red]
+ repeat: true
diff --git a/gfx/wr/wrench/reftests/gradient/repeat-radial-ref.yaml b/gfx/wr/wrench/reftests/gradient/repeat-radial-ref.yaml
new file mode 100644
index 0000000000..d2c0292e6e
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/repeat-radial-ref.yaml
@@ -0,0 +1,38 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ radius: 150 150
+ # note: we need stops up to 1.4 because a repeating radial gradient
+ # will fill the whole rect beyond 1.0. So the furthest radius we have
+ # to fill in is the diagonal of the unit square
+ stops: [0.0, red,
+ 0.1, red,
+ 0.1, blue,
+ 0.2, blue,
+ 0.2, red,
+ 0.3, red,
+ 0.3, blue,
+ 0.4, blue,
+ 0.4, red,
+ 0.5, red,
+ 0.5, blue,
+ 0.6, blue,
+ 0.6, red,
+ 0.7, red,
+ 0.7, blue,
+ 0.8, blue,
+ 0.8, red,
+ 0.9, red,
+ 0.9, blue,
+ 1.0, blue,
+ 1.0, red,
+ 1.1, red,
+ 1.1, blue,
+ 1.2, blue,
+ 1.2, red,
+ 1.3, red,
+ 1.3, blue,
+ 1.4, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/repeat-radial.yaml b/gfx/wr/wrench/reftests/gradient/repeat-radial.yaml
new file mode 100644
index 0000000000..04c676c25b
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/repeat-radial.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ - type: radial-gradient
+ bounds: 50 50 300 300
+ center: 150 150
+ radius: 150 150
+ stops: [0.1, blue, 0.2, blue, 0.2, red, 0.3, red]
+ repeat: true
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-conic-1-ref.yaml b/gfx/wr/wrench/reftests/gradient/tiling-conic-1-ref.yaml
new file mode 100644
index 0000000000..6b93e28fa1
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-conic-1-ref.yaml
@@ -0,0 +1,27 @@
+---
+root:
+ items:
+ # top left
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [0, red, 1, blue]
+ # top right
+ - type: conic-gradient
+ bounds: 350 50 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [0, red, 1, blue]
+ # bottom left
+ - type: conic-gradient
+ bounds: 50 350 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [0, red, 1, blue]
+ # bottom right
+ - type: conic-gradient
+ bounds: 350 350 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [0, red, 1, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-conic-1.yaml b/gfx/wr/wrench/reftests/gradient/tiling-conic-1.yaml
new file mode 100644
index 0000000000..71ffe80b22
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-conic-1.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ # basic - 4 tiles spaced out with no clipping
+ - type: conic-gradient
+ bounds: 50 50 500 500
+ angle: 0.0
+ center: 100 100
+ stops: [0, red, 1, blue]
+ tile-size: 200 200
+ tile-spacing: 100 100
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-conic-2-ref.yaml b/gfx/wr/wrench/reftests/gradient/tiling-conic-2-ref.yaml
new file mode 100644
index 0000000000..4360aa204c
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-conic-2-ref.yaml
@@ -0,0 +1,27 @@
+---
+root:
+ items:
+ # top left
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [0, red, 1, blue]
+ # top right
+ - type: conic-gradient
+ bounds: 350 50 100 200
+ angle: 0.0
+ center: 100 100
+ stops: [0, red, 1, blue]
+ # bottom left
+ - type: conic-gradient
+ bounds: 50 350 200 100
+ angle: 0.0
+ center: 100 100
+ stops: [0, red, 1, blue]
+ # bottom right
+ - type: conic-gradient
+ bounds: 350 350 100 100
+ angle: 0.0
+ center: 100 100
+ stops: [0, red, 1, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-conic-2.yaml b/gfx/wr/wrench/reftests/gradient/tiling-conic-2.yaml
new file mode 100644
index 0000000000..ba9522a68c
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-conic-2.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ # slightly clip the last tile
+ - type: conic-gradient
+ bounds: 50 50 400 400
+ angle: 0.0
+ center: 100 100
+ stops: [0, red, 1, blue]
+ tile-size: 200 200
+ tile-spacing: 100 100
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-conic-3-ref.yaml b/gfx/wr/wrench/reftests/gradient/tiling-conic-3-ref.yaml
new file mode 100644
index 0000000000..d7b9541ef4
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-conic-3-ref.yaml
@@ -0,0 +1,27 @@
+---
+root:
+ items:
+ # top left
+ - type: conic-gradient
+ bounds: 50 50 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [0, red, 1, blue]
+ # top right
+ - type: conic-gradient
+ bounds: 250 50 200 200
+ angle: 0.0
+ center: 100 100
+ stops: [0, red, 1, blue]
+ # bottom left
+ - type: conic-gradient
+ bounds: 50 250 200 100
+ angle: 0.0
+ center: 100 100
+ stops: [0, red, 1, blue]
+ # bottom right
+ - type: conic-gradient
+ bounds: 250 250 200 100
+ angle: 0.0
+ center: 100 100
+ stops: [0, red, 1, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-conic-3.yaml b/gfx/wr/wrench/reftests/gradient/tiling-conic-3.yaml
new file mode 100644
index 0000000000..77b28a9e22
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-conic-3.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ # no spacing with a clip
+ - type: conic-gradient
+ bounds: 50 50 400 300
+ angle: 0.0
+ center: 100 100
+ stops: [0, red, 1, blue]
+ tile-size: 200 200
+ tile-spacing: 0 0
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-linear-1-ref.yaml b/gfx/wr/wrench/reftests/gradient/tiling-linear-1-ref.yaml
new file mode 100644
index 0000000000..c06e05fb53
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-linear-1-ref.yaml
@@ -0,0 +1,27 @@
+---
+root:
+ items:
+ # top left
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0, red, 1, blue]
+ # top right
+ - type: gradient
+ bounds: 350 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0, red, 1, blue]
+ # bottom left
+ - type: gradient
+ bounds: 50 350 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0, red, 1, blue]
+ # bottom right
+ - type: gradient
+ bounds: 350 350 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0, red, 1, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-linear-1.yaml b/gfx/wr/wrench/reftests/gradient/tiling-linear-1.yaml
new file mode 100644
index 0000000000..f388e7c593
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-linear-1.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ # basic - 4 tiles spaced out with no clipping
+ - type: gradient
+ bounds: 50 50 500 500
+ start: 0 100
+ end: 200 100
+ stops: [0, red, 1, blue]
+ tile-size: 200 200
+ tile-spacing: 100 100
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-linear-2-ref.yaml b/gfx/wr/wrench/reftests/gradient/tiling-linear-2-ref.yaml
new file mode 100644
index 0000000000..be7dc77463
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-linear-2-ref.yaml
@@ -0,0 +1,27 @@
+---
+root:
+ items:
+ # top left
+ - type: gradient
+ bounds: 50 50 200 200
+ start: 0 100
+ end: 200 100
+ stops: [0, red, 1, blue]
+ # top right
+ - type: gradient
+ bounds: 350 50 100 200
+ start: 0 100
+ end: 200 100
+ stops: [0, red, 1, blue]
+ # bottom left
+ - type: gradient
+ bounds: 50 350 200 100
+ start: 0 100
+ end: 200 100
+ stops: [0, red, 1, blue]
+ # bottom right
+ - type: gradient
+ bounds: 350 350 100 100
+ start: 0 100
+ end: 200 100
+ stops: [0, red, 1, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-linear-2.yaml b/gfx/wr/wrench/reftests/gradient/tiling-linear-2.yaml
new file mode 100644
index 0000000000..7a01c062d1
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-linear-2.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ # slightly clip the last tile
+ - type: gradient
+ bounds: 50 50 400 400
+ start: 0 100
+ end: 200 100
+ stops: [0, red, 1, blue]
+ tile-size: 200 200
+ tile-spacing: 100 100
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-linear-3-ref.yaml b/gfx/wr/wrench/reftests/gradient/tiling-linear-3-ref.yaml
new file mode 100644
index 0000000000..90b110c8d0
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-linear-3-ref.yaml
@@ -0,0 +1,15 @@
+---
+root:
+ items:
+ # top left and bottom left
+ - type: gradient
+ bounds: 50 50 200 300
+ start: 0 100
+ end: 200 100
+ stops: [0, red, 1, blue]
+ # top right and bottom right
+ - type: gradient
+ bounds: 250 50 200 300
+ start: 0 100
+ end: 200 100
+ stops: [0, red, 1, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-linear-3.yaml b/gfx/wr/wrench/reftests/gradient/tiling-linear-3.yaml
new file mode 100644
index 0000000000..a595f3572f
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-linear-3.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ # no spacing with a clip
+ - type: gradient
+ bounds: 50 50 400 300
+ start: 0 100
+ end: 200 100
+ stops: [0, red, 1, blue]
+ tile-size: 200 200
+ tile-spacing: 0 0
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-radial-1-ref.yaml b/gfx/wr/wrench/reftests/gradient/tiling-radial-1-ref.yaml
new file mode 100644
index 0000000000..66f8c03592
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-radial-1-ref.yaml
@@ -0,0 +1,27 @@
+---
+root:
+ items:
+ # top left
+ - type: radial-gradient
+ bounds: 50 50 200 200
+ center: 100 100
+ radius: 100 100
+ stops: [0, red, 1, blue]
+ # top right
+ - type: radial-gradient
+ bounds: 350 50 200 200
+ center: 100 100
+ radius: 100 100
+ stops: [0, red, 1, blue]
+ # bottom left
+ - type: radial-gradient
+ bounds: 50 350 200 200
+ center: 100 100
+ radius: 100 100
+ stops: [0, red, 1, blue]
+ # bottom right
+ - type: radial-gradient
+ bounds: 350 350 200 200
+ center: 100 100
+ radius: 100 100
+ stops: [0, red, 1, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-radial-1.yaml b/gfx/wr/wrench/reftests/gradient/tiling-radial-1.yaml
new file mode 100644
index 0000000000..b832a72f96
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-radial-1.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ # basic - 4 tiles spaced out with no clipping
+ - type: radial-gradient
+ bounds: 50 50 500 500
+ center: 100 100
+ radius: 100 100
+ stops: [0, red, 1, blue]
+ tile-size: 200 200
+ tile-spacing: 100 100
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-radial-2-ref.yaml b/gfx/wr/wrench/reftests/gradient/tiling-radial-2-ref.yaml
new file mode 100644
index 0000000000..da9bcd1bff
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-radial-2-ref.yaml
@@ -0,0 +1,27 @@
+---
+root:
+ items:
+ # top left
+ - type: radial-gradient
+ bounds: 50 50 200 200
+ center: 100 100
+ radius: 100 100
+ stops: [0, red, 1, blue]
+ # top right
+ - type: radial-gradient
+ bounds: 350 50 100 200
+ center: 100 100
+ radius: 100 100
+ stops: [0, red, 1, blue]
+ # bottom left
+ - type: radial-gradient
+ bounds: 50 350 200 100
+ center: 100 100
+ radius: 100 100
+ stops: [0, red, 1, blue]
+ # bottom right
+ - type: radial-gradient
+ bounds: 350 350 100 100
+ center: 100 100
+ radius: 100 100
+ stops: [0, red, 1, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-radial-2.yaml b/gfx/wr/wrench/reftests/gradient/tiling-radial-2.yaml
new file mode 100644
index 0000000000..8b7feb205e
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-radial-2.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ # slightly clip the last tile
+ - type: radial-gradient
+ bounds: 50 50 400 400
+ center: 100 100
+ radius: 100 100
+ stops: [0, red, 1, blue]
+ tile-size: 200 200
+ tile-spacing: 100 100
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-radial-3-ref.yaml b/gfx/wr/wrench/reftests/gradient/tiling-radial-3-ref.yaml
new file mode 100644
index 0000000000..d8564eed64
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-radial-3-ref.yaml
@@ -0,0 +1,27 @@
+---
+root:
+ items:
+ # top left
+ - type: radial-gradient
+ bounds: 50 50 200 200
+ center: 100 100
+ radius: 200 100
+ stops: [0, red, 1, blue]
+ # top right
+ - type: radial-gradient
+ bounds: 250 50 200 200
+ center: 100 100
+ radius: 200 100
+ stops: [0, red, 1, blue]
+ # bottom left
+ - type: radial-gradient
+ bounds: 50 250 200 100
+ center: 100 100
+ radius: 200 100
+ stops: [0, red, 1, blue]
+ # bottom right
+ - type: radial-gradient
+ bounds: 250 250 200 100
+ center: 100 100
+ radius: 200 100
+ stops: [0, red, 1, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-radial-3.yaml b/gfx/wr/wrench/reftests/gradient/tiling-radial-3.yaml
new file mode 100644
index 0000000000..4ca0886a0d
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-radial-3.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ # no spacing with a clip
+ - type: radial-gradient
+ bounds: 50 50 400 300
+ center: 100 100
+ radius: 200 100
+ stops: [0, red, 1, blue]
+ tile-size: 200 200
+ tile-spacing: 0 0
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-radial-4-ref.yaml b/gfx/wr/wrench/reftests/gradient/tiling-radial-4-ref.yaml
new file mode 100644
index 0000000000..2ba2a96322
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-radial-4-ref.yaml
@@ -0,0 +1,27 @@
+---
+root:
+ items:
+ # top left
+ - type: radial-gradient
+ bounds: 50 50 200 200
+ center: 100 100
+ radius: 200 100
+ stops: [0, red, 1, blue]
+ # top right
+ - type: radial-gradient
+ bounds: 350 50 200 200
+ center: 100 100
+ radius: 200 100
+ stops: [0, red, 1, blue]
+ # bottom left
+ - type: radial-gradient
+ bounds: 50 350 200 200
+ center: 100 100
+ radius: 200 100
+ stops: [0, red, 1, blue]
+ # bottom right
+ - type: radial-gradient
+ bounds: 350 350 200 200
+ center: 100 100
+ radius: 200 100
+ stops: [0, red, 1, blue]
diff --git a/gfx/wr/wrench/reftests/gradient/tiling-radial-4.yaml b/gfx/wr/wrench/reftests/gradient/tiling-radial-4.yaml
new file mode 100644
index 0000000000..724019441f
--- /dev/null
+++ b/gfx/wr/wrench/reftests/gradient/tiling-radial-4.yaml
@@ -0,0 +1,11 @@
+---
+root:
+ items:
+ # make sure the ellipse transformation retains square tiles
+ - type: radial-gradient
+ bounds: 50 50 500 500
+ center: 100 100
+ radius: 200 100
+ stops: [0, red, 1, blue]
+ tile-size: 200 200
+ tile-spacing: 100 100