KarimMokhtar / react-drag-drop-files

Light and simple Reactjs drag and drop files library to use with very flexible options to change, so you put whatever the design you want for your drop-area. Users can drag and drop or even select the file anywhere in the window.
MIT License
248 stars 91 forks source link

NoModificationAllowedError #41

Closed TroyWolf closed 2 years ago

TroyWolf commented 2 years ago

No problems in Chrome. When I DnD a file in Firefox, my React app blows up with:

NoModificationAllowedError: Modifications are not allowed for this document

Per https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/clearData

Note: This method can only be used in the handler for the [dragstart](https://developer.mozilla.org/en-US/docs/Web/API/Document/dragstart_event) event, because that's the only time the drag operation's data store is writeable.

It looks like this code is doing clearData() in the drop handler: https://github.com/KarimMokhtar/react-drag-drop-files/blob/dev/src/useDragging.tsx#L56

This Stack Overflow is related: https://stackoverflow.com/questions/58201273/nomodificationallowederror-in-firefox-when-using-dnd-events

KarimMokhtar commented 2 years ago

@TroyWolf Thanks for mentioning that.

KarimMokhtar commented 2 years ago

Hi @TroyWolf most likely I am gonna solve it on the weekend. Would you like to contribute and solve it with a PR?

TroyWolf commented 2 years ago

I'll take a stab at it, yes. 👍🏼

TroyWolf commented 2 years ago

@KarimMokhtar should I branch off main? You have dev set as default branch.

KarimMokhtar commented 2 years ago

Nope Please branch from div i will merge to the main after testing and collecting PRs

TroyWolf commented 2 years ago

Fix has been merged to dev.