#frontend
Как известно, современные браузеры не позволяют автоматически проигрывать видео в HTML5-теге
<video>, если оно содержит звук или тег не имеет атрибута muted. На этот случай есть некоторые исключения.Но в Apple iOS пользователей и разработчиков ждет еще один сюрприз, связанный с автопроигрыванием видео. Имя ему — Low Power Mode. При включенном режиме энергосбережения пользователь вместо автоматического проигрывания наблюдает большую серую кнопку Play на видеоблоке. Такой режим включается автоматически при достижении определенного уровня заряда батареи или принудительно, в настройках девайса. Индикатор заряда устройства окрасится в желтый цвет, а все видеоролики на сайтах по умолчанию будут стоять на паузе, даже если не содержат звуковой дорожки.
Обыграть проблему можно с помощью вывода изображения-заглушки поверх плеера, а также скрыв картинку по факту запуска видео, подписавшись на событие
play. Например, вот так.Также можно отрисовать свою собственную кнопку ▶️ или даже реализовать обработку события
touchstart у элемента body и запускать видео при касании экрана.На просторах интернета можно найти больше примеров реализации автопроигрывания видео в режиме энергосбережения iOS.
Чтобы ваш клиент и QA-инженеры были довольны на 100%, предусматривайте описанную ситуацию в своем коде, особенно когда видеоролики являются фоновыми для блоков на странице.
