Dialog: disallows selection of contents when draggable

[zharmir]

In all Dojo versions 1.6 and up, the "draggable" attribute has been added to the root DOM node of draggable dialogs. This effectively blocks selection of any content inside the dialog in Safari, Chrome, and Firefox. I've gotten around it in Chrome / Safari by adding this styling:

.claro .dijitDialog {
    -webkit-user-select: text;
    -khtml-user-select: text;
    -moz-user-select: text;
    -o-user-select: text;
    user-select: text;
}

Firefox seems to be ignoring this, however. I suppose I'm not all that familiar with why the draggable attribute was set to true for the root div for 1.6, since it seems like it worked fine before.

[zharmir]

After rather extensive hunting and picking through some complicated functions in core widget code, we've figured this is just Dojo dynamically applying widget properties as attributes to the DOM node. But, the problem remains: I cannot have a draggable dialog with selectable text in non-IE browsers. I'm just going to override this locally with an extended version of Dialog that sets its domNode.draggable to false whenever show() is called.

[bill]

Ah, good detective work.

But I tried selecting text in Dialog and it's working for me. This is using the "Show Dialog" button in ​http://download.dojotoolkit.org/release-1.7.0/dojo-release-1.7.0/dijit/tests/test_Dialog.html on firefox/mac, safari/mac, and even chrome/win.

The draggable attribute is being copied as part of a change to automatically copy attributes to the DOM without having to specify them in markup, see [25598]. And if you can show me how to reproduce this problem then the fix is presumably to add a custom setter:

_setDraggableAttr: function(/*Boolean*/ val){
   this._set("draggable", val);
}

[zharmir]

Yeah, you're right, the one on that page works for me. However, I'm noticing that the "draggable" attribute is not set on the dialog, nor is any explicit draggable option being turned on where the dialog is created.

That prompted me to repeat my tests without adding the "draggable: true" option. I guess the default behavior is to be draggable - we've habitually been specifying it every time, whether we set it to true or false. Anyway, when draggable is not specified, the dialog is draggable and also selectable.

But regardless, I'll attach the file I can reproduce the problem in. We're using dojo 1.7.0.

[bill]

Ah, that makes more sense. Yes, if you specify draggable (or anything) in the constructor parameters, it will be copied to the DOM, but there's no such handling for default values of parameters.

[bill]

In [27426]:

Don't copy draggable attribute to Dialog.domNode as it prevents text selection, fixes #14452 !strict.

[bill]

#17231 is a duplicate of this ticket.