Bug 146516 – Clicks on detached checkboxes don't bubble

• Component: UI Events
• Status: RESOLVED CONFIGURATION CHANGED

[Michał Gołębiowski-Owczarek]

Steps to reproduce the problem:

var div = document.createElement('div');
div.innerHTML = '<input type="checkbox">';
var input = div.querySelector('input');
div.addEventListener('click', function () {console.log('click on the div');});
input.addEventListener('click', function () {console.log('click on the input');});
var event = new MouseEvent('click', {
    'view': window,
    'bubbles': true,
    'cancelable': true
  });
input.dispatchEvent(event);

What is the expected behavior?
Console output should show:

"click on the input"
"click on the div"

What went wrong?
Console output shows:

"click on the input"

That is, the event is not bubbled to the div.

Reported also for Chrome at https://code.google.com/p/chromium/issues/detail?id=479207. Safari is now the only browser that does it this way. This seems to be introduced in https://bugs.webkit.org/show_bug.cgi?id=12918

[Alexey Proskuryakov]

Fixed in bug 149488?

[Ahmad Saleem]

I am unable to reproduce this bug in all modern browsers (Chrome Canary 106, Firefox Nightly 105, Safari 15.6 and Safari Technical Preview 151) and it shows expected result in all browsers and get two event with "input" and "div". I am going to mark this as "RESOLVED CONFIGURATION CHANGED", since it was fixed along the way. Thanks!