Drag and drop of an atomic element is one step late, building a minimal repro

1

Hi, I am encountering an issue with the drag and drop of inline-block elements specifically. The first time I drag such an element element, say a button, on drop, the event has no data and nothing happens. The second time I drag a button and drop it, it will drop button 1. The third time, button 2, etc. The drop is always one step late compared to the latest dragged element. This leads to a very weird behaviour. The “atomic” property seems to have no effect. I am in the context of a web component, so perhaps it’s related to using the Shadow DOM. Or some drag events interfere with ProseMirror.

I’ve tried to start a minimal reproduction, but I couldn’t parse the DOM correctly. Here is the glitch:

I’d be eager to get some help to setup a minimal repro of atomic elements, before I can assess if this is specific to my code or an actual bug. Why the button aren’t parsed in this example?

2

That demo probably doesn’t work because the pill nodes have required (default-less) attributes but the parse logic doesn’t assign them.

3

The Glitch code is not valid anymore, I’ll try again. Any idea what could cause this “lagging” bug? I’ve since dug the code a bit more and I am pretty sure something is off in the drag and drop logic (namely the dragstart handler).

As far as I understand, and doesn’t use the dataTransfer value directly, but set a selection and gets the text out of it. At this step, it seems that the selection is “one step late” when I am dragging those atomic elements. Couldn’t build a minimal repro yet.

Might happen more reliably if I don’t select the node beforehand and drag it immediately. Perhaps the selection is not the expected value in this case.

4

Ok found the issue: had a custom dispatchTransaction that was not updating the view :person_facepalming: so the call that updates the selection during “dragstart” had an effect only during the next update, explaining the late step. At least I got a deeper understanding of the drag and drop logic and selection!