Why does Chrome raise a mousemove on mousedown?

Question

I have noticed that in Chrome (I'm using Chrome 35.0.1916.114 [UPDATE: also occurs in "35.0.1916.153 m"], Windows 7 64-bit) when I click the left button not only is a mouseDown event raised (as I expect) but also a mouseMove.

In this fiddle if you click in the input element you will see a 'D' for each mouseDown event raised and an 'M' for each mouseMove.

HTML:

<input id="txt" type="text"/>
<p>Moves</p><p id="moves">0</p>
<p>Downs</p><p id="downs">0</p>
<p id="activity">Activity</p>

JS:

$( "#txt" ).mousedown(function() {
     document.getElementById("activity").innerHTML +="D";
    update(false,true);
});
$( "#txt" ).mousemove(function() {
    document.getElementById("activity").innerHTML +="M";
    update(true,false);
});

function update(move, down) 
{
    var moves=document.getElementById("moves").innerHTML;
    if (move) 
    {
        moves ++;
        document.getElementById("moves").innerHTML=moves;
    }

    var downs=document.getElementById("downs").innerHTML;
    if (down) 
    {
        downs ++;
        document.getElementById("downs").innerHTML=downs;
    }
    var d=parseInt(downs);
    var m=parseInt(moves);
    if ((d+m)%25==0)
    {
        document.getElementById("activity").innerHTML +="<br>";
    }
}

In FF and IE11 once the cursor is in the input element then you will be able to get consecutive 'D's (ie, a click raises a single mouseDown event). In Chrome each mouse click raises a mouseDown and two mouseMove events.

This is not due to any slight wobbling of the mouse as I use a trackball so the cursor is absolutely stationary.

Is anyone aware of a workaround for this?

Thanks Dave

Answer 1

strange issue indeed, however with a little flag this can be circumvented: http://jsfiddle.net/3a28p7ek/

the change is pretty straight forward, setting ignoreNextMove to true on each mouse down and canceling the move handler if this flag is set, after resetting the flag so that regular move events get handled properly:

ignoreNextMove = false;

$( "#txt" ).mousedown(function() {
    ignoreNextMove = true;
    document.getElementById("activity").innerHTML +="D";    
    update(false,true);
});
$( "#txt" ).mousemove(function() {
        if(ignoreNextMove)
    {
        ignoreNextMove = false;
        return;
    }
    document.getElementById("activity").innerHTML +="M";
    update(true,false);
});