1 files changed, 61 insertions, 0 deletions
diff --git a/image/test/mochitest/mq_dynamic_svg_test.html b/image/test/mochitest/mq_dynamic_svg_test.html
new file mode 100644
index 0000000000..8acb6d3331
--- /dev/null
+++ b/image/test/mochitest/mq_dynamic_svg_test.html
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html>
+<meta charset=utf-8>
+<style>
+@media (prefers-color-scheme: dark) {
+  rect { fill: green; }
+}
+iframe { border: none; }
+</style>
+<p>inline</p>
+<svg width="50" height="50">
+  <rect width="50" height="50" fill="red"/>
+</svg>
+<p>iframe</p>
+<iframe src='data:image/svg+xml,
+  <svg xmlns="http://www.w3.org/2000/svg" width="50" height="50">
+    <style>
+      @media (prefers-color-scheme: dark) {
+        rect { fill: green; }
+      }
+    </style>
+    <rect width="50" height="50" fill="red"/>
+  </svg>
+' width=50 height=50></iframe>
+<p>img</p>
+<img src='data:image/svg+xml,
+  <svg xmlns="http://www.w3.org/2000/svg" width="50" height="50">
+    <style>
+      @media (prefers-color-scheme: dark) {
+        rect { fill: green; }
+      }
+    </style>
+    <rect width="50" height="50" fill="red"/>
+  </svg>
+' width=50 height=50>
+<p>background-image</p>
+<div style='background-image: url("data:image/svg+xml,\
+  <svg xmlns=&apos;http://www.w3.org/2000/svg&apos; width=&apos;50&apos; height=&apos;50&apos;>\
+    <style>\
+      @media (prefers-color-scheme: dark) {\
+        rect { fill: green; }\
+      }\
+    </style>\
+    <rect width=&apos;50&apos; height=&apos;50&apos; fill=&apos;red&apos;/>\
+  </svg>\
+"); width: 50px; height: 50px;'></div>
+<p>img with nested document</p>
+<img src='data:image/svg+xml,
+  <svg xmlns="http://www.w3.org/2000/svg" width="50" height="50">
+    <image href="data:image/svg+xml,
+      &amp;lt;svg xmlns=&amp;quot;http://www.w3.org/2000/svg&amp;quot; width=&amp;quot;50&amp;quot; height=&amp;quot;50&amp;quot;>
+        &amp;lt;style>
+          @media (prefers-color-scheme: dark) {
+            rect { fill: green; }
+          }
+        &amp;lt;/style>
+        &amp;lt;rect width=&amp;quot;50&amp;quot; height=&amp;quot;50&amp;quot; fill=&amp;quot;red&amp;quot;/>
+      &amp;lt;/svg>
+    " width="50" height="50"/>
+  </svg>
+' width=50 height=50>