要素間でフォーカスを移したときblurイベントとfocusイベントは同期的に実行される

ChromeとFirefoxの最新版で確認済。仕様通りの挙動なのだろうか。

<input name="input1" />
<input name="input2" />

document.querySelectorAll('input').forEach((input) => {
  input.addEventListener('focus', (e) => {
    console.log(`Focus: ${e.target.name}`);
    setTimeout(() => {
      console.log(`Focus async: ${e.target.name}`);
    }, 0);
  });
  input.addEventListener('blur', (e) => {
    console.log(`Blur: ${e.target.name}`);
    setTimeout(() => {
      console.log(`Blur async: ${e.target.name}`);
    }, 0);
  })
})

input1からinput2にフォーカスを移したときのコンソール出力は

Blur: input1
Focus: input2
Blur async: input1
Focus async: input2

となっていた。

サンプル