Лучше поздно, чем никогда: две особенности iOS 13
#qa #frontend

С момента официального релиза Apple iOS 13 по статистике «новая» ОС установлена более чем на 70% поддерживаемых устройств. В этой заметке мы расскажем о двух актуальных для веб-разработчиков особенностях системы, которые вы могли не заметить 😎

Теперь сложно найти рубль 😂
Разработчики iOS 13 стали более строго относиться к отсутствующим символам в шрифтах.

Например, пользователи русскоязычного сегмента интернета после обновления заметили исчезновение символа рубля на некоторых сайтах. Вместо него может отображаться непонятный прямоугольник. Всему виной отсутствие соответствующего глифа в используемых на злополучных сайтах шрифтах.

В прежних версиях iOS поиск отсутствующих символов производился по другим установленным в системе шрифтам. И чаще всего пропажа находилась. В связи с чем найденные глифы могли по-разному отображаться на различных устройствах/браузерах, что доставляло боль QA-инженеру и искушенному пользователю 😱 В iOS 13 от такого поведения случайно или намеренно отказались.

Проблему можно решить самостоятельным редактированием шрифта или более просто — указать в css семейство системных шрифтов.

Say my name
Планшетная версия iOS 13 была переименована в iPadOS 13. Это обусловлено желанием Apple продвигать новые iPad как полноценную замену ПК. В связи с этим заголовок User-Agent http-запроса идентифицирует клиентское устройство как MacOS:

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Safari/605.1.15

В этих условиях отличить iPad от десктопа становится затруднительно, но возможно. Например, так:

const isAppleTouchDevice =
      /(iphone|ipad|ipod)/i.test(navigator.userAgent) ||
      (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1);

В JS-коде именно второе условие, после логического «или», проверяет устройство на наличие iPadOS на борту.