img-blobURI-2.html (1417B)
1 <!DOCTYPE html> 2 <!-- This test checks to be sure we allow 3 'blob' URIs *inside of* SVG-as-an-image. --> 4 <html class="reftest-wait"> 5 <head> 6 <script> 7 function go() { 8 // Generate a blob URL encoding of an SVG document 9 var blobURL = generateBlobURL(); 10 11 // Now generate a data URI, containing our blob URI 12 var outerSVG = 13 '<svg xmlns="http://www.w3.org/2000/svg" ' + 14 'xmlns:xlink="http://www.w3.org/1999/xlink" ' + 15 'width="100" height="100">' + 16 '<image height="100" width="100" ' + 17 'xlink:href="' + blobURL + '"/>' + 18 '</svg>'; 19 20 // Tell our img element to render the URL 21 var img = document.getElementsByTagName("img")[0] 22 img.src = "data:image/svg+xml," + outerSVG; 23 24 // Once our img loads, take reftest snapshot. 25 img.addEventListener("load", function() { 26 document.documentElement.removeAttribute("class"); 27 }); 28 } 29 30 // Helper function -- returns a blob URL representing a 31 // 100x100 fully-lime SVG document. 32 function generateBlobURL() { 33 var svg = 34 '<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100">' + 35 '<rect height="100%" width="100%" fill="lime"/>' + 36 '</svg>'; 37 return self.URL.createObjectURL(new Blob([svg], {type: "image/svg+xml"})); 38 } 39 </script> 40 </head> 41 <body onload="go()"> 42 <img src=""> 43 </body> 44 </html>