Когда модальное диалоговое окно открыто, пользователи ожидают, что смогут закрыть его привычными способами: нажав клавишу Esc на клавиатуре, кнопку "Назад" или жест на мобильных платформах или жест закрытия с помощью технологии специальных возможностей.
Когда элемент <dialog> был впервые представлен, его можно было закрыть с помощью клавиши Esc, но не с помощью других элементов управления платформы, таких как кнопка "Назад"/жест на мобильном устройстве. С добавлением атрибута closedby для элементов <dialog> расширенное поведение, позволяющее реагировать на большее количество элементов управления, связанных с платформой, для запросов на закрытие, было применено к элементам <dialog>, которые открываются в модальном состоянии (т.е. когда они открываются императивно с помощью метода showModal() элемента <dialog> в JavaScript или декларативно с помощью команды вызова show-modal). Поэтому разработчикам, которые уже используют элемент <dialog>, не нужно ничего менять.
<!-- MANDATORY: must be opened with either `showModal()` with JavaScript or the `show-modal` command using declarative command invokers in order respond to close requests including platform-specific controls. -->
<dialog aria-labelledby="example">
<h1 id="example">Example</h1>
<p>Modal that can be dismissed with close requests.</p>
</dialog>
Если диалоговое окно без атрибута closedby открыто в модальном режиме, оно реагирует на запросы закрытия так же, как если бы атрибут closedby имел значение closerequest.
<!-- This is unnecessary as it is the default behavior for modal dialogs -->
<dialog closedby="closerequest" aria-labelledby="example">
<h1 id="example">Example</h1>
<p>Modal that can be dismissed with close requests.</p>
</dialog>
Если вы также хотите, чтобы окно закрывалось при нажатии за его пределами, задайте для closedby значение any:
<dialog closedby="any" aria-labelledby="example">
<h1 id="example">Example</h1>
<p>Modal that can be dismissed with close requests and light dismiss.</p>
</dialog>
Резервные стратегии
Элементы <dialog>, открытые в модальном состоянии, уже можно закрыть с помощью клавиши Esc, поэтому резервный вариант не требуется. Нет хорошего способа реализовать запросы на закрытие с помощью кнопки "Назад" или жестов на мобильных устройствах, поэтому проще использовать эту функцию как прогрессивное улучшение, тем более что есть другие способы закрыть модальное диалоговое окно. Аналогично, поведение легкого отклонения для элемента <dialog> с использованием closedby="any" можно считать прогрессивным улучшением.