Arrows not working on input type="number"

Well I'm surprised by this but it looks like a bug, at least in Chrome. (Edge doesn't show the arrows at all and Firefox behaves correctly.)

The mousemove event listener (on the element or the document) breaks the INPUT TYPE="number" if an e.preventDefault() is present:

<input type="number" value="1"/>

$(function() {
    $(document).on('mousemove', function (e) {
        e.preventDefault();
    });
});

See https://jsfiddle.net/MCAU/Lpojfrm2/

Can anyone confirm this?

You can try this:

HTML

<div id="incdec">
<input type="text" value="0" />
<img src="up_arrow.jpeg" id="up" />
<img src="down_arrow.jpeg" id="down" />
</div>

JQuery

$(document).ready(function(){
$("#up").on('click',function(){
    $("#incdec input").val(parseInt($("#incdec input").val())+1);
});

$("#down").on('click',function(){
    $("#incdec input").val(parseInt($("#incdec input").val())-1);
});

});