Opened 6 years ago

Closed 6 years ago

Last modified 5 years ago

#17709 closed defect (fixed)

Tree: onmouseup, onmousedown don't fire on IE10+

Reported by: Jan86 Owned by: bill
Priority: undecided Milestone: 1.7.6
Component: Dijit Version: 1.9.2
Keywords: Cc:
Blocked By: Blocking:

Description (last modified by bill)

Hello, Im using the a dijit.Tree in my project and it seem that the onMouseUp and onMouseDown-events doesn't fire in IE10. I created a small site for debugging this issue. There are no problems in FF or IE9.

Sample:

<!DOCTYPE html>
<html>
<head>
	<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/dojo/1.9.2/dijit/themes/claro/claro.css">
	<script>dojoConfig = {parseOnLoad: true}</script>
	<script src="//ajax.googleapis.com/ajax/libs/dojo/1.9.2/dojo/dojo.js"></script>
	
	<script>
 require([
     "dojo/_base/window", "dojo/store/Memory",
     "dijit/tree/ObjectStoreModel", "dijit/Tree",
     "dojo/domReady!"
 ], function(win, Memory, ObjectStoreModel, Tree){

     // Create test store, adding the getChildren() method required by ObjectStoreModel
     var myStore = new Memory({
         data: [
            { id: 1, name: 'Dijit Tree API', url: 'http://dojotoolkit.org/api/1.6/dijit.Tree', root: true },
            { id: 2, name: 'Dijit Tree.model API', url: 'http://dojotoolkit.org/api/1.6/dijit.Tree.model', parent: 1 },
            { id: 3, name: 'Dijit Tree.ForestStoreModel API', url: 'http://dojotoolkit.org/api/1.6/dijit.tree.ForestStoreModel', parent: 1 },
            { id: 4, name: 'Dijit Tree.TreeStoreModel API', url: 'http://dojotoolkit.org/api/1.6/dijit.tree.TreeStoreModel', parent: 1 },
         ],
         getChildren: function(object){
             return this.query({parent: object.id});
         }
     });

     // Create the model
     var myModel = new ObjectStoreModel({
         store: myStore,
         query: {root: true}
     });

     // Create the Tree, specifying an onClick method
     (new Tree({
         model: myModel,
         onClick: function(item){
             // Get the URL from the item, and navigate to it
             //location.href = item.url;
			 console.info("onClick",item);
         },
	 onMouseUp: function(item){
		 console.info("onMouseUp");
         },
	 onMouseDown: function(item){
		 console.info("onMouseDown");
         }
     })).placeAt(win.body()).startup();
});

require([
     "dojo/domReady!"
 ], function(){

 
	dojo.connect(dojo.byId("test"),"onmouseup",function(){
		console.info("onmouseup");
	})
	dojo.connect(dojo.byId("test"),"onmousedown",function(){
		console.info("onmousedown");
	});
});
	

	</script>
</head>
<body class="claro">
<div id="test" style="height:20px; width:20px; background-color:red;"></div>
</body>
</html>

Change History (8)

comment:1 Changed 6 years ago by bill

Component: GeneralDijit
Description: modified (diff)
Milestone: tbd1.10
Owner: set to bill
Summary: dijit.Tree - onMouseUp- and onMouseDown-Event doesn't fire in IE10Tree: onmouseup, onmousedown don't fire on IE10+

Thanks for the test case. I do reproduce it on IE10 and IE11.

IE is moving away from mousedown/mouseup etc. and promoting MSPointerDown/MSPointerUp (or on IE11, pointerdown/pointerup). So in tree/_dndSelector.js the function below gets called with an MSPointerDownEvent, rather than a mousedown event like you might suspect:

// selection related events
onClickPress: function(e){
...
	if(mouse.isLeft(e)){
		// Prevent text selection while dragging on desktop, see #16328.   But don't call preventDefault()
		// for mobile because it will break things completely, see #15838.
		e.preventDefault();
	}
...

The problem is the e.preventDefault(), which prevents the mousedown and mouseup events from occurring. I'll check in a fix and a test.

Last edited 6 years ago by bill (previous) (diff)

comment:2 Changed 6 years ago by bill

PS: Note that you can workaround the problem by listening for the other event too:

on(tree.domNode,"mouseup,MSPointerUp,pointerup",function(evt){
        console.info(evt.type);
});
on(tree.domNode,"mousedown,MSPointerDown,pointerdown",function(evt){
        console.info(evt.type);
});

The problem is that your event handler will be called repeatedly once this bug is fixed (and maybe already called repeatd if other browsers are already supporting the emerging pointerdown/pointerup standard.)

comment:3 Changed 6 years ago by Bill Keese <bill@…>

Resolution: fixed
Status: newclosed

In d4334c3d206c01ad28d6f030560445c2866dd496/dijit:

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

comment:4 Changed 5 years ago by Bill Keese <bill@…>

In 88b0f760d91d08331455eafb3d9c72782e96d8b0/dijit:

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

comment:5 Changed 5 years ago by Bill Keese <bill@…>

In e71b4bc67606488b4f18966192a36f0422b7bf6f/dijit:

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

comment:6 Changed 5 years ago by bill

Milestone: 1.101.8.7

comment:7 Changed 5 years ago by Bill Keese <bill@…>

In 5cdfa22ab2a57134f140efaff2308ccf8a6c97e4/dijit:

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

comment:8 Changed 5 years ago by bill

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