fix: Scope drag and drop events to Excalidraw container to prevent overriding the host drag and drop events

[zsviczian]

Excalidraw global event listeners to disable EVENT.DRAG_OVER and EVENT.DROP interfere with host apps functionality. Some of the drag&drop functionality stops working in Obsidian once Excalidraw was started.

See linked Obsidian-Excalidraw issue:
zsviczian/obsidian-excalidraw-plugin#304

I decided to use handleKeyboardGlobally to control whether to add the global drag event listeners because I believe that the need for global event handling for KEYDOWN and DRAG_OVER and DROP will go hand in hand.

It may be appropriate to rename handleKeyboardGlobally to handleEventsGlobally or similar. If this change is pushed all the way to the API, this will be a breaking change to the API. An alternative is to add a separate property for this or to explain in the documentation for handleKeyboardGlobally, that the property also controls onDragOver and onDrop event handlers.

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/excalidraw/excalidraw/AJ7rPaFFuy9ufKCt5Y6NDvUeTFH2
✅ Preview: https://excalidraw-git-fork-zsviczian-fix-ondragover-c8a15a-excalidraw.vercel.app

[ad1992]

We might just want to scope it down to excalidraw-container unless we want to support globally optionally ?
cc @dwelle

[zsviczian]

You mean like this?

this.excalidrawContainerValue.container?.addEventListener(EVENT.DRAG_OVER, this.disableEvent, false);
this.excalidrawContainerValue.container?.addEventListener(EVENT.DROP, this.disableEvent, false);

[dwelle]

Yup, this.excalidrawContainerRef.current?. in this case.

[zsviczian]

Hi @dwelle, is there still anything holding you back from pushing this fix to production?

[ad1992]

can you also add this in changelog since this is related to package ?

[zsviczian]

you mean this:
https://github.com/excalidraw/excalidraw/blob/master/CHANGELOG.md
or this?
https://github.com/excalidraw/excalidraw/blob/master/src/packages/excalidraw/CHANGELOG.md

[ad1992]

you mean this: https://github.com/excalidraw/excalidraw/blob/master/CHANGELOG.md or this? https://github.com/excalidraw/excalidraw/blob/master/src/packages/excalidraw/CHANGELOG.md

https://github.com/excalidraw/excalidraw/blob/master/src/packages/excalidraw/CHANGELOG.md
⬆️ , it has package related changes

[ad1992]

Merging, thanks @zsviczian 🎉