Bug 105697

Summary: Changing HTML content of <button> onchange of an <input> prevents a click from firing
Product: WebKit Reporter: TJ VanToll <tj.vantoll>
Component: DOMAssignee: Nobody <webkit-unassigned>
Status: NEW ---    
Severity: Minor CC: ahmad.saleem792, alexander.shalamov, ap, bfulgham, hayato, rniwa, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: 528+ (Nightly build)   
Hardware: Mac   
OS: OS X 10.8   

Description TJ VanToll 2012-12-23 13:55:51 PST
See the following code example (or see it live at http://jsfiddle.net/tj_vantoll/sNa3R/).

<!DOCTYPE html>
<html>
<head></head>
<body>

    <button>Initial</button>
    <input>

    <script>
        var button = document.getElementsByTagName('button')[0];
        var input = document.getElementsByTagName('input')[0];

        button.addEventListener('click', function() {
            alert('click');
        });

        input.addEventListener('change', function() {
            button.innerHTML = '<span>Changed</span>';
        });
    </script>

</body>
</html>

1) Type something in the textbox.
2) Without losing focus from the textbox click the button with the mouse.

Expected:
The click event to fire on the <button> and an alert to occur.  The alert does fire in the latest versions of Internet Explorer, Firefox, and Opera.

Actual:
The click event does not fire.

This only seems to happen when HTML content is injected.  If I set the innerHTML of the <button> to a plain string the issue does not occur.
Comment 1 Alexander Shalamov 2013-03-22 01:10:34 PDT
(In reply to comment #0)
> This only seems to happen when HTML content is injected.  If I set the innerHTML of the <button> to a plain string the issue does not occur.

The issue is not related to setting html / plain text content to a button. The problem is that mouse press and release events received by different elements of the button and click event is not sent. I have a patch that I'm testing at the moment. Will upload it when I'm sure that none of layout tests are failing with my modifications.
Comment 2 Lucas Forschler 2019-02-06 09:18:55 PST
Mass move bugs into the DOM component.
Comment 3 Ahmad Saleem 2022-09-17 00:04:24 PDT
All browsers results:

*** Safari Technology Preview 153 ***

Upon clicking while the input field is focused, the button change from "initial" to "changed" but no event is fired or dialog box appear but upon second click, it does show and have "click" alert.

*** Firefox Nightly 106 ***

No second click, upon first the button change from "initial" to "changed" and show "click" alert box.

*** Chrome Canary 107 ***

No second click, upon first the button change from "initial" to "changed" and show "click" alert box.

______

Changing status to "New" and CCing some Webkit Engineer to confirm my testing. Thanks!
Comment 4 Radar WebKit Bug Importer 2022-09-19 09:46:31 PDT
<rdar://problem/100126473>