Take a look at this jsfiddle to see the exact issue in action.
In my experience, the 'dragenter' event dataTransfer.files works correctly in all browsers except for Firefox. However, I have noticed that the 'drop' event consistently provides the correct dataTransfer.files even in Firefox.
I'm not sure if this is a potential bug specific to Firefox (versions 21.0 and 23.0.1) as I have encountered this on both Mac OS and Windows platforms.
Below is the full code snippet:
function preventDefault(_e) {
_e.preventDefault();
}
var dropZone = document.getElementById('drop-zone');
dropZone.addEventListener("dragstart", preventDefault, false);
dropZone.addEventListener("dragleave", preventDefault, false);
dropZone.addEventListener("drag", preventDefault, false);
dropZone.addEventListener("dragend", preventDefault, false);
dropZone.addEventListener("dragover", preventDefault, false);
dropZone.addEventListener("dragenter", function(_e) {
_e.preventDefault();
console.log(_e.dataTransfer.files);
}, false);
dropZone.addEventListener("drop", function(_e) {
_e.preventDefault();
console.log(_e.dataTransfer.files);
}, false);
Have others experienced similar issues?
It's possible that this could be due to sandbox restrictions, although I haven't come across any information confirming this...
Your thoughts and insights are welcomed :).