Q:

the mouseup event stop the click event on firefox

I have a strange problem !
On a div element i listen a mousedown, mouseup, and click event.
But on firefox, the click event never work !
On Chromium or Trident ( wow ) it work perfectly.
If the element is a button  it work, but not on a div.
<div>click me</div>
<script>
    var div = document.querySelector('div');

    function fn(e)
    {
        if(e.target === div)
            div.innerHTML = 'event ' + e.type;
    }

    // work
    div.addEventListener('mousedown',fn);

    // work
    div.addEventListener('mouseup',fn);

    // nop !
    div.addEventListener('click',fn);

    // nothing !
    document.addEventListener('click',fn,true);
</script>

https://jsfiddle.net/aL7q8qpv/7/

A:

The issue (I would call it bug) seems to be the modification of the innerHTML.
Based on the specification a click should be triggered when mousedown and mouseup fire on the same target(element).
When you modify the innerHTML on mousedown, you replace a Node (a TextNode) with a new TextNode, the target for mouseup seems to change.
But that isn't the expected behaviour, because the target should be a ElementNode, not a TextNode(and it's still the same Element).
Possible fix:
modify the content of the existing  TextNode instead of the innerHTML:

var div = document.querySelector('div');


function fn(e)
{
 div.firstChild.data='Event:'+e.type;
}

div.addEventListener('mousedown',fn);

div.addEventListener('mouseup',fn);

div.addEventListener('click',fn);
<div>
  click me
</div>

