Unify SVG and HTML image loading

longsonr · moz-wptsync-bot · commit 4420f221dd46 · 2025-06-02T09:04:54.000+01:00
Differential Revision: https://phabricator.services.mozilla.com/D251619 bugzilla-url: https://bugzilla.mozilla.org/show_bug.cgi?id=1967531 gecko-commit: c4ff7f09ffc69cb7e67386b93092922f52c931c4 gecko-reviewers: emilio
diff --git a/svg/embedded/image-embedding-nesteder-data-url.html b/svg/embedded/image-embedding-nesteder-data-url.html
@@ -1,6 +1,9 @@
 <!doctype html>
+<html class="reftest-wait">
 <title>SVG image that uses a data: URL and then again</title>
 <link rel="match" href="../struct/reftests/reference/green-100x100.html">
+<script src="/common/reftest-wait.js"></script>
+<script src="/common/rendering-utils.js"></script>
 <img src="data:image/svg+xml,
   <svg xmlns='http://www.w3.org/2000/svg' width='100' height='100'>
     <image href='data:image/svg+xml,
@@ -14,3 +17,9 @@
     '/>
   </svg>
 ">
+<script>
+waitForAtLeastOneFrame().then(() => {
+    takeScreenshot();
+});
+</script>
+</html>
diff --git a/svg/embedded/image-modify-href-4.svg b/svg/embedded/image-modify-href-4.svg
@@ -16,15 +16,17 @@
       const doc = document.implementation.createDocument(SVG_NS, "svg");
 
       const image = doc.createElementNS(SVG_NS, "image");
+      image.addEventListener('load', function() {
+        waitForAtLeastOneFrame().then(() => {
+            takeScreenshot();
+        });
+      });
       image.setAttribute("width", 100);
       image.setAttribute("height", 100);
       image.setAttribute("href", "reference/green-rect-100x100.svg");
       doc.documentElement.appendChild(image);
 
       document.documentElement.appendChild(document.adoptNode(image));
-
-      await waitForAtLeastOneFrame();
-      takeScreenshot();
     }
   </script>
 </svg>
