Opened 4 years ago

Closed 3 years ago

Last modified 3 years ago

#18838 closed defect (fixed)

Dojo Drag and Drop does not work on specifically Windows 10 IE11

Reported by: nikhil.dabholkar@… Owned by: Michael Van Sickle <mvansickle@…>
Priority: undecided Milestone: 1.8.13
Component: DnD Version: 1.10.5
Keywords: Cc:
Blocked By: Blocking:

Description

The software(developed in dojo) I am working on has the feature of drag and drop, things were working fine on all the browsers, just recently our QA team informed me that the drag and drop feature of our product is not working on Windows 10 IE11 only, all the other browsers even including IE11 on windows 7 and 8 support drag and drop feature in our product.

I suppose this could be due to an update that got applied to the Windows 10 installation, since the QA mentioned that this feature was working on Windows 10 IE11 a few months back.

So I tried the following example on both the browsers and noticed that it failed on Windows 10 IE11 only http://sitepen.github.io/sp-dnd-demo/4-dnd.html

Currently I am trying to debug the dojo code for Manager.js and Source.js Till now I noticed that in Source.js the drag event is getting executed correctly but the target is getting cleared hence the onDrop event is not getting called

The dojo used is latest 1.10

Please provide me any pointers on resolving this issue

Thanks

Change History (15)

comment:1 Changed 4 years ago by nikhil.dabholkar@…

On dragging the item from the source container and bringing it in the drop area, the browser should fire a "mousemove" or "mouseover" event, but instead the browser (Windows 10 IE11) would fire a "mouseout" event thus forcing the drop area to reject the dragged item. This could be caused due to the combining effect of touch and mouse events.

In the codefix I check the current co-ordinates of the mouse pointer and compare them to the edges of the drop area and check if the mouse pointer is inside the drop area. If its inside the drop area and the browser fires a "mouseout" event, then I consider this event as invalid and reject it, which allows the item to be dropped successfully in the drop area. If the mouse pointer is outside the edges of the drop area and the browser fires a "mouseout" event, then I consider this event as legit and process it.

I had to override the onMouseOut event in dojo.dnd.Container class as follows:

dojo.dnd.Container.extend({

'onMouseOut': function(e){

var iOffsetLeft = e.offsetLeft; var iOffsetTop = e.offsetTop; var iOffsetHeight = e.offsetHeight; var iOffsetWidth = e.offsetWidth; var iMaxX = iOffsetLeft + iOffsetWidth; var iMaxY = iOffsetTop + iOffsetHeight; if((e.pageY <= iMaxY && e.pageY >= iOffsetTop) && (e.pageX <= iMaxX && e.pageX >= iOffsetLeft)) {

return false;

} else {

this.inherited(arguments);

}

}

});

Please let me know if I could better this solution

Thanks

Last edited 4 years ago by nikhil.dabholkar@… (previous) (diff)

comment:2 Changed 4 years ago by bill

http://sitepen.github.io/sp-dnd-demo/4-dnd.html is working for me on Windows 10 IE11. I'm able to drag items into the wish list.

comment:3 Changed 4 years ago by nikhil.dabholkar@…

I have the following Windows Updates installed KB3156421 KB3116900 KB3140741 KB3139907 And IE Version - 11.306.10586.0 Update Versions - 11.0.31 (KB3154070)

Do you have some different versions or updates ?

Version 0, edited 4 years ago by nikhil.dabholkar@… (next)

comment:4 Changed 3 years ago by dylan

Milestone: tbd1.11.3

comment:5 Changed 3 years ago by adityaaj

This issue happens in Windows 10 Chrome latest version as well

It only happens on laptops with touch screen.

comment:6 in reply to:  2 Changed 3 years ago by adityaaj

Do you have touch laptop? I noticed it only happens in touch laptops Replying to bill:

http://sitepen.github.io/sp-dnd-demo/4-dnd.html is working for me on Windows 10 IE11. I'm able to drag items into the wish list.

comment:7 Changed 3 years ago by bill

Nope, I definitely don't have a touch laptop (although I do have an iPad). Maybe that's the difference.

comment:8 Changed 3 years ago by Michael J Van Sickle

I can reproduce the unstable DND feature using my NVIDIA Shield K1 (Android) tablet with Chrome when on http://sitepen.github.io/sp-dnd-demo/4-dnd.html. Going to use this as a testbed for addressing this issue.

comment:9 Changed 3 years ago by Michael J Van Sickle

I've narrowed this down to the Avatar triggering mouseout events on the Target due to (apparently) a lag between the rendering of the avatar vs the firing of events on my test machine. Basically, if the user drags toward the avatar, the target fires the mouseout event and the DnD is aborted.

My first thought was to include the avatar in the tests to see if the mouseout event should be cancelled. While this works, it breaks the ability to detect a true mouseout event on the target later. I'm still working on solutions, but I wanted to provide an update with my findings.

comment:10 Changed 3 years ago by Michael Van Sickle <mvansickle@…>

Owner: set to Michael Van Sickle <mvansickle@…>
Resolution: fixed
Status: newclosed

In c72fe98/dojo:

Error: Processor CommitTicketReference failed
Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

comment:11 Changed 3 years ago by Michael Van Sickle <mvansickle@…>

In 5c2c21f/dojo:

Error: Processor CommitTicketReference failed
Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

comment:12 Changed 3 years ago by Michael Van Sickle <mvansickle@…>

In 857c1b9/dojo:

Error: Processor CommitTicketReference failed
Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

comment:13 Changed 3 years ago by Michael Van Sickle <mvansickle@…>

In a7e708f/dojo:

Error: Processor CommitTicketReference failed
Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

comment:14 Changed 3 years ago by Michael Van Sickle <mvansickle@…>

In cb2f82c/dojo:

Error: Processor CommitTicketReference failed
Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

comment:15 Changed 3 years ago by Michael J Van Sickle

Milestone: 1.11.31.8.13
Note: See TracTickets for help on using tickets.