test_data_uri.html (9502B)
1 <html> 2 <head> 3 <title>Tests for Data URI</title> 4 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"> 5 <script src="/tests/SimpleTest/SimpleTest.js"></script> 6 <script src="/tests/SimpleTest/EventUtils.js"></script> 7 <style> 8 @font-face { 9 font-family: 'DataFont'; 10 src: url(data:font/opentype;base64,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); 11 } 12 </style> 13 14 <script> 15 SimpleTest.waitForExplicitFinish(); 16 17 SpecialPowers.setBoolPref("security.data_uri.block_toplevel_data_uri_navigations", false); 18 SimpleTest.registerCleanupFunction(() => { 19 SpecialPowers.clearUserPref("security.data_uri.block_toplevel_data_uri_navigations"); 20 }); 21 22 function imgListener(img) { 23 return new Promise((resolve, reject) => { 24 img.addEventListener("load", () => resolve()); 25 img.addEventListener("error", () => reject()); 26 }); 27 } 28 29 function runTests() 30 { 31 var iframe = document.getElementById("iframe"); 32 iframe.src="data:text/html,hello"; 33 let p1 = new Promise((resolve, reject) => { 34 iframe.onload = function() { 35 ok(SpecialPowers.wrap(iframe).contentDocument.nodePrincipal.isNullPrincipal, 36 "iframe should have NullPrincipal."); 37 resolve(); 38 } 39 }); 40 41 var iframe1 = document.getElementById("iframe1"); 42 iframe1.src="data:image/png,%89PNG%0D%0A%1A%0A%00%00%00%0DIHDR%00%00%00%18%00%00%00%18%02%03%00%00%00%9D%19%D5k%00%00%00%04gAMA%00%00%B1%8F%0B%FCa%05%00%00%00%0CPLTE%FF%FF%FF%FF%FF%FF%F7%DC%13%00%00%00%03%80%01X%00%00%00%01tRNS%08N%3DPT%00%00%00%01bKGD%00%88%05%1DH%00%00%00%09pHYs%00%00%0B%11%00%00%0B%11%01%7Fd_%91%00%00%00%07tIME%07%D2%05%0C%14%0C%0D%D8%3F%1FQ%00%00%00%5CIDATx%9C%7D%8E%CB%09%C0%20%10D%07r%B7%20%2F%E9wV0%15h%EA%D9%12D4%BB%C1x%CC%5C%1E%0C%CC%07%C0%9C0%9Dd7()%C0A%D3%8D%E0%B8%10%1DiCHM%D0%AC%D2d%C3M%F1%B4%E7%FF%10%0BY%AC%25%93%CD%CBF%B5%B2%C0%3Alh%CD%AE%13%DF%A5%F7%E0%03byW%09A%B4%F3%E2%00%00%00%00IEND%AEB%60%82"; 43 let p2 = new Promise((resolve, reject) => { 44 iframe1.onload = function() { 45 ok(SpecialPowers.wrap(iframe1).contentDocument.nodePrincipal.isNullPrincipal, 46 "iframe1 should have NullPrincipal."); 47 resolve(); 48 } 49 }); 50 51 var canvas = document.getElementById('canvas'); 52 var ctx = canvas.getContext('2d'); 53 ctx.fillRect(0, 0, canvas.height, canvas.width); 54 ctx.fillStyle = '#000'; 55 var data = canvas.toDataURL('image/png'); 56 var img = new Image(); 57 img.src = data; 58 let p3 = imgListener(img).then(() => { 59 dump("img onload\n"); 60 ctx.drawImage(img, 0, 0); 61 return new Promise((resolve, reject) => { 62 try { 63 ctx.getImageData(0, 0, 1, 1); 64 ok(true, "data:image should be same origin."); 65 resolve(); 66 } catch (e) { 67 ok(false, "data:image is cross-origin."); 68 reject(); 69 }}); 70 }).then(() => { 71 ctx.clearRect(0, 0, canvas.height, canvas.width); 72 ctx.drawImage(document.getElementById('img'), 0, 0); 73 return new Promise((resolve, reject) => { 74 try { 75 canvas.toDataURL(); 76 ok(true, "data:image should be same origin."); 77 resolve(); 78 } catch (e) { 79 ok(false, "data:image is cross-origin."); 80 reject(); 81 }}); 82 }).then(() => { 83 var win = window.open("data:text/html,<script>parent.opener.postMessage('ok', '*');<\/script>"); 84 return new Promise(resolve => { 85 window.onmessage = function (evt) { 86 is(evt.origin, "null", "The origin of data:text/html should be null."); 87 win.close(); 88 resolve(); 89 }}); 90 }); 91 92 var obj_doc = document.getElementById("obj_doc"); 93 obj_doc.data="data:text/html,%3Cbody%3E%3Cbutton%3EChild%3C/button%3E%3C/body%3E" 94 let p4 = new Promise((resolve, reject) => { 95 obj_doc.onload = function() { 96 ok(SpecialPowers.wrap(obj_doc).contentDocument.nodePrincipal.isNullPrincipal, 97 "obj_doc.document should have NullPrincipal."); 98 resolve(); 99 } 100 }); 101 102 var obj_svg = document.getElementById("obj_svg"); 103 obj_svg.data='data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 200 200"><circle cx="100" cy="100" r="100" fill="green" fill-opacity="0.8"/></svg>' 104 let p5 = new Promise((resolve, reject) => { 105 obj_svg.onload = function() { 106 ok(SpecialPowers.wrap(obj_svg).contentDocument.nodePrincipal.isNullPrincipal, 107 "obj_svg.contentDocument should have NullPrincipal."); 108 ok(SpecialPowers.wrap(obj_svg).getSVGDocument().nodePrincipal.isNullPrincipal, 109 "obj_svg.getSVGDocument() should have NullPrincipal."); 110 resolve(); 111 } 112 }); 113 114 // Test if data:stylesheet is considered same origin. 115 let p6 = new Promise((resolve, reject) => { 116 // 1. Dynamically include a css by inserting a <link> tag. 117 let link = document.createElement('link'); 118 link.rel = 'stylesheet'; 119 link.href = "data:text/css,.green-text{color:rgb(0, 255, 0)}"; 120 link.onload = function() { 121 let dataStyleSheet; 122 for (let i = 0; i < document.styleSheets.length; i++) { 123 let sheet = document.styleSheets[i]; 124 if (sheet.href === link.href) { 125 dataStyleSheet = sheet; 126 break; 127 } 128 } 129 ok(dataStyleSheet, "Should have found data:stylesheet"); 130 131 // 2. Try to access the rule. If data:stylesheet is not considered 132 // same origin, an exception will be thrown. 133 try { 134 let rule = dataStyleSheet.cssRules; 135 ok(true, "data:stylesheet is considered same origin."); 136 } catch (ex) { 137 ok(false, "data:stylesheet is NOT considered same origin: " + ex); 138 } 139 140 resolve(); 141 }; 142 document.head.appendChild(link); 143 }); 144 145 // Test if data:font is same-origin. 146 let p7 = new Promise((resolve, reject) => { 147 let text = document.createElement('p'); 148 // Cross-domain font will not load according to [1] so we try to apply 149 // data:font to this text and see if the font can be loaded. 150 // [1] https://www.w3.org/TR/css-fonts-3/#same-origin-restriction 151 text.style = 'font-family: DataFont'; 152 text.innerHTML = "This text should trigger 'TestFont' to load."; 153 document.body.appendChild(text); 154 155 document.fonts.ready.then(fontFaces => { 156 is(fontFaces.size, 1, "should FontFace entry for data:font"); 157 fontFaces.forEach(fontFace => { 158 is(fontFace.status, "loaded", "data:font should be same-origin"); 159 }); 160 resolve(); 161 }, 162 _ => { 163 ok(false, "data:font is not same-origin."); 164 reject(); 165 }); 166 }); 167 168 Promise.all([p1, p2, p3, p4, p5, p6, p7]).then(() => { 169 SimpleTest.finish(); 170 }).catch((e) => { 171 ok(false, "throwing " + e); 172 SimpleTest.finish(); 173 }); 174 } 175 </script> 176 177 <body onload="runTests()"> 178 <img style="width: 100px; height: 100px;" 179 src="data:image/png,%89PNG%0D%0A%1A%0A%00%00%00%0DIHDR%00%00%00%18%00%00%00%18%02%03%00%00%00%9D%19%D5k%00%00%00%04gAMA%00%00%B1%8F%0B%FCa%05%00%00%00%0CPLTE%FF%FF%FF%FF%FF%FF%F7%DC%13%00%00%00%03%80%01X%00%00%00%01tRNS%08N%3DPT%00%00%00%01bKGD%00%88%05%1DH%00%00%00%09pHYs%00%00%0B%11%00%00%0B%11%01%7Fd_%91%00%00%00%07tIME%07%D2%05%0C%14%0C%0D%D8%3F%1FQ%00%00%00%5CIDATx%9C%7D%8E%CB%09%C0%20%10D%07r%B7%20%2F%E9wV0%15h%EA%D9%12D4%BB%C1x%CC%5C%1E%0C%CC%07%C0%9C0%9Dd7()%C0A%D3%8D%E0%B8%10%1DiCHM%D0%AC%D2d%C3M%F1%B4%E7%FF%10%0BY%AC%25%93%CD%CBF%B5%B2%C0%3Alh%CD%AE%13%DF%A5%F7%E0%03byW%09A%B4%F3%E2%00%00%00%00IEND%AEB%60%82" 180 id="img"> 181 <iframe id="iframe"></iframe> 182 <iframe id="iframe1" ></iframe> 183 <canvas id="canvas" class="output" width="100" height="50"></canvas> 184 185 <object id="obj_doc"></object> 186 <object id="obj_svg"></object> 187 188 </body> 189 </html>