DrawPane mousemove evt fired only once if I move the mouse with the button kept down

[d.cavestro]

I'm facing an issue with mouse events on DrawPane and DrawItems.
I've added both a mouseMoveHandler and a mouseDownHandler on a DrawPane. If I press the mouse button, keep it down and then move the pointer, then I get only a single mouseMove event notification until I release the mouse button.
The same stands for DrawItems, so this behavor is reproducible even with the Mouse Events example from in the showcase: if you simply hold the mouse button down on the Triangle and then move out of the shape you will not be notified of other than a single mouse move event.
I'm just wondering if this is the expected behavior, cause it prevents me to implement drag select, i.e. render a floating selection rectangle using a dotted drawrect whose bottom-right corner follows the mouse pointer.

I can reproduce it using SmartClient Version: v9.0p_2014-01-05/LGPL Development Only (built 2014-01-05) and SmartClient Version: v9.1p_2014-03-09/LGPL Development Only (built 2014-03-09)
(current showcase) both with Chrome Version 33.0.1750.146 and Firefox 26.0

I'm not attaching a test case cause the issue is reproducible with the showcase.
Please let me know if you need further info.

[Isomorphic]

We're not reproducing an issue with either DrawPane or DrawItem.

The Showcase example you linked to doesn't show the issue either, it's just refreshing to the same text as additional mouseMoves fire. We modified it to use a counter, and you see the counter increasing, as expected.

[d.cavestro]

Standalone Smartclient code snippet to reproduce the issue

Sorry, I had to refine the reproduction steps.

The following snippet reproduces systematically the issue on SmartClient ShowCase. So the issue is about mousemove event not fired when moving the mouse on a component different from the one where the mouse button was pressed if the latter has a mousedown handler.

PREMISE
* there's a drawpane with blue border (blue square) and a drawrect with red border (red square).
* both the drawpane and the drawrect are configured with a mousemove handling function that increments a dedicated counter and reflects the event into a label, so that when you move the mouse within the red square you see events both for the red and the blue one
* both the drawpane and the drawrect are configured with a mousedown handling function

STEPS TO REPRODUCE
1. Move the mouse pointer into the inner red square
2. Press the mouse left button and keep it down
3. Move the mouse outside the red square, within the blue one

EXPECTED BEHAVIOR
I'd expect mouse move events to be fired for the blue square when I move the mouse over it, even if the mouse button is still down (and has been pressed within the red square)

ACTUAL BEHAVIOR
Mouse move events on the blue square are simply lost

The same stands if press the mouse button on the blue square and move to the red square.

Follows the snippet:

var rectMoveCounter = 0;
var paneMoveCounter = 0;

var mainPane = isc.VLayout.create({
	id: "drawPaneLayout",
	autoDraw: true,
	height: 200,
	width: 200,
	members: [
		isc.DrawPane.create({
			ID: "drawPane",
			autoDraw: false,
			cursor: "default",
			height: "100%",
                        border: "2px solid blue",
			drawItems: [
				isc.DrawRect.create({
					id: "drawPaneRect",
					width: 80,	
					height: 80,
					left: 60,
					top: 60,
                                        lineColor: 'red',
                                        mouseMove: function() {rectEventsLabel.setContents ("Rect mouse move "+(rectMoveCounter++));},
	                                mouseDown: function() {rectEventsLabel.setContents ("Rect mouse down ");}
				})
			]
		})
	],
	mouseMove: function() {paneEventsLabel.setContents ("Pane mouse move "+(paneMoveCounter++));},
	mouseDown: function() {paneEventsLabel.setContents ("Pane mouse down ");}

});
var rectEventsLabel = isc.Label.create({        
   width: 200,
   height: 30,
   contents:'no rect events'
});
var paneEventsLabel = isc.Label.create({        
   width: 200,
   height: 30,
   contents:'no pane events'
});


isc.VStack.create({
    height: "100%",
    members: [mainPane, rectEventsLabel, paneEventsLabel]
});

[Isomorphic]

When a drag is initiated, valid drop targets get dropMove events, not mouseMouse events.

[d.cavestro]

I've been able to implement drag-selection

Great, so I've been able to produce some drag-selection behavior. I leave here a snippet for other folks having the same need:

var drawPane;
var selectionRect;
var selectionStartX;
var selectionStartY;


var getAbsCoordinates = function (drawItem) {
    var rect = new Object();

    var drawItemLeft = drawItem.left;
    var drawItemTop = drawItem.top;
    var drawItemWidth = drawItem.width;
    var drawItemHeight = drawItem.height;
    var positiveWidth = drawItemWidth>0;
    var positiveHeight = drawItemHeight>0;

    rect.left = drawItemLeft+(positiveWidth?0:drawItemWidth);
    rect.top = drawItemTop+(positiveHeight?0:drawItemHeight);
    rect.width = Math.abs (drawItemWidth);
    rect.height = Math.abs (drawItemHeight);
    return rect;
}

var drawItemContains = function (drawItem1, drawItem2) {
    var rect1 = getAbsCoordinates (drawItem1);
    var rect2 = getAbsCoordinates (drawItem2);

    return rect1.left>=rect2.left && rect1.top>=rect2.top && rect1.left + rect1.width<=rect2.left + rect2.width && rect1.top + rect1.height<=rect2.top + rect2.height;
}

var mainPane = isc.VLayout.create({
	id: "drawPaneLayout",
	autoDraw: true,
	height: 200,
	width: 330,
        dragAppearance: 'none',
        dragStartDistance: 2,
        canDrag: true,
        dragStart: function (){
            selectionStartX = drawPane.getOffsetX();
            selectionStartY = drawPane.getOffsetY()
            selectionRect.moveTo (selectionStartX, selectionStartY);
            selectionRect.draw();
        },
        dragStop: function (){
            selectionRect.erase();

            for (var i = 0; i<drawPane.drawItems.length;i++) {
                   var drawItem = drawPane.drawItems[i];
                   drawItem.fillColor = drawItemContains (drawItem, selectionRect)?'yellow':'white';
            }
        },
        dragMove: function (){
            selectionRect.resizeTo (drawPane.getOffsetX() - selectionStartX, drawPane.getOffsetY() - selectionStartY);
        },
	members: [
		 drawPane = isc.DrawPane.create({
			ID: "drawPane",
			autoDraw: false,
			cursor: "default",
			height: "100%",
                        border: "2px solid blue",
			drawItems: [
				isc.DrawRect.create({
					id: "redRect",
					width: 80,	
					height: 80,
					left: 60,
					top: 60,
                                        lineColor: 'red'
				}),
				isc.DrawRect.create({
					id: "greenRect",
					width: 80,	
					height: 80,
					left: 190,
					top: 60,
                                        lineColor: 'green'
				}),
				selectionRect = isc.DrawRect.create({
					id: "selectionRect",
					width: 0,	
					height: 0,
					left: 10,
					top: 10,
//                                        linePattern: 'dot',
                                        lineColor: 'black',
                                        lineWidth: 1,
                                        fillOpacity: 0.2,
                                        fillColor: 'yellow'
				})
			]
		})
	]

});

isc.VStack.create({
    height: "100%",
    members: [mainPane]
});