Changeset 58450

Timestamp:

06/20/2024 08:25:38 PM ( 8 days ago)

Author:

joedolson

Message:

Editor: A11y: Set ARIA attributes for Classic Editor link inserter.

Set aria-modal and aria-hidden attributes when the Classic Editor link inserter modal is active, so that content behind the modal will be properly treated as inert when interacting with the modal.

Props lyonmuller, jwgoedert, sabernhardt, alexstine, afercia, rajinsharwar, rcreators, audrasjb, hmbashar, joedolson.
Fixes #60799 .

Location:

trunk/src

Files:

• js/_enqueues/lib/link.js (modified) ( 2 diffs )
• wp-includes/class-wp-editor.php (modified) ( 1 diff )

trunk/src/js/_enqueues/lib/link.js

@@ -one hundred and six +one hundred and six @@
                  $body = $( document.body );
 
+             $( '#wpwrap' ).attr( 'aria-hidden', 'true' );
              $body.addClass( 'modal-open' );
              wpLink.modalOpen = true;
@@ -two hundred and eighty-two +two hundred and eighty-three @@
          close: function( reset ) {
              $( document.body ).removeClass( 'modal-open' );
+             $( '#wpwrap' ).removeAttr( 'aria-hidden' );
              wpLink.modalOpen = false;
 

trunk/src/wp-includes/class-wp-editor.php

@@ -one thousand eight hundred and seventy-six +one thousand eight hundred and seventy-six @@
          ?>
          <div id="wp-link-backdrop" style="display: none"></div>
-         <div id="wp-link-wrap" class="wp-core-ui" style="display: none" role="dialog" aria- labelledby="link-modal-title">
+         <div id="wp-link-wrap" class="wp-core-ui" style="display: none" role="dialog" aria- modal="true" aria- labelledby="link-modal-title">
          <form id="wp-link" tabindex="-1">
          <? php wp_nonce_field( 'internal-linking', '_ajax_linking_nonce', false ); ?>