89041 2012-06-13 15:10:37 -0700 Click events from child element of disabled <button> incorrectly bubble 2023-01-26 21:04:17 -0800 1 1 1 Unclassified WebKit UI Events 528+ (Nightly build) Mac OS X 10.6 NEW https://bugs.webkit.org/show_bug.cgi?id=99712 https://bugs.webkit.org/show_bug.cgi?id=15696 http://jsfiddle.net/sjRtk/3/ InRadar P2 Normal --- 251246 1 jmvanhorn webkit-unassigned ahmad.saleem792 akeerthi ap bfulgham bill cdumez me pf rniwa webkit-bug-importer wenson_hsieh zalan oldest_to_newest 648499 0 jmvanhorn 2012-06-13 15:10:37 -0700 If a disabled <button> element contains a child element, then clicking on the child causes a click event to bubble up to the button's containing element. Example: <div id="btn-container"> <button disabled> <i class="icon">XX</i> disabled-icon </button> </div> If an event listener is added to #btn-container for 'click' events, then clicking on the <i> element ("XX", contained in disabled button) causes the handler to be invoked. Clicking on the button's other content ("disabled-icon" text) does not invoke the handler. 648500 1 147422 jmvanhorn 2012-06-13 15:11:19 -0700 Created attachment 147422 html/js example of incorrect bubbling 654025 2 pf 2012-06-20 17:09:15 -0700 html spec says about disabled form controls and events: "A form control that is disabled must prevent any click events that are queued on the user interaction task source from being dispatched on the element." http://www.whatwg.org/specs/web-apps/current-work/multipage/association-of-controls-and-forms.html#attr-fe-disabled The problem seems to be that the event's target is set to the button's child element, other browsers have the button as target. Not sure what code is really to blame, hit testing? As an aside, all browsers seem to be doing something different with regards to mouse events and disabled form controls, maybe that's why the spec only talks about the click events, where all browsers sort of agree. I used something like this to play around, http://jsfiddle.net/EqfZ9/1/ 746586 3 ap 2012-10-19 13:14:38 -0700 See also: bug 15696, bug 99712. 1838477 4 webkit-bug-importer 2022-02-07 18:32:16 -0800 <rdar://problem/88605979> 1892603 5 ahmad.saleem792 2022-08-19 22:58:23 -0700 I am able to reproduce this bug in Safari 15.6.1 and Safari Technology Preview 151 using attached test case, where clicking "xx" on disabled button will trigger event and show up in Console: [Log] click btn-container – MouseEvent {isTrusted: true, screenX: 544, screenY: 168, …} (attachment.cgi, line 23)...... While in case of other browsers (Chrome Canary 106 and Firefox Nightly 105), I am unable to reproduce this issue. I am going to mark this bug from "Unconfirmed" to "New". Thanks! 147422 2012-06-13 15:11:19 -0700 2012-06-13 15:11:19 -0700 html/js example of incorrect bubbling webkitbug.html text/html 747 jmvanhorn PGRpdiBpZD0iYnRuLWNvbnRhaW5lciI+CiAgICA8YnV0dG9uPmVuYWJsZWQ8L2J1dHRvbj4KICAg IDxidXR0b24gaWQ9ImRpc2FibGVkLWJ1dHRvbiIgZGlzYWJsZWQ+CiAgICAgICAgPGkgY2xhc3M9 Imljb24iPlhYPC9pPgogICAgICAgIGRpc2FibGVkLWljb24KICAgIDwvYnV0dG9uPgo8L2Rpdj4K CjxzY3JpcHQ+CgovKgoKMS4gQ2xpY2sgb24gI2Rpc2JsZWQtYnV0dG9uJ3MgPGk+IGNoaWxkIGVs ZW1lbnQgKCJYWCIpLi4uIAogICBhICdjbGljaycgZXZlbnQgYnViYmxlcyB0byAjYnRuLWNvbnRh aW5lcgogICAKMi4gQ2xpY2sgb24gI2Rpc2FibGVkLWJ1dHRvbidzIHRleHQgY29udGVudCAKICAg KCJkaXNhYmxlZC1pY29uIikuLi4gbm8gJ2NsaWNrJyBldmVudCBidWJibGVzIHRvIAogICAjYnRu LWNvbnRhaW5lcgogICAKKi8KdmFyIGNvbnRhaW5lciA9IGRvY3VtZW50LmdldEVsZW1lbnRCeUlk KCdidG4tY29udGFpbmVyJyk7CmNvbnRhaW5lci5hZGRFdmVudExpc3RlbmVyKCdjbGljaycsIGZ1 bmN0aW9uKGUpewogICAgY29uc29sZS5sb2coJ2NsaWNrIGJ0bi1jb250YWluZXInLCBlKTsKfSk7 Cgp2YXIgZGlzYWJsZWRCdG4gPSBkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgnZGlzYWJsZWQtYnV0 dG9uJyk7CmRpc2FibGVkQnRuLmFkZEV2ZW50TGlzdGVuZXIoJ2NsaWNrJywgZnVuY3Rpb24oZSl7 CiAgICBjb25zb2xlLmxvZygnY2xpY2sgZGlzYWJsZWQtYnV0dG9uJywgZSk7Cn0pOwoJCjwvc2Ny aXB0PgoK