Modernizr testing draganddrop on IE8

Question

I'm testing drag and drop API supporting with

    if (!Modernizr.draganddrop) {
    alert('No!');
}
else { 
    alert('Yes');
     } 

But somehow it shows 'Yes' in IE8, which of course don't support html5 D&D API.

Thanks in advance

Answer 1

Reading a few other places, it seems that this might be a fairly common issue.

The thing is, there are different meanings to "drag and drop" in the browser context.

There is, in fact, a set of drag and drop event handlers that are supported in IE8 (all the way back to IE5, in fact), which is probably what Modernizr is reporting true for in this test. They are the same events in old versions of IE as newer browsers because the HTML5 standard basically formalised what IE was doing already. Reference: Quirksmode (excuse the profanity there! he apparently doesn't like the drag/drop api. but the important thing is that he's clear: drag+drop does exist in old IE versions, and in fact Microsoft invented it)

However, these drag and drop events are not the whole picture. There is also the concept of dragging a file from outside the browser window and dropping it into the browser. This is a different drag+drop action entirely, and is a much newer feature. It is currently listed in Modernizr's "Undetectables" page, because it can't be accurately detected.

The closest anyone has got to detecting it that I know of is combining the Modernizr drag+drop check with a secondary check on the FileReader API, as follows:

if (!!window.FileReader && Modernizr.draganddrop) {
    ....
}

However, I'm also reading reports that this technique gives a false negative for Safari, so take it with a grain of salt.

Reference:

• SO: How to determine presence of HTML5 drag'n'drop file upload API
• SO: Determine if browser is drag-and-drop capable?
• How to detect browser support for file API and drag & drop

Hope that helps explain things, even if it doesn't necessarily make the solution any clearer.