image-embedding-nested-data-url-from-canvas-window-load.html (902B)
1 <!doctype html> 2 <html class=reftest-wait> 3 <title>Drawing SVG image with data: URL subresources (window load event)</title> 4 <link rel="match" href="reference/image-with-nested-rects.html"> 5 <style> 6 img { 7 width: 200px; 8 height: 200px; 9 background-color: red; 10 } 11 </style> 12 <img id="result" src=""> 13 <script> 14 const canvas = document.createElement('canvas'); 15 canvas.width = 200; 16 canvas.height = 200; 17 const context = canvas.getContext('2d'); 18 19 context.fillStyle = "red"; 20 context.fillRect(0, 0, canvas.width, canvas.height); 21 22 const image = new Image(); 23 image.src = "support/image-with-nested-data-url-images.svg?" + Math.random().toString(); 24 25 window.onload = () => { 26 context.drawImage(image, 0, 0, canvas.width, canvas.height); 27 const resultImage = document.getElementById("result"); 28 resultImage.src = canvas.toDataURL(); 29 resultImage.onload = () => document.documentElement.className = ""; 30 }; 31 </script>