EPguy

[html/javascript] chrome 116 이후 disabled Input 클릭 시 버블링이 작동하지 않는 현상에 대하여 본문

개발/기타

[html/javascript] chrome 116 이후 disabled Input 클릭 시 버블링이 작동하지 않는 현상에 대하여

EPguy 2023. 9. 26. 15:35
<div id='wrapper' onclick='console.log("clicked");'>
    <input type='text' value='boo' disabled>
</div>

기존에는 위 코드처럼 input에 disabled 속성이 있어도 클릭하면 버블링이 되어 부모 태그에있는 onclick 이벤트가 발생하여 "clicked" 가 콘솔에 출력됐었다.

하지만 크롬 버전이 116으로 업데이트 된 이후 버블링이 되지않고있다.

크롬에서 의도적으로 업데이트를 한건지 버그인건지는 모르겠지만, 기존에는 잘 되는 코드가 갑자기 안되니 당황했었다. 사용자가 별로 없어서 다행이지 트래픽이 많은 서비스는 낭패를 봤을 듯 하다.

일단 임시방편으로 disabled 를 readonly로 바꾸면 버블링이 되긴하니 전부 readonly로 바꿨다.


https://support.google.com/chrome/thread/231546184/click-event-not-working-on-disabled-input?hl=en&sjid=1444235535563536770-AP
https://bugs.chromium.org/p/chromium/issues/detail?id=1477379&q=disabled%20input%20click&can=2