Song rows aren't droppable when pointer enters element
derat opened this issue · 1 comments
I'm not sure if it's always been there, but in Chrome 105.0.5195.112, I'm seeing annoying behavior when dragging rows in song-table
to reorder them where a red crossed-out circle is briefly visible for a single Y coordinate between each pair of rows. If I happen to end the drag there, the drop doesn't happen.
At first I thought that the #drag-target
indicator div was responsible, but I see the issue when I set pointer-events: none
on it or even leave it at display: none
. Getting rid of the table's line-height: 1.2
doesn't help either.
I should check if this happens in Firefox, and also when using a low-res display -- this device has a pixel ratio of 1.600000023841858, which has triggered Chrome bugs in the past.
I think that this happens whenever the pointer enters an element that doesn't cancel the dragenter
event. The spec says that all DnD events bubble, and dragenter
seems to bubble when I make a minimal test case, but for some reason my dragenter
handler on document.body
doesn't seem to be getting called here.
Adding another dragenter
handler on the table
element seems to at least fix the issue between song rows. I tried creating a fullscreen overlay element to handle all of the DnD events, but it wasn't receiving any events for some reason.