תיבת דו-שיח לסגירת אמצעי הבקרה של הפלטפורמה

כשתיבת דו-שיח מודאלית פתוחה, המשתמשים מצפים להשתמש בפקדים מוכרים כדי לסגור אותה: לחיצה על מקש Esc במקלדת, שימוש בכפתור "הקודם" או בתנועה בפלטפורמות לנייד, או תנועת סגירה באמצעות טכנולוגיות מסייעות.

כשהרכיב <dialog> הוצג לראשונה, אפשר היה לסגור אותו באמצעות המקש Esc, אבל לא באמצעות אמצעי בקרה אחרים בפלטפורמה, כמו הכפתור "הקודם" או תנועה בנייד. עם הוספת המאפיין closedby לרכיבי <dialog>, ההתנהגות המורחבת של תגובה לפקדים נוספים ספציפיים לפלטפורמה לבקשות סגירה הוחלה על רכיבי <dialog> שנפתחים במצב מודאלי (כלומר, כשפותחים אותם באופן אימפרטיבי באמצעות השיטה showModal() של רכיב <dialog> ב-JavaScript או באופן דקלרטיבי באמצעות פקודת ה-invoker‏ 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, כך שאין צורך בגיבוי. אין דרך טובה להטמיע בקשות סגירה מהכפתור "הקודם" או מתנועות בנייד, ולכן פשוט יותר לאמץ את התכונה הזו כשיפור הדרגתי (progressive enhancement), במיוחד בהתחשב בכך שיש אמצעים כוללים אחרים לסגירת תיבת הדו-שיח המודאלית. באופן דומה, התנהגות של סגירה בלחיצה מחוץ לרכיב <dialog> באמצעות closedby="any" יכולה להיחשב כשיפור הדרגתי.