Как отменить стандартное действие на ESC в Safari?

Question

[Дмитрий Щ]

При использовании Safari в полноэкранном режиме и при нажатии клавиши "Esc" сначала происходит выход из фуллскрин режима и только при повторном нажатии срабатывает стандартное событие keyup. Как это можно победить?
Для примера на модалке https://codepen.io/DmitrySheklein/pen/VwWNYoj

У auto.ru это как-то получилось (если открывать и закрывать карусель фото автомобиля), но в коде не нашел фикса этой проблемы.
https://auto.ru/review/cars/toyota/verso/8507941/8...

Система macOS Big Sur 11.6

Answer 1

[Sergei Nazarenko]

document.onkeydown = function (evt) {
    if (evt.keyCode == 27) evt.preventDefault();
  document.querySelector('.modal').classList.remove('show')
}

или

const handleEscClose = evt => {
  if (evt.keyCode == 27) {
    evt.preventDefault();
    document.querySelector('.modal').classList.remove('show')
  }
};
document.addEventListener('keydown', handleEscClose);

Comments

[Дмитрий Щ]

 Благодарю, 2й вариант отлично подошел и работает в сафари

[Дмитрий Щ]

Sergei Nazarenko единственное, судя по learnjs: https://learn.javascript.ru/keyboard-events#dela-m... свойство "event.keyCode" является устаревшим, советуют использовать "event.key". Или это только Safari такой особенный?)

[Sergei Nazarenko]

ну я не знал что keyCode is deprecated, я просто скопировал это из интернета. Можно и нужно использовать key (если конечно не нужна поддержка каких то древних браузеров) и это работает в safari. Но дело не в этом, там весь фокус в том, что нужно использовать событие keydown тогда как вы использовали keyup поэтому и не работало. Потому как выход из полноэкранного режима в macOS происходит именно по keydown и его нужно перехватить и обработать.