<html>
<head>
<script>
function logDrag(e) {
var l = document.getElementById('log');
l.innerHTML += 'shiftKey=' + e.shiftKey + ' ctrlKey=' + e.ctrlKey + ' altKey=' + e.altKey + ' metaKey=' + e.metaKey + '\n';
e.preventDefault();
}
document.addEventListener('DOMContentLoaded', function() {
document.addEventListener('dragenter', logDrag, false);
document.addEventListener('dragover', logDrag, false);
document.addEventListener('dragleave', logDrag, false);
document.addEventListener('drop', logDrag, false);
});
</script>
</head>
<body>
<p>Drag the "Drag me" with any modifier keys pressed (Shift/Ctrl/Alt) and see if the log messages have the correct modifier state</p>
<div draggable='true' id='dragme'>
Drag me
</div>
<pre id='log'></pre>
</body>
</html>