Skip to content
This repository has been archived by the owner on Apr 18, 2023. It is now read-only.

Song rows aren't droppable when pointer enters element #45

Open
derat opened this issue Sep 15, 2022 · 1 comment
Open

Song rows aren't droppable when pointer enters element #45

derat opened this issue Sep 15, 2022 · 1 comment
Assignees
Labels
bug Something isn't working

Comments

@derat
Copy link
Owner

derat commented Sep 15, 2022

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.

@derat derat added the bug Something isn't working label Sep 15, 2022
@derat derat self-assigned this Sep 15, 2022
@derat
Copy link
Owner Author

derat commented Sep 18, 2022

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.

@derat derat changed the title Song rows aren't droppable in some positions Song rows aren't droppable when pointer enters element Sep 18, 2022
derat added a commit that referenced this issue Sep 18, 2022
Listen for 'dragenter' events on the table element in
addition to document.body (which isn't receiving the events
in Chrome for some unknown reason). See #45.
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant