summaryrefslogtreecommitdiffstats
path: root/gfx/wr/wrench/reftests/clip
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
commit36d22d82aa202bb199967e9512281e9a53db42c9 (patch)
tree105e8c98ddea1c1e4784a60a5a6410fa416be2de /gfx/wr/wrench/reftests/clip
parentInitial commit. (diff)
downloadfirefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.tar.xz
firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.zip
Adding upstream version 115.7.0esr.upstream/115.7.0esr
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'gfx/wr/wrench/reftests/clip')
-rw-r--r--gfx/wr/wrench/reftests/clip/blank.yaml2
-rw-r--r--gfx/wr/wrench/reftests/clip/blend-container-ref.yaml6
-rw-r--r--gfx/wr/wrench/reftests/clip/blend-container.yaml19
-rw-r--r--gfx/wr/wrench/reftests/clip/border-with-rounded-clip.pngbin0 -> 1846 bytes
-rw-r--r--gfx/wr/wrench/reftests/clip/border-with-rounded-clip.yaml23
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-3d-transform-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-3d-transform.yaml33
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-45-degree-rotation-ref.pngbin0 -> 13211 bytes
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-45-degree-rotation.yaml35
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-and-filter-with-rotation-ref.yaml18
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-and-filter-with-rotation.yaml36
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-corner-overlap-ref.yaml117
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-corner-overlap.yaml61
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-ellipse.pngbin0 -> 9542 bytes
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-ellipse.yaml110
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-empty-inner-rect-ref.yaml20
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-empty-inner-rect.yaml29
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-filter-raster-root-ref.yaml16
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-filter-raster-root.yaml27
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-mode.pngbin0 -> 2783 bytes
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-mode.yaml29
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-rectangle-redundant-sc-ref.yaml7
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-rectangle-redundant-sc.yaml20
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-thin-rotated-ref.yaml13
-rw-r--r--gfx/wr/wrench/reftests/clip/clip-thin-rotated.yaml41
-rw-r--r--gfx/wr/wrench/reftests/clip/clipped-occlusion-ref.yaml7
-rw-r--r--gfx/wr/wrench/reftests/clip/clipped-occlusion.yaml25
-rw-r--r--gfx/wr/wrench/reftests/clip/custom-clip-chain-node-ancestors-ref.yaml9
-rw-r--r--gfx/wr/wrench/reftests/clip/custom-clip-chain-node-ancestors.yaml31
-rw-r--r--gfx/wr/wrench/reftests/clip/fixed-position-clipping-ref.yaml15
-rw-r--r--gfx/wr/wrench/reftests/clip/fixed-position-clipping.yaml45
-rw-r--r--gfx/wr/wrench/reftests/clip/iframe-nested-in-stacking-context-ref.yaml6
-rw-r--r--gfx/wr/wrench/reftests/clip/iframe-nested-in-stacking-context.yaml27
-rw-r--r--gfx/wr/wrench/reftests/clip/raster-roots-tiled-mask-ref.yaml6
-rw-r--r--gfx/wr/wrench/reftests/clip/raster-roots-tiled-mask.yaml22
-rw-r--r--gfx/wr/wrench/reftests/clip/reftest.list20
-rw-r--r--gfx/wr/wrench/reftests/clip/segmentation-across-rotation-ref.yaml6
-rw-r--r--gfx/wr/wrench/reftests/clip/segmentation-across-rotation.yaml31
-rw-r--r--gfx/wr/wrench/reftests/clip/segmentation-with-other-coordinate-system-clip-ref.yaml8
-rw-r--r--gfx/wr/wrench/reftests/clip/segmentation-with-other-coordinate-system-clip.pngbin0 -> 763 bytes
-rw-r--r--gfx/wr/wrench/reftests/clip/segmentation-with-other-coordinate-system-clip.yaml48
-rw-r--r--gfx/wr/wrench/reftests/clip/snapping-ref.yaml17
-rw-r--r--gfx/wr/wrench/reftests/clip/snapping.yaml17
-rw-r--r--gfx/wr/wrench/reftests/clip/stacking-context-clip-ref.yaml37
-rw-r--r--gfx/wr/wrench/reftests/clip/stacking-context-clip.yaml43
45 files changed, 1090 insertions, 0 deletions
diff --git a/gfx/wr/wrench/reftests/clip/blank.yaml b/gfx/wr/wrench/reftests/clip/blank.yaml
new file mode 100644
index 0000000000..c4eb3ab673
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/blank.yaml
@@ -0,0 +1,2 @@
+---
+root:
diff --git a/gfx/wr/wrench/reftests/clip/blend-container-ref.yaml b/gfx/wr/wrench/reftests/clip/blend-container-ref.yaml
new file mode 100644
index 0000000000..2d3464959d
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/blend-container-ref.yaml
@@ -0,0 +1,6 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: [ 50, 50, 100, 100 ]
+ color: blue
diff --git a/gfx/wr/wrench/reftests/clip/blend-container.yaml b/gfx/wr/wrench/reftests/clip/blend-container.yaml
new file mode 100644
index 0000000000..5506f2d25b
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/blend-container.yaml
@@ -0,0 +1,19 @@
+# Verify that clip-chains are correctly applied to root level blend containers (which get
+# optimized to be tile caches).
+---
+root:
+ items:
+ - type: clip
+ id: 2
+ bounds: [ 50, 50, 100, 100 ]
+ -
+ type: "clip-chain"
+ id: 3
+ clips: [2]
+ - type: stacking-context
+ blend-container: true
+ clip-chain: 3
+ items:
+ - type: rect
+ bounds: [ 0, 0, 200, 200 ]
+ color: blue
diff --git a/gfx/wr/wrench/reftests/clip/border-with-rounded-clip.png b/gfx/wr/wrench/reftests/clip/border-with-rounded-clip.png
new file mode 100644
index 0000000000..120b21b6cc
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/border-with-rounded-clip.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/clip/border-with-rounded-clip.yaml b/gfx/wr/wrench/reftests/clip/border-with-rounded-clip.yaml
new file mode 100644
index 0000000000..a41f9aeea7
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/border-with-rounded-clip.yaml
@@ -0,0 +1,23 @@
+---
+root:
+ items:
+ -
+ clip-rect: [10, 10, 938, 200]
+ type: clip
+ id: 2
+ complex:
+ -
+ rect: [10, 10, 938, 200]
+ radius: [97, 97]
+ "clip-mode": clip
+ - type: clip-chain
+ id: 12
+ clips: [2]
+ -
+ bounds: [10, 10, 100, 200]
+ type: border
+ width: [100, 50, 100, 50]
+ border-type: normal
+ color: green
+ style: solid
+ clip-chain: 12
diff --git a/gfx/wr/wrench/reftests/clip/clip-3d-transform-ref.yaml b/gfx/wr/wrench/reftests/clip/clip-3d-transform-ref.yaml
new file mode 100644
index 0000000000..58d66bec5a
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-3d-transform-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ -
+ bounds: [0, 0, 200, 200]
+ "clip-rect": [0, 0, 200, 200]
+ type: rect
+ color: green
diff --git a/gfx/wr/wrench/reftests/clip/clip-3d-transform.yaml b/gfx/wr/wrench/reftests/clip/clip-3d-transform.yaml
new file mode 100644
index 0000000000..c40780ca22
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-3d-transform.yaml
@@ -0,0 +1,33 @@
+# This tests that clipping works well inside of a transformation with a 3d component that
+# is still axis-aligned and lacking a perspective component. These two spaces should exist
+# within a compatible coordinate system for local clipping (no masking).
+---
+root:
+ items:
+ -
+ bounds: [0, 0, 0, 0]
+ "clip-rect": [0, 0, 0, 0]
+ "backface-visible": true
+ type: "stacking-context"
+ "scroll-policy": scrollable
+ transform: [0.5, 0, -0.8660254, 0, 0, 1, 0, 0, 0.8660254, 0, 0.5, 0, 0, 0, 0, 1]
+ "transform-style": flat
+ filters: []
+ items:
+ -
+ bounds: [0, 0, 800, 400]
+ "clip-rect": [0, 0, 800, 400]
+ "backface-visible": true
+ type: clip
+ id: 2
+ "content-size": [800, 400]
+ - type: clip-chain
+ id: 3
+ clips: [2]
+ -
+ bounds: [0, 0, 400, 200]
+ "clip-rect": [0, 0, 400, 200]
+ "backface-visible": true
+ type: rect
+ clip-chain: 3
+ color: green
diff --git a/gfx/wr/wrench/reftests/clip/clip-45-degree-rotation-ref.png b/gfx/wr/wrench/reftests/clip/clip-45-degree-rotation-ref.png
new file mode 100644
index 0000000000..7b27e84239
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-45-degree-rotation-ref.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/clip/clip-45-degree-rotation.yaml b/gfx/wr/wrench/reftests/clip/clip-45-degree-rotation.yaml
new file mode 100644
index 0000000000..018a8a1d78
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-45-degree-rotation.yaml
@@ -0,0 +1,35 @@
+# Test that transformed content is clipped properly by clips with a different transform.
+---
+root:
+ items:
+ -
+ bounds: [0, 0, 0, 0]
+ "clip-rect": [0, 0, 0, 0]
+ type: "stacking-context"
+ transform: rotate(-45) translate(200, 0)
+ items:
+ -
+ bounds: [0, 0, 300, 300]
+ "clip-rect": [0, 0, 300, 300]
+ type: rect
+ color: red
+ -
+ bounds: [0, 0, 300, 300]
+ "clip-rect": [0, 0, 300, 300]
+ type: clip
+ id: 5
+ - type: clip-chain
+ id: 10
+ clips: [5]
+ -
+ bounds: [0, 0, 0, 0]
+ "clip-rect": [0, 0, 0, 0]
+ type: "stacking-context"
+ transform: rotate(45) translate(-300, 0)
+ clip-chain: 10
+ items:
+ -
+ bounds: [0, 0, 1598, 1200]
+ "clip-rect": [0, 0, 1598, 1200]
+ type: rect
+ color: green
diff --git a/gfx/wr/wrench/reftests/clip/clip-and-filter-with-rotation-ref.yaml b/gfx/wr/wrench/reftests/clip/clip-and-filter-with-rotation-ref.yaml
new file mode 100644
index 0000000000..c092030714
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-and-filter-with-rotation-ref.yaml
@@ -0,0 +1,18 @@
+# Test that filtered content is clipped properly in a rotated context
+---
+root:
+ items:
+ -
+ bounds: [16, 16, 0, 0]
+ type: "reference-frame"
+ transform: rotate(10)
+ id: 7
+ items:
+ -
+ bounds: [0, 0, 0, 0]
+ type: "stacking-context"
+ items:
+ -
+ bounds: [0, 0, 324, 295]
+ type: rect
+ color: red
diff --git a/gfx/wr/wrench/reftests/clip/clip-and-filter-with-rotation.yaml b/gfx/wr/wrench/reftests/clip/clip-and-filter-with-rotation.yaml
new file mode 100644
index 0000000000..dcd2668220
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-and-filter-with-rotation.yaml
@@ -0,0 +1,36 @@
+# Test that filtered content is clipped properly in a rotated context
+---
+root:
+ items:
+ -
+ bounds: [16, 16, 0, 0]
+ type: "reference-frame"
+ transform: rotate(10)
+ id: 7
+ items:
+ -
+ bounds: [0, 0, 0, 0]
+ type: "stacking-context"
+ items:
+ -
+ bounds: [0, 0, 324, 295]
+ type: clip
+ id: 2
+ -
+ type: "clip-chain"
+ id: 3
+ clips: [2]
+ -
+ bounds: [0, 0, 0, 0]
+ clip-chain: 3
+ type: "stacking-context"
+ filters: ["contrast(1.1)"] # any blend-style filter will do
+ items:
+ -
+ bounds: [-150, -150, 624, 624]
+ type: rect
+ color: blue
+ -
+ bounds: [-2, -2, 328, 299]
+ type: rect
+ color: red
diff --git a/gfx/wr/wrench/reftests/clip/clip-corner-overlap-ref.yaml b/gfx/wr/wrench/reftests/clip/clip-corner-overlap-ref.yaml
new file mode 100644
index 0000000000..9f395a9836
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-corner-overlap-ref.yaml
@@ -0,0 +1,117 @@
+---
+root:
+ items:
+ - type: stacking-context
+ bounds: [0, 0, 1000, 1000]
+ items:
+ - type: clip
+ id: 2
+ complex:
+ - rect: [ 50, 50, 200, 100 ]
+ radius:
+ top-left: [200, 100]
+ top-right: [0, 0]
+ bottom-left: [0, 0]
+ bottom-right: [0, 0]
+ - type: rect
+ bounds: [ 50, 50, 200, 100 ]
+ color: blue
+ clip-chain: [2]
+
+ - type: clip
+ id: 3
+ complex:
+ - rect: [ 50, 150, 200, 100 ]
+ radius:
+ top-left: [0, 0]
+ top-right: [0, 0]
+ bottom-left: [200, 100]
+ bottom-right: [0, 0]
+ - type: rect
+ bounds: [ 50, 150, 200, 100 ]
+ color: blue
+ clip-chain: [3]
+
+ - type: clip
+ id: 4
+ complex:
+ - rect: [ 300, 50, 100, 200 ]
+ radius:
+ top-left: [100, 200]
+ top-right: [0, 0]
+ bottom-left: [0, 0]
+ bottom-right: [0, 0]
+ - type: rect
+ bounds: [ 300, 50, 100, 200 ]
+ color: green
+ clip-chain: [4]
+
+ - type: clip
+ id: 5
+ complex:
+ - rect: [ 400, 50, 100, 200 ]
+ radius:
+ top-left: [0, 0]
+ top-right: [100, 200]
+ bottom-left: [0, 0]
+ bottom-right: [0, 0]
+ - type: rect
+ bounds: [ 400, 50, 100, 200 ]
+ color: green
+ clip-chain: [5]
+
+ - type: clip
+ id: 6
+ complex:
+ - rect: [ 50, 300, 200, 100 ]
+ radius:
+ top-left: [0, 0]
+ top-right: [200, 100]
+ bottom-left: [0, 0]
+ bottom-right: [0, 0]
+ - type: rect
+ bounds: [ 50, 300, 200, 100 ]
+ color: red
+ clip-chain: [6]
+
+ - type: clip
+ id: 7
+ complex:
+ - rect: [ 50, 400, 200, 100 ]
+ radius:
+ top-left: [0, 0]
+ top-right: [0, 0]
+ bottom-left: [0, 0]
+ bottom-right: [200, 100]
+ - type: rect
+ bounds: [ 50, 400, 200, 100 ]
+ color: red
+ clip-chain: [7]
+
+ - type: clip
+ id: 8
+ complex:
+ - rect: [ 300, 300, 100, 200 ]
+ radius:
+ top-left: [0, 0]
+ top-right: [0, 0]
+ bottom-left: [100, 200]
+ bottom-right: [0, 0]
+ - type: rect
+ bounds: [ 300, 300, 100, 200 ]
+ color: yellow
+ clip-chain: [8]
+
+ - type: clip
+ id: 9
+ complex:
+ - rect: [ 400, 300, 100, 200 ]
+ radius:
+ top-left: [0, 0]
+ top-right: [0, 0]
+ bottom-left: [0, 0]
+ bottom-right: [100, 200]
+ - type: rect
+ bounds: [ 400, 300, 100, 200 ]
+ color: yellow
+ clip-chain: [9]
diff --git a/gfx/wr/wrench/reftests/clip/clip-corner-overlap.yaml b/gfx/wr/wrench/reftests/clip/clip-corner-overlap.yaml
new file mode 100644
index 0000000000..46b562eba5
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-corner-overlap.yaml
@@ -0,0 +1,61 @@
+---
+root:
+ items:
+ - type: stacking-context
+ bounds: [0, 0, 1000, 1000]
+ items:
+ - type: clip
+ id: 2
+ complex:
+ - rect: [ 50, 50, 200, 200 ]
+ radius:
+ top-left: [200, 100]
+ top-right: [0, 0]
+ bottom-left: [200, 100]
+ bottom-right: [0, 0]
+ - type: rect
+ bounds: [ 50, 50, 200, 200 ]
+ color: blue
+ clip-chain: [2]
+
+ - type: clip
+ id: 3
+ complex:
+ - rect: [ 300, 50, 200, 200 ]
+ radius:
+ top-left: [100, 200]
+ top-right: [100, 200]
+ bottom-left: [0, 0]
+ bottom-right: [0, 0]
+ - type: rect
+ bounds: [ 300, 50, 200, 200 ]
+ color: green
+ clip-chain: [3]
+
+ - type: clip
+ id: 4
+ complex:
+ - rect: [ 50, 300, 200, 200 ]
+ radius:
+ top-left: [0, 0]
+ top-right: [200, 100]
+ bottom-left: [0, 0]
+ bottom-right: [200, 100]
+ - type: rect
+ bounds: [ 50, 300, 200, 200 ]
+ color: red
+ clip-chain: [4]
+
+ - type: clip
+ id: 5
+ complex:
+ - rect: [ 300, 300, 200, 200 ]
+ radius:
+ top-left: [0, 0]
+ top-right: [0, 0]
+ bottom-left: [100, 200]
+ bottom-right: [100, 200]
+ - type: rect
+ bounds: [ 300, 300, 200, 200 ]
+ color: yellow
+ clip-chain: [5]
diff --git a/gfx/wr/wrench/reftests/clip/clip-ellipse.png b/gfx/wr/wrench/reftests/clip/clip-ellipse.png
new file mode 100644
index 0000000000..49570d0359
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-ellipse.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/clip/clip-ellipse.yaml b/gfx/wr/wrench/reftests/clip/clip-ellipse.yaml
new file mode 100644
index 0000000000..846fefae89
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-ellipse.yaml
@@ -0,0 +1,110 @@
+---
+root:
+ items:
+ - type: clip
+ id: 100
+ complex:
+ - rect: [20, 20, 100, 100]
+ radius: [32, 16]
+ - type: clip-chain
+ id: 200
+ clips: [100]
+ - type: rect
+ bounds: [20, 20, 100, 100]
+ color: red
+ clip-chain: 200
+
+ - type: clip
+ id: 101
+ complex:
+ - rect: [130, 20, 100, 100]
+ radius: [32, 16]
+ clip-mode: clip-out
+ - type: clip-chain
+ id: 201
+ clips: [101]
+ - type: rect
+ bounds: [130, 20, 100, 100]
+ color: green
+ clip-chain: 201
+
+ - type: clip
+ id: 102
+ complex:
+ - rect: [20, 130, 100, 100]
+ radius: [16, 32]
+ - type: clip-chain
+ id: 202
+ clips: [102]
+ - type: rect
+ bounds: [20, 130, 100, 100]
+ color: red
+ clip-chain: 202
+
+ - type: clip
+ id: 103
+ complex:
+ - rect: [130, 130, 100, 100]
+ radius: [16, 32]
+ clip-mode: clip-out
+ - type: clip-chain
+ id: 203
+ clips: [103]
+ - type: rect
+ bounds: [130, 130, 100, 100]
+ color: green
+ clip-chain: 203
+
+ - type: clip
+ id: 104
+ complex:
+ - rect: [20, 240, 100, 100]
+ radius: [128, 32]
+ - type: clip-chain
+ id: 204
+ clips: [104]
+ - type: rect
+ bounds: [20, 240, 100, 100]
+ color: red
+ clip-chain: 204
+
+ - type: clip
+ id: 105
+ complex:
+ - rect: [130, 240, 100, 100]
+ radius: [128, 32]
+ clip-mode: clip-out
+ - type: clip-chain
+ id: 205
+ clips: [105]
+ - type: rect
+ bounds: [130, 240, 100, 100]
+ color: green
+ clip-chain: 205
+
+ - type: clip
+ id: 106
+ complex:
+ - rect: [20, 350, 100, 100]
+ radius: [32, 128]
+ - type: clip-chain
+ id: 206
+ clips: [106]
+ - type: rect
+ bounds: [20, 350, 100, 100]
+ color: red
+ clip-chain: 206
+
+ - type: clip
+ id: 107
+ complex:
+ - rect: [130, 350, 100, 100]
+ radius: [32, 128]
+ clip-mode: clip-out
+ - type: clip-chain
+ id: 207
+ clips: [107]
+ - type: rect
+ bounds: [130, 350, 100, 100]
+ color: green
+ clip-chain: 207
diff --git a/gfx/wr/wrench/reftests/clip/clip-empty-inner-rect-ref.yaml b/gfx/wr/wrench/reftests/clip/clip-empty-inner-rect-ref.yaml
new file mode 100644
index 0000000000..c41bcee382
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-empty-inner-rect-ref.yaml
@@ -0,0 +1,20 @@
+# In this case, the inner rectangle of the clip is empty, because
+# the size is 200 and each corner radius is 100.
+# The blue rect should be fully invisible
+---
+root:
+ items:
+ -
+ type: "stacking-context"
+ bounds: [0, 0, 0, 0]
+ items:
+ -
+ type: clip
+ id: 2
+ complex:
+ - rect: [ 0, 0, 200, 200 ]
+ radius: 100
+ - type: rect
+ bounds: [ 0, 0, 200, 200 ]
+ color: red
+ clip-chain: [2]
diff --git a/gfx/wr/wrench/reftests/clip/clip-empty-inner-rect.yaml b/gfx/wr/wrench/reftests/clip/clip-empty-inner-rect.yaml
new file mode 100644
index 0000000000..a57c816223
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-empty-inner-rect.yaml
@@ -0,0 +1,29 @@
+# In this case, the inner rectangle of the clip is empty, because
+# the size is 200 and each corner radius is 100.
+# The blue rect should be fully invisible
+---
+root:
+ items:
+ -
+ type: "stacking-context"
+ bounds: [0, 0, 0, 0]
+ items:
+ -
+ type: clip
+ id: 2
+ complex:
+ - rect: [ 0, 0, 200, 200 ]
+ radius: 100
+ - type: rect
+ bounds: [ 0, 0, 200, 200 ]
+ color: red
+ clip-chain: [2]
+ - type: "stacking-context"
+ bounds: [0, 0, 0, 0]
+ transform: translate(0, 0, 1)
+ items:
+ -
+ type: rect
+ bounds: [0, 0, 25, 25]
+ color: blue
+ clip-chain: [2]
diff --git a/gfx/wr/wrench/reftests/clip/clip-filter-raster-root-ref.yaml b/gfx/wr/wrench/reftests/clip/clip-filter-raster-root-ref.yaml
new file mode 100644
index 0000000000..7fde17f184
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-filter-raster-root-ref.yaml
@@ -0,0 +1,16 @@
+---
+root:
+ items:
+ -
+ type: "reference-frame"
+ transform: [perspective(10), rotate(45)]
+ transform-origin: 500 100
+ items:
+ -
+ type: "stacking-context"
+ filters: [identity]
+ items:
+ -
+ bounds: [100, 100, 200, 200]
+ type: rect
+ color: red
diff --git a/gfx/wr/wrench/reftests/clip/clip-filter-raster-root.yaml b/gfx/wr/wrench/reftests/clip/clip-filter-raster-root.yaml
new file mode 100644
index 0000000000..688b832016
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-filter-raster-root.yaml
@@ -0,0 +1,27 @@
+# Test that a local-space clip when applied to a surface (due to the filter) that is also
+# a raster root (due to the perspective) is correctly applied.
+---
+root:
+ items:
+ -
+ type: "reference-frame"
+ transform: [perspective(10), rotate(45)]
+ transform-origin: 500 100
+ items:
+ -
+ bounds: [100, 100, 200, 200]
+ type: clip
+ id: 2
+ -
+ type: "clip-chain"
+ id: 3
+ clips: [2]
+ -
+ clip-chain: 3
+ type: "stacking-context"
+ filters: [identity]
+ items:
+ -
+ bounds: [0, 0, 400, 400]
+ type: rect
+ color: red
diff --git a/gfx/wr/wrench/reftests/clip/clip-mode.png b/gfx/wr/wrench/reftests/clip/clip-mode.png
new file mode 100644
index 0000000000..e40a9db215
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-mode.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/clip/clip-mode.yaml b/gfx/wr/wrench/reftests/clip/clip-mode.yaml
new file mode 100644
index 0000000000..d20e53668f
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-mode.yaml
@@ -0,0 +1,29 @@
+---
+root:
+ items:
+ - type: clip
+ id: 2
+ complex:
+ - rect: [20, 20, 100, 100]
+ radius: 32
+ - type: clip-chain
+ id: 12
+ clips: [2]
+ - type: rect
+ bounds: [20, 20, 100, 100]
+ color: red
+ clip-chain: 12
+
+ - type: clip
+ id: 3
+ complex:
+ - rect: [130, 20, 100, 100]
+ radius: 32
+ clip-mode: clip-out
+ - type: clip-chain
+ id: 13
+ clips: [3]
+ - type: rect
+ bounds: [130, 20, 100, 100]
+ color: green
+ clip-chain: 13
diff --git a/gfx/wr/wrench/reftests/clip/clip-rectangle-redundant-sc-ref.yaml b/gfx/wr/wrench/reftests/clip/clip-rectangle-redundant-sc-ref.yaml
new file mode 100644
index 0000000000..5946aeedae
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-rectangle-redundant-sc-ref.yaml
@@ -0,0 +1,7 @@
+---
+root:
+ items:
+ -
+ bounds: [0, 0, 100, 100]
+ type: rect
+ color: blue
diff --git a/gfx/wr/wrench/reftests/clip/clip-rectangle-redundant-sc.yaml b/gfx/wr/wrench/reftests/clip/clip-rectangle-redundant-sc.yaml
new file mode 100644
index 0000000000..eb0493a81d
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-rectangle-redundant-sc.yaml
@@ -0,0 +1,20 @@
+# Test that rect clips on redundant stacking contexts are applied to child prims
+---
+root:
+ items:
+ -
+ bounds: [0, 0, 100, 100]
+ type: clip
+ id: 2
+ -
+ type: "clip-chain"
+ id: 3
+ clips: [2]
+ -
+ clip-chain: 3
+ type: "stacking-context"
+ items:
+ -
+ bounds: [0, 0, 200, 200]
+ type: rect
+ color: blue
diff --git a/gfx/wr/wrench/reftests/clip/clip-thin-rotated-ref.yaml b/gfx/wr/wrench/reftests/clip/clip-thin-rotated-ref.yaml
new file mode 100644
index 0000000000..e09079424d
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-thin-rotated-ref.yaml
@@ -0,0 +1,13 @@
+# Test checks if a rotated clip with a long and thin rectangle would still
+# correctly affect the primitive with regards to the inner bounds.
+---
+root:
+ items:
+ -
+ bounds: [0, 0, 0, 0]
+ type: "stacking-context"
+ items:
+ -
+ bounds: [100, 100, 14, 14]
+ type: rect
+ color: blue
diff --git a/gfx/wr/wrench/reftests/clip/clip-thin-rotated.yaml b/gfx/wr/wrench/reftests/clip/clip-thin-rotated.yaml
new file mode 100644
index 0000000000..d0e626af91
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clip-thin-rotated.yaml
@@ -0,0 +1,41 @@
+# Test checks if a rotated clip with a long and thin rectangle would still
+# correctly affect the primitive with regards to the inner bounds.
+---
+root:
+ items:
+ -
+ bounds: [0, 0, 0, 0]
+ type: "reference-frame"
+ id: 2
+ -
+ bounds: [0, 0, 0, 0]
+ type: "stacking-context"
+ transform: rotate(45) translate(200, 0)
+ items:
+ -
+ bounds: [0, 0, 20, 1000]
+ type: clip
+ id: 5
+ # uncomment this to see the clip area
+ #-
+ # bounds: [0, 0, 20, 1000]
+ # type: rect
+ # color: green
+ - # we aren't supposed to see this one
+ bounds: [0, 0, 0, 0]
+ type: "stacking-context"
+ clip-and-scroll: [2, 5]
+ items:
+ -
+ bounds: [120, 120, 10, 10]
+ type: rect
+ color: red
+ -
+ bounds: [0, 0, 0, 0]
+ type: "stacking-context"
+ clip-and-scroll: [2, 5]
+ items:
+ -
+ bounds: [100, 100, 14, 14]
+ type: rect
+ color: blue
diff --git a/gfx/wr/wrench/reftests/clip/clipped-occlusion-ref.yaml b/gfx/wr/wrench/reftests/clip/clipped-occlusion-ref.yaml
new file mode 100644
index 0000000000..69a5fb0624
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clipped-occlusion-ref.yaml
@@ -0,0 +1,7 @@
+---
+root:
+ items:
+ -
+ type: rect
+ bounds: [0, 0, 500, 500]
+ color: red
diff --git a/gfx/wr/wrench/reftests/clip/clipped-occlusion.yaml b/gfx/wr/wrench/reftests/clip/clipped-occlusion.yaml
new file mode 100644
index 0000000000..8f47d2837e
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/clipped-occlusion.yaml
@@ -0,0 +1,25 @@
+# This is a regression test for https://bugzilla.mozilla.org/show_bug.cgi?id=1594567
+# The single clip node from the primitive inside the scroll frame will be promoted
+# to a 'shared clip' in the picture cache for the scroll frame. Ensure that this clip
+# (zero sized in this test) is included in the tile occlusion culling.
+---
+root:
+ items:
+ -
+ type: rect
+ bounds: [0, 0, 500, 500]
+ color: red
+ -
+ type: scroll-frame
+ content-size: [1000, 10000]
+ bounds: [0, -5000, 1000, 10000]
+ items:
+ - type: clip
+ id: 2
+ bounds: [0, 0, 0, 0]
+ -
+ bounds: [0, -5000, 1000, 10000]
+ type: rect
+ color: green
+ clip-chain: [2]
+ \ No newline at end of file
diff --git a/gfx/wr/wrench/reftests/clip/custom-clip-chain-node-ancestors-ref.yaml b/gfx/wr/wrench/reftests/clip/custom-clip-chain-node-ancestors-ref.yaml
new file mode 100644
index 0000000000..c84fe7a612
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/custom-clip-chain-node-ancestors-ref.yaml
@@ -0,0 +1,9 @@
+---
+root:
+ items:
+ -
+ bounds: [10, 10, 100, 100]
+ "clip-rect": [10, 10, 100, 100]
+ "backface-visible": true
+ type: rect
+ color: 0 255 0 1
diff --git a/gfx/wr/wrench/reftests/clip/custom-clip-chain-node-ancestors.yaml b/gfx/wr/wrench/reftests/clip/custom-clip-chain-node-ancestors.yaml
new file mode 100644
index 0000000000..e2cf3c9177
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/custom-clip-chain-node-ancestors.yaml
@@ -0,0 +1,31 @@
+# This test ensures that custom clip chains are not affected by the ancestors
+# of their clipping nodes. In this case the node, 3, will probably be optimized
+# away since its ancestor 2 has a tighter bounding rect. On the other hand, a
+# clip chain which includes 3 should only get the rectangle specified by that
+# node and not be affected by 2 at all.
+---
+root:
+ items:
+ -
+ bounds: [25, 25, 50, 50]
+ "clip-rect": [25, 25, 50, 50]
+ type: clip
+ id: 2
+ -
+ bounds: [10, 10, 100, 100]
+ clip-rect: [10, 10, 100, 100]
+ type: clip
+ id: 3
+ "content-size": [800, 1000]
+ -
+ bounds: [0, 0, 0, 0]
+ clip-rect: [0, 0, 0, 0]
+ type: "clip-chain"
+ id: 10
+ clips: [3]
+ -
+ bounds: [0, 0, 200, 200]
+ clip-rect: [0, 0, 200, 200]
+ clip-chain: 10
+ type: rect
+ color: 0 255 0 1
diff --git a/gfx/wr/wrench/reftests/clip/fixed-position-clipping-ref.yaml b/gfx/wr/wrench/reftests/clip/fixed-position-clipping-ref.yaml
new file mode 100644
index 0000000000..abbc91f897
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/fixed-position-clipping-ref.yaml
@@ -0,0 +1,15 @@
+---
+root:
+ items:
+ -
+ bounds: [10, 10, 100, 100]
+ clip-rect: [10, 10, 100, 100]
+ type: rect
+ color: 0 255 0 1.0
+ -
+ bounds: [110, 10, 100, 100]
+ clip-rect: [110, 10, 100, 100]
+ type: rect
+ color: 0 255 0 1.0
+ id: [0, 1]
+pipelines: []
diff --git a/gfx/wr/wrench/reftests/clip/fixed-position-clipping.yaml b/gfx/wr/wrench/reftests/clip/fixed-position-clipping.yaml
new file mode 100644
index 0000000000..e6e27ea857
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/fixed-position-clipping.yaml
@@ -0,0 +1,45 @@
+# This test ensures that children of fixed position stacking contexts are not
+# clipped by parent clipping nodes. The contents of the fixed position stacking
+# contexts below should not be clipped by their parent clipping nodes, but
+# instead should be promoted to be children of the top-level reference frame.
+---
+root:
+ items:
+ -
+ clip-rect: [15, 15, 30, 30]
+ type: scroll-frame
+ content-size: [60, 60]
+ bounds: [15, 15, 30, 30]
+ items:
+ -
+ bounds: [10, 10, 100, 100]
+ clip-rect: [10, 10, 100, 100]
+ type: stacking-context
+ items:
+ -
+ bounds: [0, 0, 100, 100]
+ clip-rect: [0, 0, 100, 100]
+ type: rect
+ color: 0 255 0 1.0
+ # The same test as above, except this time the stacking context also starts its
+ # own reference frame.
+ -
+ clip-rect: [115, 15, 30, 30]
+ type: scroll-frame
+ content-size: [60, 60]
+ bounds: [115, 15, 30, 30]
+ items:
+ -
+ bounds: [110, 10, 100, 100]
+ clip-rect: [110, 10, 100, 100]
+ id: 4
+ type: stacking-context
+ transform: [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1]
+ items:
+ -
+ bounds: [0, 0, 100, 100]
+ clip-rect: [0, 0, 100, 100]
+ type: rect
+ color: 0 255 0 1.0
+ id: [0, 1]
+pipelines: []
diff --git a/gfx/wr/wrench/reftests/clip/iframe-nested-in-stacking-context-ref.yaml b/gfx/wr/wrench/reftests/clip/iframe-nested-in-stacking-context-ref.yaml
new file mode 100644
index 0000000000..c8f3148ea5
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/iframe-nested-in-stacking-context-ref.yaml
@@ -0,0 +1,6 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: [50, 50, 50, 100]
+ color: red
diff --git a/gfx/wr/wrench/reftests/clip/iframe-nested-in-stacking-context.yaml b/gfx/wr/wrench/reftests/clip/iframe-nested-in-stacking-context.yaml
new file mode 100644
index 0000000000..7c1dd4336b
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/iframe-nested-in-stacking-context.yaml
@@ -0,0 +1,27 @@
+# Ensure that a stacking context with a simple clip that encloses
+# an iframe correctly propagates the stacking context clip to the
+# clip on the iframe.
+---
+root:
+ items:
+ - type: clip
+ id: 2
+ bounds: [50, 50, 50, 100]
+ -
+ type: "clip-chain"
+ id: 3
+ clips: [2]
+ - type: stacking-context
+ bounds: [50, 50, 100, 100]
+ clip-chain: 3
+ items:
+ - type: iframe
+ id: [1, 3]
+ bounds: [0, 0, 100, 100]
+pipelines:
+ -
+ id: [1, 3]
+ items:
+ - type: rect
+ color: red
+ bounds: [0, 0, 100, 100]
diff --git a/gfx/wr/wrench/reftests/clip/raster-roots-tiled-mask-ref.yaml b/gfx/wr/wrench/reftests/clip/raster-roots-tiled-mask-ref.yaml
new file mode 100644
index 0000000000..6fdde50513
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/raster-roots-tiled-mask-ref.yaml
@@ -0,0 +1,6 @@
+---
+root:
+ items:
+ - type: rect
+ bounds: [0, 0, 8, 128]
+ color: [255, 0, 0, 0.5]
diff --git a/gfx/wr/wrench/reftests/clip/raster-roots-tiled-mask.yaml b/gfx/wr/wrench/reftests/clip/raster-roots-tiled-mask.yaml
new file mode 100644
index 0000000000..b7f513719b
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/raster-roots-tiled-mask.yaml
@@ -0,0 +1,22 @@
+# Verify that tiled image clip masks are correctly positioned when the
+# underlying surface has established a raster root
+---
+root:
+ items:
+ - type: scroll-frame
+ bounds: [0, 0, 8, 1024]
+ content-size: [8, 2048]
+ scroll-offset: [0, 1024]
+ items:
+ - type: clip
+ id: 2
+ image-mask:
+ image: solid-color(128,0,0,0,8,1024)
+ rect: [0, 0, 8, 2048]
+ repeat: false
+ - type: stacking-context
+ clip-chain: [2]
+ items:
+ - type: rect
+ bounds: [0, 1024, 8, 128]
+ color: red
diff --git a/gfx/wr/wrench/reftests/clip/reftest.list b/gfx/wr/wrench/reftests/clip/reftest.list
new file mode 100644
index 0000000000..2284c12cda
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/reftest.list
@@ -0,0 +1,20 @@
+ platform(linux,mac) == border-with-rounded-clip.yaml border-with-rounded-clip.png
+fuzzy-if(platform(swgl),1,4) == clip-mode.yaml clip-mode.png
+fuzzy-if(platform(swgl),1,80) == clip-ellipse.yaml clip-ellipse.png
+platform(linux,mac) == clip-45-degree-rotation.yaml clip-45-degree-rotation-ref.png
+== clip-3d-transform.yaml clip-3d-transform-ref.yaml
+fuzzy(1,4) == clip-corner-overlap.yaml clip-corner-overlap-ref.yaml
+== custom-clip-chain-node-ancestors.yaml custom-clip-chain-node-ancestors-ref.yaml
+== fixed-position-clipping.yaml fixed-position-clipping-ref.yaml
+platform(linux,mac) == segmentation-with-other-coordinate-system-clip.yaml segmentation-with-other-coordinate-system-clip.png
+== segmentation-across-rotation.yaml segmentation-across-rotation-ref.yaml
+skip_on(android,device) fuzzy(1,2) == color_targets(3) alpha_targets(1) stacking-context-clip.yaml stacking-context-clip-ref.yaml
+== snapping.yaml snapping-ref.yaml
+fuzzy(160,1055) == clip-and-filter-with-rotation.yaml clip-and-filter-with-rotation-ref.yaml
+== clipped-occlusion.yaml clipped-occlusion-ref.yaml
+== clip-empty-inner-rect.yaml clip-empty-inner-rect-ref.yaml
+== iframe-nested-in-stacking-context.yaml iframe-nested-in-stacking-context-ref.yaml
+== clip-rectangle-redundant-sc.yaml clip-rectangle-redundant-sc-ref.yaml
+fuzzy(128,707) == clip-filter-raster-root.yaml clip-filter-raster-root-ref.yaml
+== blend-container.yaml blend-container-ref.yaml
+== raster-roots-tiled-mask.yaml raster-roots-tiled-mask-ref.yaml
diff --git a/gfx/wr/wrench/reftests/clip/segmentation-across-rotation-ref.yaml b/gfx/wr/wrench/reftests/clip/segmentation-across-rotation-ref.yaml
new file mode 100644
index 0000000000..6d14bab91c
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/segmentation-across-rotation-ref.yaml
@@ -0,0 +1,6 @@
+---
+root:
+ items:
+ - type: rect
+ color: [0, 255, 0, 1]
+ bounds: [100, 100, 100, 100]
diff --git a/gfx/wr/wrench/reftests/clip/segmentation-across-rotation.yaml b/gfx/wr/wrench/reftests/clip/segmentation-across-rotation.yaml
new file mode 100644
index 0000000000..6d9ea31708
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/segmentation-across-rotation.yaml
@@ -0,0 +1,31 @@
+# This test ensures that a clip that is segmented, with segments
+# that have no intersection with the world-space outer bounds of
+# the clip rectangle render correctly. In this case the first clip
+# defines the outer bounds of the clip rectangle and the rotation
+# ensures that the inner clip isn't optimized away completely. The
+# segments of the rounded corner clip don't have any intersection at
+# all with the clip in area from the outer clip, so they shouldn't
+# affect the rendering of the green square.
+---
+root:
+ items:
+ - type: clip
+ bounds: [100, 100, 100, 100]
+ id: 2
+ -
+ type: stacking-context
+ transform: rotate(0.25)
+ items:
+ - type: clip
+ id: 3
+ complex:
+ - rect: [ 0, 0, 2400, 900 ]
+ radius: 50
+ - type: clip-chain
+ id: 4
+ clips: [2, 3]
+ - type: rect
+ color: [0, 255, 0, 1]
+ bounds: [0, 0, 2400, 900]
+ clip-chain: 4
+
diff --git a/gfx/wr/wrench/reftests/clip/segmentation-with-other-coordinate-system-clip-ref.yaml b/gfx/wr/wrench/reftests/clip/segmentation-with-other-coordinate-system-clip-ref.yaml
new file mode 100644
index 0000000000..8627d2ed74
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/segmentation-with-other-coordinate-system-clip-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+ items:
+ -
+ type: rect
+ color: green
+ bounds: [0, 0, 100, 100]
+ "clip-rect": [0, 0, 100, 100]
diff --git a/gfx/wr/wrench/reftests/clip/segmentation-with-other-coordinate-system-clip.png b/gfx/wr/wrench/reftests/clip/segmentation-with-other-coordinate-system-clip.png
new file mode 100644
index 0000000000..67507a2573
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/segmentation-with-other-coordinate-system-clip.png
Binary files differ
diff --git a/gfx/wr/wrench/reftests/clip/segmentation-with-other-coordinate-system-clip.yaml b/gfx/wr/wrench/reftests/clip/segmentation-with-other-coordinate-system-clip.yaml
new file mode 100644
index 0000000000..9cf73988a8
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/segmentation-with-other-coordinate-system-clip.yaml
@@ -0,0 +1,48 @@
+# This is testing whether a clip properly clips a primitive in another
+# coordinate system that is segmented.
+# See https://github.com/servo/webrender/issues/2294
+---
+root:
+ items:
+ -
+ type: "stacking-context"
+ items:
+ -
+ id: 2
+ bounds: [0, 0, 100, 100]
+ "clip-rect": [0, 0, 100, 100]
+ type: clip
+ -
+ type: "stacking-context"
+ transform: [0.98883086, 0.14904226, 0, 0, -0.14904226, 0.98883086, 0, 0, 0, 0, 1, 0, 1533.3134, 109.21605, 0, 1]
+ items:
+ -
+ type: "stacking-context"
+ transform: [0.7818315, 0.6234898, 0, 0, -0.6234898, 0.7818315, 0, 0, 0, 0, 1, 0, 132.98201, -64.04077, 0, 1]
+ items:
+ -
+ type: "stacking-context"
+ transform: [0.93087375, 0.36534107, 0, 0, -0.36534107, 0.93087375, 0, 0, 0, 0, 1, 0, 68.64584, -46.80194, 0, 1]
+ items:
+ -
+ type: "stacking-context"
+ transform: [0.8262389, 0.56332004, 0, 0, -0.56332004, 0.8262389, 0, 0, 0, 0, 1, 0, 116.458824, -61.550323, 0, 1]
+ items:
+ -
+ type: "stacking-context"
+ transform: [0.90096885, 0.43388373, 0, 0, -0.43388373, 0.90096885, 0, 0, 0, 0, 1, 0, 84.200554, -52.906708, 0, 1]
+ items:
+ -
+ type: "stacking-context"
+ transform: [0.98883086, 0.14904226, 0, 0, -0.14904226, 0.98883086, 0, 0, 0, 0, 1, 0, 25.3134, -21.78395, 0, 1]
+ items:
+ -
+ type: "stacking-context"
+ transform: [0.73305184, 0.68017274, 0, 0, -0.68017274, 0.73305184, 0, 0, 0, 0, 1, 0, 149.64511, -65.28949, 0, 1]
+ items:
+ -
+ bounds: [1000, 0, 1000, 1000]
+ "clip-rect": [1000, 0, 1000, 1000]
+ type: rect
+ color: green
+ clip-chain: [2]
diff --git a/gfx/wr/wrench/reftests/clip/snapping-ref.yaml b/gfx/wr/wrench/reftests/clip/snapping-ref.yaml
new file mode 100644
index 0000000000..003f7b3e6f
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/snapping-ref.yaml
@@ -0,0 +1,17 @@
+---
+root:
+ items:
+ - type: clip
+ id: 2
+ complex:
+ - rect: [50, 50, 100, 100]
+ radius: 16
+ - type: rect
+ bounds: 50 50 100 100
+ color: red
+ clip-chain: [2]
+
+ - type: rect
+ bounds: 200 50 100 100
+ color: green
+
diff --git a/gfx/wr/wrench/reftests/clip/snapping.yaml b/gfx/wr/wrench/reftests/clip/snapping.yaml
new file mode 100644
index 0000000000..0658885a2e
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/snapping.yaml
@@ -0,0 +1,17 @@
+---
+root:
+ items:
+ - type: clip
+ id: 2
+ complex:
+ - rect: [50.3, 50.3, 100, 100]
+ radius: 16
+ - type: rect
+ bounds: 50.3 50.3 100 100
+ color: red
+ clip-chain: [2]
+
+ - type: rect
+ bounds: 200.3 50.3 100 100
+ color: green
+
diff --git a/gfx/wr/wrench/reftests/clip/stacking-context-clip-ref.yaml b/gfx/wr/wrench/reftests/clip/stacking-context-clip-ref.yaml
new file mode 100644
index 0000000000..412309ccda
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/stacking-context-clip-ref.yaml
@@ -0,0 +1,37 @@
+---
+root:
+ items:
+ - type: clip
+ id: 2
+ complex:
+ - rect: [0, 0, 100, 100]
+ radius: {
+ top-left: 50,
+ top-right: 50,
+ bottom-left: 50,
+ bottom-right: 50,
+ }
+ - type: clip-chain
+ id: 12
+ clips: [2]
+ - type: stacking-context
+ bounds: [0, 0, 100, 100]
+ items:
+ - type: rect
+ bounds: [ 0, 0, 100, 100 ]
+ color: [0, 255, 0]
+ clip-chain: 12
+ - type: clip
+ id: 3
+ bounds: [120, 0, 50, 50]
+ - type: clip-chain
+ id: 13
+ clips: [3]
+ - type: stacking-context
+ bounds: [100, 0, 100, 100]
+ filters: hue-rotate(90)
+ items:
+ - type: rect
+ bounds: [ 0, 0, 100, 100 ]
+ color: [0, 255, 0]
+ clip-chain: 13
diff --git a/gfx/wr/wrench/reftests/clip/stacking-context-clip.yaml b/gfx/wr/wrench/reftests/clip/stacking-context-clip.yaml
new file mode 100644
index 0000000000..e4a9618204
--- /dev/null
+++ b/gfx/wr/wrench/reftests/clip/stacking-context-clip.yaml
@@ -0,0 +1,43 @@
+---
+root:
+ items:
+ - type: clip
+ id: 2
+ complex:
+ - rect: [0, 0, 100, 100]
+ radius: {
+ top-left: 50,
+ top-right: 50,
+ bottom-left: 50,
+ bottom-right: 50,
+ }
+ -
+ type: "clip-chain"
+ id: 4
+ clips: [2]
+ - type: stacking-context
+ bounds: [0, 0, 100, 100]
+ clip-chain: 4
+ items:
+ - type: rect
+ bounds: [ 0, 0, 100, 100 ]
+ color: [0, 255, 0]
+ # The same test, but this time with hue rotation, which means that the stacking
+ # context is rendered to an intermediate surface first. Unfortunately, we cannot
+ # use a rounded clip here because we want to avoid subpixel differences and avoid
+ # relying on a PNG reference image.
+ - type: clip
+ id: 3
+ bounds: [120, 0, 50, 50]
+ -
+ type: "clip-chain"
+ id: 5
+ clips: [3]
+ - type: stacking-context
+ bounds: [100, 0, 100, 100]
+ filters: hue-rotate(90)
+ clip-chain: 5
+ items:
+ - type: rect
+ bounds: [ 0, 0, 100, 100 ]
+ color: [0, 255, 0]