DnD from sidebar does not work (windows touch but using mouse)

[RonRadtke]

Subject of the issue

DnD from the sidebar does not work anymore. Working with 12.3.3.
See gif

Your environment

• version of gridstack.js - 12.4.1
• which browser/OS Edge 143.0

Steps to reproduce

Demo is attached, and stolen from #3212 as I saw that the same problem was in this demo when I checked for the bug.

One of my co-workers cannot reproduce it, while all others can. Tested in firefox / chrome / safari.
Strangely enough it works on the same PC and browser when I use touch on my additional touch monitor or activate responsive view.

Expected behavior

Tell us what should happen. If hard to describe, attach a video as well.
DnD should work

Two.grids.demo.htm

[MichaelWilsonSNC]

I'm seeing this as well, I think it broke in v12.4

[adumesny]

I can't reproduce this (mac 15.6.1, chrome 143) using https://gridstackjs.com/demo/two.html so I can't really fix it unless I can reproduce

[MichaelWilsonSNC]

I see a bit more, it's only busted on my touch screen Windows device when using the mouse - it works fine on my touch screen using touch. It seems to work fine on a non-touch screen using the mouse.

[MichaelWilsonSNC]

It's returning early right here in _mouseEnter() in dd-droppable.ts when using the mouse on a touch screen.

 // During touch drag operations, ignore real browser-generated mouseenter events (isTrusted: true).
    // Only process simulated mouseenter events (isTrusted: false) created by our touch handling code.
    // The browser can fire spurious mouseenter events when we dispatch simulated mousemove events.
    if (isTouch && e.isTrusted) {
      return

[adumesny]

thank for finding the culprit ! and of course this came from @jemunk for linux which I'm not able to test...
and I don't have a window touch device to test either...

Will have to revert #3191 since that is less of an issue at this point

[RonRadtke]

@adumesny I can confirm removing the line fixes the issue. ( I have a touch screen on my windows pc as additional monitor)
@MichaelWilsonSNC was just a little faster

[MichaelWilsonSNC]

It seems like when it's a real touch event, it comes from simulateMouseEvent() in utilts.ts. I guess in theory, you could pass some data from there to read in _mouseEnter() function to know whether it was a real mouse event, or one simulated from a touch event. Then, it could be something like if (isTouch && e.isTrusted && isSimulatingMouse) if that makes sense.

[RonRadtke]

@MichaelWilsonSNC yep, that works, but it would be better to go with a custom event class that extends the mouseevenet...
I am just still fighting a bit with the typing

[adumesny]

actually instead of checking isTouch (since I didn't think of having both be on same machine) I should set isSimulatingMouse if the down touch event to ignore any browser real events until release.
So on same machine you can either use finger or mouse BUT only one per drag gesture...

[RonRadtke]

Just realized that this would for sure break the linux fix...
All events the lib creats are isTrusted=false

[RonRadtke]

I think the problem is that in some cases the browser itself emulates a mouse event for touch events.
In that case you will have to catch it both ways.
So more like a "runningdragactiontype" which can either be mouse or touch. And you deny the counterpart. I would not bet on any stable order of events

[adumesny]

the browser is never gonna send touch events while you are using a mouse...
but yeah I don't know on the touch down if I'm guarantee to get that first before any (bogus, not generated by me) mouse events. I would think so.