000.html (2543B)
1 <!DOCTYPE html> 2 <title>drag & drop - no microdata for no itemscope</title> 3 <style> 4 body > div { 5 height: 200px; 6 width: 200px; 7 background-color: orange; 8 position: absolute; 9 top: 8px; 10 left: 8px; 11 } 12 body > div * { 13 display: none; 14 } 15 body > div + div { 16 background-color: navy; 17 left: 250px; 18 } 19 body > div + div + div { 20 background-color: fuchsia; 21 left: 500px; 22 } 23 p:first-of-type { 24 margin-top: 220px; 25 } 26 </style> 27 28 <script> 29 30 function makeEl(eltype,props,contents) { 31 var elem = document.createElement(eltype); 32 for( var i in props ) { 33 if( props.hasOwnProperty(i) ) { 34 elem.setAttribute(i,props[i]); 35 } 36 } 37 if( contents ) { 38 elem.innerHTML = contents; 39 } 40 return elem; 41 } 42 43 var orange, fails = [], doneonce = false; 44 window.onload = function() { 45 orange = document.getElementsByTagName('div')[0]; 46 orange.ondragstart = function(e) { 47 e.dataTransfer.effectAllowed = 'copy'; 48 e.dataTransfer.setData('Text', 'dummy text'); 49 var err; 50 if( err = checkprops(e.dataTransfer.getData('application/microdata+json')) ) { 51 fails[fails.length] = e.type + ' ' + err; 52 } 53 }; 54 orange.nextSibling.ondragenter = orange.nextSibling.ondragleave = orange.nextSibling.ondragover = 55 orange.ondrag = orange.ondragend = function(e) { 56 if( e.type == 'dragover' || e.type == 'dragenter' ) { 57 e.preventDefault(); 58 e.dataTransfer.dropEffect = 'copy'; 59 } 60 if( e.dataTransfer.getData('application/microdata+json') ) { 61 fails[fails.length] = e.type + ' unexpectedly had microdata (security restriction)'; 62 } 63 }; 64 orange.nextSibling.ondrop = function(e) { 65 var err; 66 if( err = checkprops(e.dataTransfer.getData('application/microdata+json')) ) { 67 fails[fails.length] = e.type + ' ' + err; 68 } 69 if( e.type != 'drop' ) { return; } 70 if( doneonce ) { return; } 71 doneonce = true; 72 setTimeout(function () { 73 document.getElementsByTagName('p')[0].innerHTML = fails.length ? ( 'FAIL: ' + fails.join('<br>') ) : 'PASS'; 74 fails = []; 75 }, 200 ); 76 }; 77 78 }; 79 function checkprops(md) { 80 var i; 81 if( !md ) { return 'no microdata'; } 82 md = JSON.parse(md); 83 if( !md.items ) { return 'no items collection'; } 84 if( md.items.length != 0 ) { return 'unexpected items found'; } 85 return ''; 86 } 87 88 </script> 89 90 <div draggable='true'></div><div></div><div></div> 91 92 <p>Use your pointing device to drag the orange box to the pink box, then back to the blue box, and release it.</p> 93 <noscript><p>Enable JavaScript and reload</p></noscript>