011-manual.html (2112B)
1 <!doctype html> 2 <html> 3 <head> 4 <title>allowTargetOrigin should only block dragenter, dragover, dragleave and drop events</title> 5 <style type="text/css"> 6 div { height: 100px; width: 100px; background: orange; margin: 0; padding: 0; float: left; } 7 div + div { background: blue; } 8 </style> 9 <script type="text/javascript"> 10 window.onload = function () { 11 var orange = document.getElementsByTagName('div')[0], evtdone = {}, fails = []; 12 orange.ondragstart = function (e) { 13 evtdone[e.type] = true; 14 e.dataTransfer.effectAllowed = 'copy'; 15 e.dataTransfer.setData('text','dummy text'); 16 try { 17 e.dataTransfer.allowTargetOrigin('http://example.com'); 18 } catch(e) { 19 fails[fails.length] = 'allowTargetOrigin threw an error: '+e; 20 } 21 }; 22 orange.ondragenter = orange.ondragover = orange.ondrop = function (e) { 23 e.preventDefault(); 24 evtdone[e.type] = true; 25 }; 26 orange.ondrag = orange.ondragleave = function (e) { 27 evtdone[e.type] = true; 28 }; 29 orange.ondragend = function (e) { 30 evtdone[e.type] = true; 31 if( !evtdone.dragstart ) { 32 fails[fails.length] = 'dragstart did not fire - how did that happen?'; 33 } 34 if( !evtdone.drag ) { 35 fails[fails.length] = 'drag did not fire'; 36 } 37 if( !evtdone.dragend ) { 38 fails[fails.length] = 'dragend did not fire - OK, who broke the testcase?'; 39 } 40 if( evtdone.dragenter ) { 41 fails[fails.length] = 'dragenter fired'; 42 } 43 if( evtdone.dragover ) { 44 fails[fails.length] = 'dragover fired'; 45 } 46 if( evtdone.dragleave ) { 47 fails[fails.length] = 'dragleave fired'; 48 } 49 if( evtdone.drop ) { 50 fails[fails.length] = 'drop fired'; 51 } 52 document.getElementsByTagName('p')[0].innerHTML = fails.length ? ( 'FAIL:<br>' + fails.join('<br>') ) : 'PASS'; 53 }; 54 }; 55 </script> 56 </head> 57 <body> 58 <p>Drag the orange square over the blue square then back to the orange square, then release it. Fail if this text does not change.</p> 59 <div draggable="true"></div> 60 <div></div> 61 <noscript><p>Enable JavaScript and reload</p></noscript> 62 </body> 63 </html>