Route to Blink>Input. 

It seems we should check LayoutObject::VisibleToHitTesting() to determine
event target instead of "click" event handler, e.g. ClearButtonElement::DefaultEventHandler().

I'm not sure why pointe-events:none on DIV, or display:block(?), works correctly. Do we handle
pointer-events:none in another way?

LayoutObject::
  bool VisibleToHitTesting() const {
    return Style()->VisibleToHitTesting() && !IsInert();
  }

ComputedStyle::
  bool VisibleToHitTesting() const {
    return Visibility() == EVisibility::kVisible &&
           PointerEvents() != EPointerEvents::kNone;
  }

Adjusting the above fiddle to report the mousedown/click target as per pointer-events:none, the target is always the body whether you click on the span or the div.
ie: document.addEventListener('click', function(e) { console.log('target is ' + e.target);});

// Result is body for both the span and div.

So the hit testing and the event dispatch is correct. I believe the problem is somewhere in the selection controller determining that it can do something with the cursor position.

yosin@ do you agree? If not I can dig further but it looks correct from the input point of view.

>#c2, agree. It seems this is selection issue.

This issue has been Available for over a year. If it's no longer important or seems unlikely to be fixed, please consider closing it out. If it is important, please re-triage the issue.

Sorry for the inconvenience if the bug really should have been left as Available.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot