This is an archived snapshot of W3C's public bugzilla bug tracker, decommissioned in April 2019. Please see the home page for more details.
D3E is the only specification where this behavior is described? If yes then definition should be more accurate. Now we have only this: "Each implementation will determine the appropriate hysteresis tolerance, but in general SHOULD fire click and dblclick events when the event target of the associated mousedown and mouseup events is the same element with no mouseout or mouseleave events intervening, and SHOULD fire click and dblclick events on the nearest common ancestor when the event targets of the associated mousedown and mouseup events are different." But ancestor for which target (mousedown, mouseup or both)? When both what if we have mousedown on <body> and mouseup on <html>? What target will be set? Mayebe use term sth like this: nearest common "inclusive ancestor" (http://www.w3.org/TR/dom/#concept-tree-inclusive-ancestor) will be better. Just only suggest to add more details because now we have different behaviors in browsers: https://bugzilla.mozilla.org/show_bug.cgi?id=1004895
Theoretical examples in IE and Chrome (Firefox never generate click event in this cases). Case1: <body>(click target) <div>mousedown target<div> <p>mouseup target<p> </body> Case2: <div>mousedown target (click target) <p>mouseup target<p> <div> Case3: <html>mouseup target (click target) <body>mousedown target<body> </html> This browser have strange behaviour when move mouse to adding content (mousedown generate sth and we move mouse to this, especially text node in Chrome) and when mouseup adding sth too, but it looks like a bug, sometimes it's different in IE and Chrome. Small practical test: <!DOCTYPE html> <html> <head> <style> * { outline: none; } body > * { outline: none; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } </style> <body> <div style="background-color: #CCC; border: 1px solid #888;" id="dragel"> Some DIV1. Drag me to a below paragraph to receive click event. </div> <p>Some paragraph P1 outside DIV1.</p> <div style="background-color: #FFF; border: 1px solid #888;" >Another DIV2. Drag me to a below paragraph to receive click event. <p>Another paragraph P2 inside DIV2. </p> </div> <div id="output" style="border: 1px solid #888;"></div> <script> var elem = document.getElementById("output"); window.addEventListener("mousedown", function(e){ elem.innerHTML += "e.type: " + e.type + "<br>" + "e.target: " + e.target + "<br><br>"; }); window.addEventListener("mouseup", function(e){ elem.innerHTML += "e.type: " + e.type + "<br>" + "e.target: " + e.target + "<br><br>"; }); window.addEventListener("click", function(e){ elem.innerHTML += "e.type: " + e.type + "<br>" + "e.target: " + e.target + "<br><br>"; }); </script> </body> </html>
At some point, IIRC, D3E said that click should be dispatched only if mousedown and up have the same target, and didn't have anything about nearest common ancestor. When was that "nearest common ancestor" part added?
W3C Working Draft 31 May 2011 http://www.w3.org/TR/2011/WD-DOM-Level-3-Events-20110531/ "Note that the lag time, degree, distance, and number of mousemove events allowed between the mousedown and mouseup events while still firing a click or dblclick event must be implementation-, device-, and platform-specific. Each implementation should determine the appropriate hysteresis tolerance, but in general should fire click and dblclick events when the event target of the associated mousedown and mouseup events is the same element with no mouseout or mouseleave events intervening, and should not fire click and dblclick events when the event target of the associated mousedown and mouseup events is different." Next version change this: W3C Working Draft 14 June 2012 http://www.w3.org/TR/2012/WD-DOM-Level-3-Events-20120614/
Yes, thanks for this example file. It appears that the WebKit/Trident behavior finds the nearest inclusive ancestor (i.e., if the event targets are the same, that's the click target; if one target includes the other, that is the click target. If neither include each other, then it's the nearest common ancestor. I can make this spec update.
I clarified this text, and added an example as well. https://dvcs.w3.org/hg/dom3events/rev/01ded2704b4b