Dialog: unable to close on an iPad

[doxavore]

If a user opens a dialog with an iPad, clicking the close button shows as though the button is being depressed, but the dialog never actually closes. This occurs when I tested it in 1.6.0 through the trunk version, and is easily reproducible in even the most simple of the included dijit dialog test pages.

I am still trying to determine what the cause is, as it appears to just connect dialog.onCancel with dialog.hide, but have been stuck for a few days. Perhaps someone else has some ideas?

[doxavore]

Just to be clear, this only seems to affect the small "x" on the top-right of the dialogs. Putting a button in the dialog which then calls dialog.hide() or dialog.onCancel() works fine. That's not really feasible for many existing dialogs though.

[ben hockey]

i'm unable to confirm this since i don't have an ipad but perhaps its related to touch events vs mouse events. there is some work being done in 1.7 to try to normalize touch and mouse events. i'm unsure of the status of that work but perhaps you could try a recent nightly - ​http://archive.dojotoolkit.org/dojo-2011-07-15/dojotoolkit/dijit/tests/test_Dialog.html and see if you have the same problem there.

[Douglas Hays]

Recreated using test_Dialog.html on trunk (2011-08-09).

[bill]

First of all, you can work around this issue by setting draggable=false for the Dialog.

The issue is that:

1. the close icon is inside the title bar
2. the title bar is the drag handle for the Dialog

In dojo/dnd/Moveable.js, touching the [x] icon calls:

onMouseDown: function(e){
...
	if(this.delay){
		this.events.push(
			dojo.connect(this.handle, touch.move, this, "onMouseMove"),
			dojo.connect(this.handle, touch.release, this, "onMouseUp")
		);
		this._lastX = e.pageX;
		this._lastY = e.pageY;
	}else{
		this.onDragDetected(e);
	}
	dojo.stopEvent(e);
},

The problem is the dojo.stopEvent() call, or more specifically, how dojo.stopEvent(e) calls e.preventDefault(). Calling e.stopPropagation() is OK, but calling e.preventDefault() somewhat understandably cancels the click event.

ISTM like the dojo.stopEvent() should be replaced by e.stopPropagation(), or maybe nothing at all, but I'm not sure what Eugene had in mind for this code, or what side effects such a change would have, so assigning to him. (Note that there are a number of dojo.stopEvent() calls in that file, maybe all of them should be changed.)

Alternately, maybe it's not allowed to have a button inside of a drag handle? But that seems a bit restrictive.

[alanrussian]

This has been fixed in version 1.8. It was still broken up till 1.7.3

​dojo/dnd was enhanced to work on touch devices.

I can't mark the ticket as complete. Is that because I'm a new user?

[bill]

Fixed in [28275]. @alanrussian, only committers have access to change ticket status.

[alanrussian]

Replying to bill:

Fixed in [28275]. @alanrussian, only committers have access to change ticket status.

Oh, makes sense. Thank you, bill!