Can't delete a shape when iframe loses focus

It’s gonna take me some time to make a reproducing example. But maybe you have a quick guess about where the bug is.

The repro is roughly as follows:

1. Embed <iframe> on the page. The iframe content page renders <Excalidraw />.
2. Draw a shape
3. Click outside the iframe.
   • Note the shape still appears selected — Excalidraw doesn’t know you clicked outside the iframe. Not ideal but seems okay — I don’t know if that’s even fixable.
4. Click on the shape and press Backspace.

Expected: the shape gets deleted. Actual: the shape is undelete-able — it ignores the key bindings.

The only way to fix it from that point is to draw another shape. Somehow after that, selecting the first shape attaches the key bindings again, and I can Backspace the first shape.

[gaearon]

Thanks!

[craigkovatch]

It was introduced very early in the project to prevent UI text selecting on drag.

If that’s the case, you should be able to just use -webkit-user-select: none; user-select: none; and be done! 😃