Эта статья — перевод оригинальной статьи "New in Chrome 119".

Также я веду телеграм канал “Frontend по-флотски”, где рассказываю про интересные вещи из мира разработки интерфейсов.

Срок действия cookie

Начиная с Chrome 104 для вновь созданных или обновленных файлов cookie с указанием даты истечения срока действия действует ограничение - не более 400 дней. Теперь это ограничение будет применено к уже хранящимся файлам cookie задним числом.

После первого запуска Chrome 119+ и однократного переноса базы данных срок действия этих файлов будет ограничен до 400 дней. Влияние этого изменения пользователи смогут ощутить не ранее чем через 400 дней после выхода Chrome 119, и то только для существующих файлов cookie, которые не были обновлены за это время.

Более подробно о рекомендации по срокам действия можно прочитать здесь, а сейчас - дружеское напоминание о том, что в ближайшем будущем сторонние файлы cookie будут устаревшими, и руководство по подготовке к этому.

Обновления CSS

Для CSS мы имеем три обновления:

Первое: новые псевдоклассы :user-invalid и :user-valid, которые представляют элемент с неправильным или правильным вводом, соответственно, но только после того, как пользователь взаимодействовал с ним. Они аналогичны псевдоклассам :valid и :invalid, но с дополнительным ограничением, что новые псевдоклассы применяются только после того, как пользователь взаимодействовал с элементом.

Второе: синтаксис относительных цветов позволяет разработчикам задавать цвета, изменяя параметры других цветов.

Например: oklab(from magenta calc(l * 0.8) a b); приводит к тому, что пурпурный цвет Oklab становится на 80% светлее.

И третье: свойство clip-path теперь поддерживает больше значений.

Свойство clip-path создает область обрезки, которая задает, какая часть элемента должна быть показана. Части, находящиеся внутри области, отображаются, а те, что за ее пределами, скрываются.

Теперь можно использовать значения <geometry-box> для управления ссылочной рамкой клипа, что упрощает использование clip-path. Эти значения box можно использовать вместе с базовыми шейпами (например, clip-path: circle(50%) margin-box) или отдельно для привязки к заданному боксу (например, clip-path: content-box).

Также можно использовать функции xywh() и rect(), которые облегчают создание прямоугольных или округло-прямоугольных клипов.

Улучшение Fenced frames

Fenced Frame - это HTML-элемент для встраиваемого содержимого, аналогичный iframe. В отличие от iframe, Fenced Frame ограничивает связь с контекстом встраивания, что позволяет фрейму получить доступ к межсайтовым данным без обмена с контекстом встраивания.

В этой версии Fenced Frames добавлена дополнительная опция формата для размера объявлений Protected Audience. Теперь в API Protected Audience появилась возможность вставлять в url объявления макрос размера объявления, например: https://ad.com?width={/%AD_WIDTH%}&height={/%AD_HEIGHT%}.

Кроме того, автоматические маячки теперь будут отправляться по всем зарегистрированным URL. Ранее автоматические маячки получали только те пункты назначения, которые были указаны при вызове setReportEventDataForAutomaticBeacons(), даже если этот пункт назначения вызывал в своем worklet'е функцию registerAdBeacon().

Теперь любой пункт назначения, вызвавший registerAdBeacon() для reserved.top_navigation, получит автоматический маячок, но только пункты назначения, указанные в setReportEventDataForAutomaticBeacons(), получат данные автоматического маячка вместе с маячком.

И ещё!

Конечно, есть и ещё.

• WebSQL полностью удаляется начиная с Chrome 119.

• Теперь опция monitorTypeSurfaces может быть использована для предотвращения шейринга пользователем всего экрана с помощью функции getDisplayMedia()

• Версия, которая добавляет в JavaScript API window.open() параметр fullscreen. Этот параметр позволяет открывать всплывающее окно в полноэкранном режиме.