Улучшения предлагаемого параметра <permission> элемент

Thomas Steiner

Опубликовано: 12 мая 2025 г.

Предлагаемый HTML-элемент <permission> всё ещё находится в стадии тестирования, поскольку команда Chrome дорабатывает его, основываясь на фундаменте, заложенном в ходе нашего первоначального тестирования . В этой публикации представлены улучшения, призванные обеспечить большую гибкость и контроль при запросе разрешений в веб-приложениях. Подробный обзор введения элемента <permission> и его первоначальных возможностей см. в нашей предыдущей статье «Тестирование нового HTML-элемента <permission> в стадии тестирования» .

Поддержка контента для резервного UX

Элемент <permission> изначально определялся как пустой элемент без содержимого до Chrome 136. Начиная с Chrome 137 он поддерживает содержимое, что означает, что теперь его необходимо размечать открывающими и закрывающими тегами:

<permission>
  <!-- optional content -->
</permission>

Это изменение позволяет включать резервные пользовательские интерфейсы в содержимое элемента. Эти резервные интерфейсы отображаются в браузерах, не поддерживающих элемент <permission> , или при указании неподдерживаемого атрибута type . Это обеспечивает более плавное снижение производительности и улучшенный пользовательский интерфейс в различных браузерных средах.

<!-- Invalid `type` attribute value -->
<permission type="not-supported">
  <p>Your browser does not support the specified <code>type</code>.</p>
</permission>

Более детальное обнаружение программных функций

Чтобы помочь вам определить поддержку конкретных типов разрешений, мы ввели статический метод isTypeSupported() :

HTMLPermissionElement.isTypeSupported('geolocation');

Этот метод возвращает логическое значение, указывающее, поддерживается ли указанный тип разрешения. В сочетании с существующим определением функции typeof HTMLPermissionElement !== 'undefined' теперь вы можете программно обеспечить как поддержку элемента <permission> , так и поддержку определённых типов разрешений.

Обратите внимание, что вы также можете передать несколько типов разрешений, разделённых пробелами (например, "camera microphone" ), и функция вернёт, является ли вся строка допустимым значением "type" . Например, вызов isTypeSupported() со следующими параметрами вернёт следующие результаты:

• "camera" → true
• "geolocation" → true
• "camera geolocation" → false (Хотя типы по отдельности поддерживаются, их комбинация — нет.)

Обновленные названия событий

В Chrome 136 мы представили два новых события взамен предыдущих:

• onpromptdismiss (заменяет ondismiss )
• onpromptaction (заменяет onresolve )

Эти новые события обеспечивают более чёткую семантику и лучше соответствуют поведению элемента. Старые события будут объявлены устаревшими в Chrome 138, поэтому мы рекомендуем обновить обработчики событий соответствующим образом.

Поддержка иконок

Мы работаем над включением поддержки значков в элемент <permission> , ориентированном на Chrome 138. Эта функция позволит отображать предопределенные значки, соответствующие типу разрешения, с ограниченными возможностями настройки стиля, такими как настройка цвета и размера. Точные детали API пока уточняются.

В следующих примерах показан вариант по умолчанию, другой цвет заливки и отсутствие заливки, но с черным контуром.

Стиль по умолчанию

Цвет значка по умолчанию совпадает с цветом текста элемента разрешения.

Измененный стиль

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

Изменение цвета значка

::permission-icon {
  fill: black;
}

Изменение контура значка

::permission-icon {
  fill: white;
  stroke: black;
  stroke-width: 20px;
}

Отключить значок

После запуска значок будет включён по умолчанию. Если вы хотите отключить значок, это можно сделать с помощью следующего CSS-кода.

::permission-icon {
  display: none;
}

Руководство по стилю

Подробные рекомендации по оформлению элемента <permission> , включая рекомендации и ограничения, см. в руководстве по оформлению элемента <permission> . Этот ресурс содержит подробные инструкции, которые помогут вам эффективно оформить элемент в ваших приложениях.

Расширенная поддержка платформы и возможностей

Элемент <permission> теперь поддерживает дополнительные платформы и возможности:

• Поддержка Android: элемент теперь функционирует на устройствах Android, что расширяет его применимость на различных пользовательских платформах.
• Поддержка геолокации: теперь вы можете запросить разрешения type="geolocation" с помощью элемента <permission> с дополнительным логическим атрибутом preciselocation . Хотя атрибут preciselocation влияет только на формулировку запроса, мы активно работаем над разграничением разрешений на приблизительное и точное местоположение в будущих обновлениях.

Выводы

Эти улучшения элемента <permission> являются частью наших постоянных усилий по оптимизации запросов разрешений и улучшению пользовательского опыта в интернете. Мы призываем вас поэкспериментировать с этими новыми функциями и оставлять отзывы , которые помогут нам улучшить и развить эту возможность.