Title: I&#x27;m working on an application that makes heavy use of in-app drag-and-drop to categorize and update data.  We aren&#x27;t using the DnD for sorting or arbitrary item placement, nor do we support dropping files or other media for upload.  We simply need to be able to drag a type of element and handle hovering and dropping on others of that type as well as their container.  We also only need to support Firefox and Chrome.<p>Originally it was built with HTML5 drag-and-drop, but we&#x27;ve started to see many issues, specifically in Chrome.  For instance, previously we got a ghost image of the element for free in both Firefox and Chrome, but recently Chrome has reverted to a little gray box with the element text.  We could use setDragImage, but since we&#x27;re dragging plain old DOM elements that seems excessive.  Chrome also seems to treat the dragEnter events strangely, making nested element hover handling difficult.<p>We could potentially implement a custom solution (the front-end is React, so it wouldn&#x27;t be too hard) but that also seems excessive.<p>I&#x27;m about to add a dependency on jQuery and jQuery UI just to allow the use of their bulletproof Draggable and Droppable elements.  Somehow that feels dirty.  Is there a good, modern way to allow us to drag regular DOM elements and handle the hover and drop events?  It doesn&#x27;t seem like it should be this hard.
Upvote: