search

clauderic / dnd-kit

The modern, lightweight, performant, accessible and extensible drag & drop toolkit for React.
http://dndkit.com
MIT License
13.24k stars 656 forks source link

Draggable not working well inside iframe #1030

Open PixelForm opened 1 year ago

PixelForm commented 1 year ago

I'm using draggable elements inside an iframe. Like drag and drop operations of elements that are already inside the iframe. The elements do work with dragging but only when moving the mouse outside of the iframe context. I'm assuming that happens due to the listeners that get attached to the document or window which is the topmost context and not that of the iframe.

Will this be resolved in the future? And is there a workaround for this for now?

clauderic commented 1 year ago

Could you provide a CodeSandbox replicating the issue?

PixelForm commented 1 year ago

Well, to simply explain my situation: I'm using a React portal to render it's children inside an iframe and make those children sortable. That's what I want but the elements inside the iframe only respond to mousemove events if the mouse is outside of the iframe. So basically: "mousedown on element activates the draggable, then the mousemove event works when moving the mouse outside of the iframe".

Codesandbox link: https://codesandbox.io/s/vibrant-zeh-gx36di