Search code examples
javascripthtmlsafarionclickfocus

Why Safari doesn't set `<button>` as `document.activeElement` after clicking it?


This simple code

<button onclick="console.log(document.activeElement)">
  console.log(document.activeElement)
</button>

logs <button> in Chrome and Firefox, but Safari for some weird reason doesn't set focus on <button> and logs <body>

What's wrong with Safari? My expectation is that click on button should make it focused.

Safari version: 14.1.1 (latest) on macOS 11.4


Solution

  • While <button> is a focusable element, it doesn't get focus after clicking on it in Safari/Firefox on macOS:

    enter image description here

    This seems to be intentional behavior and won't be changed. Read more here: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#clicking_and_focus