How to simulate HTML5 Drag and Drop events in javascript?

Question

As title, I\'m trying to simulate an HTML5 drag and drop event in javascript.

I\'ve looked into jquery.ui.simulate and also the simulate function here. Both seem to be a

Answer 1

You can try this one. It uses native HTML5 events, no jQuery

https://github.com/Photonios/JS-DragAndDrop-Simulator

Answer 2

Your best bet is to recreate a fake event object.

In my unit tests for a drag-and-drop file upload library (Droplit, shameless plug), I have been doing this with jQuery's Event method. In my source code I set my drop event listener with element.ondrop() like so:

element.ondrop = function(e) {
  e.preventDefault();
  readFiles(e.dataTransfer.files);
};

And then I can test this out by building a fake event object and passing it into the ondrop method.

element.ondrop($.Event('drop', {dataTransfer: { files: [] }}));