Adding upstream version 86.0.1.upstream/86.0.1upstream

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>

34 files changed, 475 insertions, 0 deletions

diff --git a/gfx/wr/wrench/reftests/blend/blank.yaml b/gfx/wr/wrench/reftests/blend/blank.yaml
new file mode 100644
index 0000000000..c4eb3ab673
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/blank.yaml
@@ -0,0 +1,2 @@
+---
+root:
diff --git a/gfx/wr/wrench/reftests/blend/darken-ref.yaml b/gfx/wr/wrench/reftests/blend/darken-ref.yaml
new file mode 100644
index 0000000000..a83cf68244
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/darken-ref.yaml
@@ -0,0 +1,6 @@
+---
+root:
+  items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [10, 20, 10]
diff --git a/gfx/wr/wrench/reftests/blend/darken.yaml b/gfx/wr/wrench/reftests/blend/darken.yaml
new file mode 100644
index 0000000000..2de68d8724
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/darken.yaml
@@ -0,0 +1,16 @@
+---
+root:
+  items:
+    - type: stacking-context
+      blend-container: true
+      items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [10, 20, 30]
+        - type: stacking-context
+          bounds: [0, 0, 100, 100]
+          mix-blend-mode: darken
+          items:
+            - type: rect
+              bounds: [0, 0, 100, 100]
+              color: [30, 20, 10]
diff --git a/gfx/wr/wrench/reftests/blend/difference-ref.yaml b/gfx/wr/wrench/reftests/blend/difference-ref.yaml
new file mode 100644
index 0000000000..b913384f24
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/difference-ref.yaml
@@ -0,0 +1,6 @@
+---
+root:
+  items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [0, 0, 0]
diff --git a/gfx/wr/wrench/reftests/blend/difference-transparent-ref.yaml b/gfx/wr/wrench/reftests/blend/difference-transparent-ref.yaml
new file mode 100644
index 0000000000..8ed801fb15
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/difference-transparent-ref.yaml
@@ -0,0 +1,23 @@
+---
+root:
+  items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+
+          # First blend black rect with green in place
+          #  Cs = (1 - αb) x Cs + αb x B(Cb, Cs)
+          #  B(Cb, Cs) = | Cb - Cs | = (0, 0, 0)
+          #  0.5 * (0, 255, 0) + 0.5 * (0, 0, 0) = (0, 127.5, 0)
+          #
+          #  Now, composite the resulting color with src-over; the alpha is the original alpha for the top layer
+          #  while the color is the blending result
+          #  co = αs x Fa x Cs + αb x Fb x Cb  - this is premultiplied 
+          #  αo = αs + αb x (1 – αs) 
+          #  Source over:     Fa = 1; Fb = 1 – αs 
+          # co = 0.5 * 1 * (0, 127.5, 0) + 0.5 * 0.5 * (0, 255, 0) = (0, 63.5, 0) + 0.25 * (0, 255, 0) = (0, 127.5, 0)
+          # ao = 0.5 + 0.5 * 0.5 = 0.75
+          #  Co = co/ao = (0, 127.5, 0) / 0.75
+          #
+          #  Now alpha composite on white background
+          # co = 0.75 * 1 * (0, 127.5, 0) / 0.75 + 1 * 0.25 * (255, 255, 255) = (0, 127.5, 0) + (63.75, 63.75, 63.75) = (63.75, 159, 63.75) = (64, 191, 64) 
+          color: [64, 191, 64]
diff --git a/gfx/wr/wrench/reftests/blend/difference-transparent.yaml b/gfx/wr/wrench/reftests/blend/difference-transparent.yaml
new file mode 100644
index 0000000000..bd828d454a
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/difference-transparent.yaml
@@ -0,0 +1,22 @@
+---
+root:
+  items:
+    - type: rect
+      bounds: [0, 0, 100, 100]
+      color: white
+    # this stacking context should create an isolated group for its children
+    # causing the yellow rect to not blend with the green backdrop
+    - type: stacking-context
+      blend-container: true
+      bounds: [0, 0, 100, 100]
+      items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [0, 255, 0, 0.5]
+        - type: stacking-context
+          bounds: [0, 0, 100, 100]
+          mix-blend-mode: difference
+          items:
+            - type: rect
+              bounds: [0, 0, 100, 100]
+              color: [0, 255, 0, 0.5]
diff --git a/gfx/wr/wrench/reftests/blend/difference.yaml b/gfx/wr/wrench/reftests/blend/difference.yaml
new file mode 100644
index 0000000000..0c8d0fcd02
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/difference.yaml
@@ -0,0 +1,16 @@
+---
+root:
+  items:
+    - type: stacking-context
+      blend-container: true
+      items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: green
+        - type: stacking-context
+          bounds: [0, 0, 100, 100]
+          mix-blend-mode: difference
+          items:
+            - type: rect
+              bounds: [0, 0, 100, 100]
+              color: green
diff --git a/gfx/wr/wrench/reftests/blend/isolated-2-ref.yaml b/gfx/wr/wrench/reftests/blend/isolated-2-ref.yaml
new file mode 100644
index 0000000000..3226b6edda
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/isolated-2-ref.yaml
@@ -0,0 +1,21 @@
+---
+root:
+  items:
+    - type: rect
+      bounds: [10, 10, 130, 130]
+      color: [255, 255, 0]
+    - type: stacking-context
+      bounds: [10, 10, 130, 130]
+      items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [0, 255, 0]
+        - type: stacking-context
+          bounds: [20, 20, 100, 100]
+          items:
+            - type: rect
+              bounds: [0, 0, 100, 100]
+              color: [255, 0, 0]
+            - type: rect
+              bounds: [0, 0, 80, 80]
+              color: [0, 0, 0]
diff --git a/gfx/wr/wrench/reftests/blend/isolated-2.yaml b/gfx/wr/wrench/reftests/blend/isolated-2.yaml
new file mode 100644
index 0000000000..87bbac3caa
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/isolated-2.yaml
@@ -0,0 +1,25 @@
+# translation of wpt/css-tests/compositing-1_dev/html/mix-blend-mode-stacking-context-creates-isolation.htm
+---
+root:
+  items:
+    - type: rect
+      bounds: [10, 10, 130, 130]
+      color: [255, 255, 0]
+      # this stacking context should create an isolated group for its children
+      # inside there should be overlapping red and green rects
+      # where they intersect should be a black rect
+      # the rects should not blend with the yellow backdrop
+    - type: stacking-context
+      blend-container: true
+      bounds: [10, 10, 130, 130]
+      items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [0, 255, 0]
+        - type: stacking-context
+          bounds: [20, 20, 100, 100]
+          mix-blend-mode: multiply
+          items:
+            - type: rect
+              bounds: [0, 0, 100, 100]
+              color: [255, 0, 0]
diff --git a/gfx/wr/wrench/reftests/blend/isolated-premultiplied-2-ref.yaml b/gfx/wr/wrench/reftests/blend/isolated-premultiplied-2-ref.yaml
new file mode 100644
index 0000000000..f5de6dc33d
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/isolated-premultiplied-2-ref.yaml
@@ -0,0 +1,6 @@
+---
+root:
+  items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [229, 239, 229]
diff --git a/gfx/wr/wrench/reftests/blend/isolated-premultiplied-2.yaml b/gfx/wr/wrench/reftests/blend/isolated-premultiplied-2.yaml
new file mode 100644
index 0000000000..4ad5737d8c
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/isolated-premultiplied-2.yaml
@@ -0,0 +1,13 @@
+---
+root:
+  items:
+    - type: stacking-context
+      bounds: [0, 0, 100, 100]
+      items:
+        - type: stacking-context
+          bounds: [0, 0, 100, 100]
+          mix-blend-mode: lighten
+          items:
+          - type: rect
+            bounds: [0, 0, 100, 100]
+            color: [0, 100, 0, 0.1]
diff --git a/gfx/wr/wrench/reftests/blend/isolated-premultiplied.yaml b/gfx/wr/wrench/reftests/blend/isolated-premultiplied.yaml
new file mode 100644
index 0000000000..a8d738a389
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/isolated-premultiplied.yaml
@@ -0,0 +1,24 @@
+---
+root:
+  items:
+    - type: stacking-context
+      bounds: [0, 0, 100, 100]
+      items:
+          # this stacking context should force its parent to be an isolated group
+          # we don't want it to actually draw anything so just make it draw a white rect
+        - type: stacking-context
+          bounds: [0, 0, 100, 100]
+          mix-blend-mode: lighten
+          items:
+          - type: rect
+            bounds: [500, 500, 100, 100]
+            color: [255, 255, 255]
+
+          # transparent white, should be invisible
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [255, 255, 255, 0.5]
+          # transparent white, should be invisible
+        - type: image
+          bounds: [200, 0, 100, 100]
+          src: "transparent-white.png"
diff --git a/gfx/wr/wrench/reftests/blend/isolated-ref.yaml b/gfx/wr/wrench/reftests/blend/isolated-ref.yaml
new file mode 100644
index 0000000000..0f9061997a
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/isolated-ref.yaml
@@ -0,0 +1,6 @@
+---
+root:
+  items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [255, 255, 0]
diff --git a/gfx/wr/wrench/reftests/blend/isolated-with-filter.yaml b/gfx/wr/wrench/reftests/blend/isolated-with-filter.yaml
new file mode 100644
index 0000000000..483d802cc3
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/isolated-with-filter.yaml
@@ -0,0 +1,18 @@
+---
+root:
+  items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [255, 0, 0]
+          # the presence of this filter shouldn't break isolated groups
+        - type: stacking-context
+          bounds: [0, 0, 100, 100]
+          filters: opacity(1.0)
+          items:
+            - type: stacking-context
+              bounds: [0, 0, 100, 100]
+              mix-blend-mode: difference
+              items:
+                - type: rect
+                  bounds: [0, 0, 100, 100]
+                  color: [255, 255, 0]
diff --git a/gfx/wr/wrench/reftests/blend/isolated.yaml b/gfx/wr/wrench/reftests/blend/isolated.yaml
new file mode 100644
index 0000000000..456adba4b9
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/isolated.yaml
@@ -0,0 +1,18 @@
+---
+root:
+  items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [255, 0, 0]
+        # this stacking context should create an isolated group for its children
+        # causing the yellow rect to not blend with the green backdrop
+        - type: stacking-context
+          bounds: [0, 0, 100, 100]
+          items:
+            - type: stacking-context
+              bounds: [0, 0, 100, 100]
+              mix-blend-mode: difference
+              items:
+                - type: rect
+                  bounds: [0, 0, 100, 100]
+                  color: [255, 255, 0]
diff --git a/gfx/wr/wrench/reftests/blend/large-ref.yaml b/gfx/wr/wrench/reftests/blend/large-ref.yaml
new file mode 100644
index 0000000000..c7e8433414
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/large-ref.yaml
@@ -0,0 +1,9 @@
+---
+root:
+  items:
+    - type: stacking-context
+      bounds: 0 0 2000 2000
+      items:
+        - type: rect
+          bounds: 0 0 2000 2000
+          color: [0, 128, 0, 1]
diff --git a/gfx/wr/wrench/reftests/blend/large.yaml b/gfx/wr/wrench/reftests/blend/large.yaml
new file mode 100644
index 0000000000..8167265236
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/large.yaml
@@ -0,0 +1,13 @@
+---
+root:
+  items:
+    - type: stacking-context
+      bounds: 0 0 2000 2000
+      items:
+        - type: stacking-context
+          bounds: 0 0 2000 2000
+          mix-blend-mode: screen
+          items:
+            - type: rect
+              bounds: 0 0 2000 2000
+              color: [0, 128, 0, 1]
diff --git a/gfx/wr/wrench/reftests/blend/lighten-ref.yaml b/gfx/wr/wrench/reftests/blend/lighten-ref.yaml
new file mode 100644
index 0000000000..5720f140a6
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/lighten-ref.yaml
@@ -0,0 +1,6 @@
+---
+root:
+  items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [30, 20, 30]
diff --git a/gfx/wr/wrench/reftests/blend/lighten.yaml b/gfx/wr/wrench/reftests/blend/lighten.yaml
new file mode 100644
index 0000000000..426e2323b9
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/lighten.yaml
@@ -0,0 +1,16 @@
+---
+root:
+  items:
+    - type: stacking-context
+      blend-container: true
+      items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [10, 20, 30]
+        - type: stacking-context
+          bounds: [0, 0, 100, 100]
+          mix-blend-mode: lighten
+          items:
+            - type: rect
+              bounds: [0, 0, 100, 100]
+              color: [30, 20, 10]
diff --git a/gfx/wr/wrench/reftests/blend/multi-mix-blend-mode-ref.yaml b/gfx/wr/wrench/reftests/blend/multi-mix-blend-mode-ref.yaml
new file mode 100644
index 0000000000..ae366a09e0
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/multi-mix-blend-mode-ref.yaml
@@ -0,0 +1,14 @@
+---
+root:
+  items:
+    - type: rect
+      bounds: 0 0 800 200
+      color: [255, 0, 0, 1]
+
+    - type: rect
+      bounds: 50 50 100 100
+      color: [255, 255, 0, 1]
+
+    - type: rect
+      bounds: 300 50 400 100
+      color: [255, 0, 255, 1]
diff --git a/gfx/wr/wrench/reftests/blend/multi-mix-blend-mode.yaml b/gfx/wr/wrench/reftests/blend/multi-mix-blend-mode.yaml
new file mode 100644
index 0000000000..d3ba8fcaf0
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/multi-mix-blend-mode.yaml
@@ -0,0 +1,25 @@
+---
+root:
+  items:
+    - type: stacking-context
+      blend-container: true
+      items:
+      - type: rect
+        bounds: 0 0 800 200
+        color: [255, 0, 0, 1]
+
+      - type: stacking-context
+        bounds: 50 50 100 100
+        mix-blend-mode: difference
+        items:
+          - type: rect
+            bounds: 0 0 100 100
+            color: [0, 255, 0, 1]
+
+      - type: stacking-context
+        bounds: 300 50 100 100
+        mix-blend-mode: difference
+        items:
+          - type: rect
+            bounds: 0 0 400 100
+            color: [0, 0, 255, 1]
diff --git a/gfx/wr/wrench/reftests/blend/multiply-2-ref.yaml b/gfx/wr/wrench/reftests/blend/multiply-2-ref.yaml
new file mode 100644
index 0000000000..6d4679a79d
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/multiply-2-ref.yaml
@@ -0,0 +1,6 @@
+---
+root:
+  items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [0, 128, 0]
diff --git a/gfx/wr/wrench/reftests/blend/multiply-2.yaml b/gfx/wr/wrench/reftests/blend/multiply-2.yaml
new file mode 100644
index 0000000000..0ad1ef35d6
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/multiply-2.yaml
@@ -0,0 +1,16 @@
+---
+root:
+  items:
+    - type: stacking-context
+      blend-container: true
+      items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [0, 255, 0]
+        - type: stacking-context
+          bounds: [0, 0, 100, 100]
+          mix-blend-mode: multiply
+          items:
+            - type: rect
+              bounds: [0, 0, 100, 100]
+              color: [255, 128, 0]
diff --git a/gfx/wr/wrench/reftests/blend/multiply-3.yaml b/gfx/wr/wrench/reftests/blend/multiply-3.yaml
new file mode 100644
index 0000000000..05e1aa20f6
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/multiply-3.yaml
@@ -0,0 +1,20 @@
+---
+root:
+  items:
+    - type: stacking-context
+      blend-container: true
+      items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: [0, 255, 0]
+        - type: stacking-context
+          bounds: [0, 0, 100, 100]
+          mix-blend-mode: multiply
+          items:
+            - type: stacking-context
+              bounds: [0, 0, 100, 100]
+              mix-blend-mode: multiply
+              items:
+                - type: rect
+                  bounds: [0, 0, 100, 100]
+                  color: [255, 128, 0]
diff --git a/gfx/wr/wrench/reftests/blend/multiply-ref.yaml b/gfx/wr/wrench/reftests/blend/multiply-ref.yaml
new file mode 100644
index 0000000000..0b9aeed906
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/multiply-ref.yaml
@@ -0,0 +1,6 @@
+---
+root:
+  items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: green
diff --git a/gfx/wr/wrench/reftests/blend/multiply.yaml b/gfx/wr/wrench/reftests/blend/multiply.yaml
new file mode 100644
index 0000000000..f9fa6cbb75
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/multiply.yaml
@@ -0,0 +1,16 @@
+---
+root:
+  items:
+    - type: stacking-context
+      blend-container: true
+      items:
+        - type: rect
+          bounds: [0, 0, 100, 100]
+          color: green
+        - type: stacking-context
+          bounds: [25, 25, 50, 50]
+          mix-blend-mode: multiply
+          items:
+            - type: rect
+              bounds: [0, 0, 50, 50]
+              color: green
diff --git a/gfx/wr/wrench/reftests/blend/reftest.list b/gfx/wr/wrench/reftests/blend/reftest.list
new file mode 100644
index 0000000000..b4826d6837
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/reftest.list
@@ -0,0 +1,24 @@
+== multiply.yaml multiply-ref.yaml
+fuzzy(1,32) == multiply-2.yaml multiply-2-ref.yaml
+fuzzy(1,32) == color_targets(4) alpha_targets(0) multiply-3.yaml multiply-2-ref.yaml
+== difference.yaml difference-ref.yaml
+fuzzy(1,30000) == difference-transparent.yaml difference-transparent-ref.yaml
+== darken.yaml darken-ref.yaml
+== lighten.yaml lighten-ref.yaml
+
+fuzzy(1,32) == repeated-difference.yaml repeated-difference-ref.yaml
+
+== isolated.yaml isolated-ref.yaml
+fuzzy(3,397) == isolated-2.yaml isolated-2-ref.yaml
+== isolated-with-filter.yaml isolated-ref.yaml
+== isolated-premultiplied.yaml blank.yaml
+== isolated-premultiplied-2.yaml isolated-premultiplied-2-ref.yaml
+
+== large.yaml large-ref.yaml
+
+# fuzzy because dithering is different for gradients
+# drawn in different render targets
+fuzzy(1,2502) == transparent-composite-1.yaml transparent-composite-1-ref.yaml
+fuzzy(1,2502) == transparent-composite-2.yaml transparent-composite-2-ref.yaml
+
+fuzzy(2,420) == multi-mix-blend-mode.yaml multi-mix-blend-mode-ref.yaml
diff --git a/gfx/wr/wrench/reftests/blend/repeated-difference-ref.yaml b/gfx/wr/wrench/reftests/blend/repeated-difference-ref.yaml
new file mode 100644
index 0000000000..30d53325ba
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/repeated-difference-ref.yaml
@@ -0,0 +1,7 @@
+---
+root:
+  items:
+        -
+          bounds: [0, 0, 100, 100]
+          type: rect
+          color: [0, 255, 0]
diff --git a/gfx/wr/wrench/reftests/blend/repeated-difference.yaml b/gfx/wr/wrench/reftests/blend/repeated-difference.yaml
new file mode 100644
index 0000000000..a04e6cb274
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/repeated-difference.yaml
@@ -0,0 +1,31 @@
+---
+root:
+  items:
+    -
+      bounds: [0, 0, 100, 100]
+      type: rect
+      color: [255, 255, 255]
+    - type: stacking-context
+      blend-container: true
+      items:
+      -
+        bounds: [0, 0, 100, 100]
+        type: stacking-context
+        mix-blend-mode: difference
+        items:
+          -
+            bounds: [0, 0, 100, 100]
+            type: rect
+            color: [255, 255, 255]
+          - type: stacking-context
+            blend-container: true
+            items:
+              -
+                bounds: [0, 0, 100, 100]
+                type: stacking-context
+                mix-blend-mode: difference
+                items:
+                  -
+                    bounds: [0, 0, 100, 100]
+                    type: rect
+                    color: [0, 255, 0]
diff --git a/gfx/wr/wrench/reftests/blend/transparent-composite-1-ref.yaml b/gfx/wr/wrench/reftests/blend/transparent-composite-1-ref.yaml
new file mode 100644
index 0000000000..235801c5e1
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/transparent-composite-1-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+  items:
+    - type: gradient
+      bounds: [0, 0, 100, 100]
+      start: [0, 0]
+      end: [0, 100]
+      stops: [0.0, [0,0,0,0], 1.0, green]
diff --git a/gfx/wr/wrench/reftests/blend/transparent-composite-1.yaml b/gfx/wr/wrench/reftests/blend/transparent-composite-1.yaml
new file mode 100644
index 0000000000..319b636843
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/transparent-composite-1.yaml
@@ -0,0 +1,12 @@
+---
+root:
+  items:
+    - type: stacking-context
+      bounds: [0, 0, 100, 100]
+      mix-blend-mode: darken
+      items:
+        - type: gradient
+          bounds: [0, 0, 100, 100]
+          start: [0, 0]
+          end: [0, 100]
+          stops: [0.0, [0,0,0,0], 1.0, green]
diff --git a/gfx/wr/wrench/reftests/blend/transparent-composite-2-ref.yaml b/gfx/wr/wrench/reftests/blend/transparent-composite-2-ref.yaml
new file mode 100644
index 0000000000..235801c5e1
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/transparent-composite-2-ref.yaml
@@ -0,0 +1,8 @@
+---
+root:
+  items:
+    - type: gradient
+      bounds: [0, 0, 100, 100]
+      start: [0, 0]
+      end: [0, 100]
+      stops: [0.0, [0,0,0,0], 1.0, green]
diff --git a/gfx/wr/wrench/reftests/blend/transparent-composite-2.yaml b/gfx/wr/wrench/reftests/blend/transparent-composite-2.yaml
new file mode 100644
index 0000000000..e064f68f95
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/transparent-composite-2.yaml
@@ -0,0 +1,16 @@
+---
+root:
+  items:
+    - type: stacking-context
+      bounds: [0, 0, 100, 100]
+      mix-blend-mode: darken
+      items:
+        - type: stacking-context
+          bounds: [0, 0, 100, 100]
+          mix-blend-mode: darken
+          items:
+            - type: gradient
+              bounds: [0, 0, 100, 100]
+              start: [0, 0]
+              end: [0, 100]
+              stops: [0.0, [0,0,0,0], 1.0, green]
diff --git a/gfx/wr/wrench/reftests/blend/transparent-white.png b/gfx/wr/wrench/reftests/blend/transparent-white.png
new file mode 100644
index 0000000000..6019b2b817
--- /dev/null
+++ b/gfx/wr/wrench/reftests/blend/transparent-white.png