Новые типы цветов и цветовые пространства CSS, тригонометрические функции CSS и API переходов просмотра.
Если не указано иное, следующие изменения относятся к новейшей версии бета-канала Chrome для Android, ChromeOS, Linux, macOS и Windows. Узнайте больше о функциях, перечисленных здесь, по предоставленным ссылкам или из списка на ChromeStatus.com. Chrome 111 является бета-версией с 9 февраля 2023 года. Вы можете загрузить последнюю версию на Google.com для настольных компьютеров или в Google Play Store для Android.
CSS
Новые типы цветов и пространств CSS
Все функции, описанные в CSS Color Level 4, теперь включены. Сюда входят четыре аппаратно-независимых типа цвета (lab, Oklab, lch и Oklch), функция color() и определяемые пользователем цветовые пространства для градиентов и анимации.
Прочтите руководство по цветам CSS высокой четкости , чтобы узнать об этих новых типах цветов и пространствах.
Функция color-mix()
Невероятно полезная функция color-mix() из CSS Color 5 также уже в продаже. Эта функция позволяет смешивать процент одного цвета с другим в любом поддерживаемом цветовом пространстве. В следующем примере 10% blue смешивается с white в SRGB.
.item {
background-color: color-mix(in srgb, blue 10%, white);
}
CSS-селекторы 4. Псевдокласс :nth-child(an + b of S)
Расширяет :nth-child(an + b) и :nth-last-child() для получения селектора. Например, :nth-child(3 of .c) — это третий .c данного родителя. Чтобы узнать больше, прочитайте публикацию «Больше контроля над выбором :nth-child() с помощью синтаксиса of S .
Корневые единицы шрифта CSS
Добавляет единицы корневого шрифта: rex , rch , ric и rlh к существующей единице корневого шрифта rem .
Тригонометрические функции CSS
Тригонометрические функции sin() , cos() , tan() , asin() , acos() , atan() , atan2() были добавлены в математические выражения CSS.
Запросы контейнера стилей для пользовательских свойств CSS
Добавляет функцию style() в правила @container , чтобы можно было применять стили на основе вычисленных значений пользовательских свойств элемента-предка.
Свойство baseline-source
Свойство baseline-source позволяет веб-разработчикам указать, должен ли блок строкового уровня использовать first или last базовую линию для выравнивания внутри линейного блока.
Веб-API
Разрешение window-management и строка политики разрешений.
В Chrome 111 добавлено window-management в качестве псевдонима для разрешений window-placement и строк политики разрешений. Это часть более масштабных усилий по переименованию строк, в конечном итоге объявив их устаревшими и удалив window-placement . Изменение терминологии увеличивает срок службы дескриптора по мере развития API управления окнами.
API сеанса мультимедиа: действия по представлению слайдов
Добавляет действия previousslide и nextslide в существующий API сеанса мультимедиа.
Изменяемый размер ArrayBuffer и расширяемый SharedArrayBuffer
Расширьте конструкторы ArrayBuffer , чтобы получить дополнительную максимальную длину, которая позволяет увеличивать и уменьшать буферы на месте. Аналогично, SharedArrayBuffer расширяется, чтобы получить дополнительную максимальную длину, обеспечивающую рост на месте.
Правила спекуляции: ключ политики реферера
Это расширяет синтаксис правил спекуляции, позволяя разработчикам указывать политику реферера, которая будет использоваться со спекулятивными запросами, инициируемыми правилами спекуляции. Это также вновь вводит требование «достаточно строгой политики рефералов».
Потоковая декларативная теневая DOM
Это добавляет поддержку потоковой передачи за счет прикрепления теневого корня к открывающему, а не закрывающему тегу шаблона.
Просмотр API переходов
Позволяет создавать плавные переходы в одностраничных приложениях (SPA) путем создания моментальных снимков и позволяет DOM изменяться без какого-либо перекрытия между состояниями. Используйте View Transitions для создания пользовательских переходов или используйте простой кроссфейд по умолчанию, чтобы улучшить взаимодействие с пользователем.
Прочтите статью для разработчиков Chrome, чтобы получить дополнительную информацию и примеры переходов, которые помогут вам начать работу.
Расширения масштабируемого кодирования видео WebRTC
Это расширение определяет стандартный метод выбора между возможными конфигурациями масштабируемого видеокодирования (SVC) на исходящей видеодорожке WebRTC.
Атрибут WebXR enabledFeatures
Возвращает набор функций, которые были включены для этого XRSession , как указано в XRSessionInit , и подразумеваемые функции, требуемые спецификацией для данного режима и функций. Для предоставленного сеанса он будет содержать все requiredFeatures , но может быть подмножеством optionalFeatures . У большинства функций есть альтернативные способы определения того, были ли они предоставлены; однако для некоторых функций сигнал о том, была ли функция включена или нет, может быть тесно связан с данными о функции, которая просто недоступна в данный момент, а не с данными, которые никогда не будут доступны. Запросив enabledFeatures , вы можете определить, должны ли отображаться какие-либо полезные подсказки (например, по улучшению или началу отслеживания) или функция никогда не будет поддерживаться в текущем сеансе.
Испытания происхождения продолжаются
В Chrome 111 вы можете принять участие в следующих новых пробных версиях Origin .
Пробная версия устаревшей версии для удаления обхода CSP connect-src в API веб-платежей
Устарела возможность API веб-платежей обходить политику CSP connect-src при получении манифеста. После прекращения поддержки политика CSP Connect-Src сайта должна будет разрешать URL-адрес метода оплаты, указанный в вызове PaymentRequest, а также любые другие URL-адреса, которые метод объединяет для получения своего манифеста.
Эта возможность обхода удалена в Chrome 111 с помощью пробной версии обратного происхождения со 111 на 113 для тех разработчиков, которым необходимо временно повторно включить обход. Чтобы принять это решение, зарегистрируйтесь для участия в пробной версии обратного прекращения поддержки обхода CSP connect-src .
Документ «картинка в картинке»
API Document Picture-in-Picture — это новый API, позволяющий открывать постоянное окно, которое можно заполнить произвольным HTML-содержимым. Это расширение существующего API «Картинка в картинке», которое позволяет помещать в окно PiP только элемент HTMLVideoElement. Это позволяет веб-разработчикам предоставлять пользователям лучший опыт работы с PiP.
Прочтите документацию по документу «Картинка в картинке» .
Зарегистрируйтесь для участия в пробной версии Document Picture-In-Picture .
Прекращение поддержки и удаление
В этой версии Chrome представлены устаревшие и удаленные версии, перечисленные ниже. Посетите ChromeStatus.com, чтобы просмотреть списки запланированных, текущих и предыдущих удалений.
В этом выпуске Chrome удалены три функции.
Удалить платежные инструменты
PaymentInstruments — это веб-API, который поддерживает установку платежных приложений без JIT (см. https://w3c.github.io/pay-handler/). Он был разработан с предположением, что браузер будет хранить фактические данные платежного инструмента, что не оказалось правдой и имеет некоторые утечки конфиденциальности. Он также не поставляется ни в один другой браузер, и мы не заметили никакого интереса со стороны других поставщиков браузеров. Таким образом, этот API устарел и удален .
Удалить обход CSP connect-src в API веб-платежей
Устарела возможность API веб-платежей обходить политику CSP connect-src при получении манифеста . После этого удаления политика CSP connect-src сайта должна будет разрешить URL-адрес метода оплаты, указанный в вызове PaymentRequest, а также любые другие URL-адреса, которые метод объединяет для получения своего манифеста.
См. информацию в разделе «Исходные пробные версии», чтобы узнать о способе участия в пробной версии устаревания, дающей больше времени для внесения необходимых изменений в связи с этим удалением.
Личность продавца в событии canmakepayment
Событие рабочего сервиса canmakepayment позволяет продавцу узнать, есть ли у пользователя карта в установленном платежном приложении. Раньше он молча передавал происхождение продавца и произвольные данные работнику службы из источника платежного приложения. Это взаимодействие между источниками происходило при создании PaymentRequest в JavaScript, не требовало жестов пользователя и не отображало никакого пользовательского интерфейса. Этот тихий проход данных был удален из события canmakepayment и намерения Android IS_READY_TO_PAY ) .