001-manual.xhtml (1516B)
1 <?xml version="1.0" encoding="utf-8"?> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <title>Cross-domain image data must not populate the dataTransfer</title> 5 <script src="../../resources/crossorigin.sub.js"></script> 6 <style type="text/css"> 7 div { 8 width:105px; 9 min-height:105px; 10 text-align:center; 11 margin-top:20px; 12 padding:10px; 13 border:solid thin navy; 14 } 15 </style> 16 </head> 17 <body> 18 <p><img id="image" draggable="true" alt="" width="100" height="100" /></p> 19 <p>Drag the navy square above to the box below.</p> 20 <div></div> 21 <script><![CDATA[ 22 23 document.getElementsByTagName("img")[0].src = crossOriginUrl("www", "../../resources/100x100-navy.png"); 24 25 window.onload = function() { 26 var image = document.getElementsByTagName('img')[0], div = document.getElementsByTagName('div')[0], failed = []; 27 div.ondragover = div.ondragenter = function(e) { 28 e.preventDefault(); 29 e.dataTransfer.dropEffect = 'copy'; 30 }; 31 div.ondrop = image.ondragstart = function(e) { 32 if( e.type == 'dragstart' ) { 33 e.dataTransfer.setData('Text', 'dummy text'); 34 e.dataTransfer.dropEffect = 'copy'; 35 } 36 for( var i = 0; i < e.dataTransfer.types.length; i++ ) { 37 if( e.dataTransfer.types[i].match(/image\//) ) { 38 failed[failed.length] = e.dataTransfer.types[i]; 39 } 40 } 41 if( e.type == 'drop' ) { 42 e.preventDefault(); 43 document.getElementsByTagName('p')[1].innerHTML = failed.length ? ( 'FAIL (found ' + failed.join() + ')' ) : 'PASS'; 44 } 45 }; 46 }; 47 ]]></script> 48 </body> 49 </html>