[Vuejs]-Is it possible to use browser->drag() from dusk with Vuedraggable?

0đź‘Ť

There is an open issue for this on Dusk’s Github. I had to open a new issue that can be found here since the original was closed for comment. The link contains a more thorough explanation, but the short answer and solution are highlighted here:

Problem: Laravel’s Dusk does not trigger Vue.draggable events. To simulate a drag-and-drop Dusk does a “mouse down”, “move mouse to location”, and “mouse up” sequence. In theory this is correct but does not trigger Vue’ s events.

Solution: Dusk’s method does trigger mouse down and mouse up events, so we can simply use those events to trigger the ones desired.

$("a[draggable='true']").on("mousedown", function(event)  {
    $(this).trigger("dragstart");
});

$("div[droppable='true']").on("mouseup", function(event) {
    $(this).trigger("drop");
});

This JSFiddle is an example of how it would work (though you need to implement it on a Laravel project to truly test, of course!).

👤Isaiah

Leave a comment