Skip to content

A11y: Move script module HTML printing to 6.7 compat #65620

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
sirreal merged 1 commit into from
Sep 26, 2024
Merged

A11y: Move script module HTML printing to 6.7 compat #65620

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Move a11y HTML printing code to 6.7 compat directory 
This code is needed for compatibility with WordPress < 6.7.
The filter should only be registered if the Core filter will not run,
otherwise redundant elements are printed.

See:

WordPress/wordpress-develop#7405
  • Loading branch information
@sirreal
sirreal committed Sep 25, 2024
commit e4b36b1da12d02b85f2601a31f8c24bf07673094
43 changes: 43 additions & 0 deletions lib/compat/wordpress-6.7/script-modules.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -102,3 +102,46 @@ function () {
},
20
);

/**
* Prints HTML for the a11y Script Module.
*
* a11y relies on some DOM elements to use as ARIA live regions.
* Ideally, these elements are part of the initial HTML of the page
* so that accessibility tools can find them and observe updates.
*/
function gutenberg_a11y_script_module_html() {
$a11y_module_available = false;

$get_marked_for_enqueue = new ReflectionMethod( 'WP_Script_Modules', 'get_marked_for_enqueue' );
$get_marked_for_enqueue->setAccessible( true );
$get_import_map = new ReflectionMethod( 'WP_Script_Modules', 'get_import_map' );
$get_import_map->setAccessible( true );

foreach ( array_keys( $get_marked_for_enqueue->invoke( wp_script_modules() ) ) as $id ) {
if ( '@wordpress/a11y' === $id ) {
$a11y_module_available = true;
break;
}
}
if ( ! $a11y_module_available ) {
foreach ( array_keys( $get_import_map->invoke( wp_script_modules() )['imports'] ) as $id ) {
if ( '@wordpress/a11y' === $id ) {
$a11y_module_available = true;
break;
}
}
}
if ( ! $a11y_module_available ) {
return;
}
echo '<div style="position:absolute;margin:-1px;padding:0;height:1px;width:1px;overflow:hidden;clip-path:inset(50%);border:0;word-wrap:normal !important;">'
. '<p id="a11y-speak-intro-text" class="a11y-speak-intro-text" hidden>' . esc_html__( 'Notifications', 'default' ) . '</p>'
. '<div id="a11y-speak-assertive" class="a11y-speak-region" aria-live="assertive" aria-relevant="additions text" aria-atomic="true"></div>'
. '<div id="a11y-speak-polite" class="a11y-speak-region" aria-live="polite" aria-relevant="additions text" aria-atomic="true"></div>'
. '</div>';
}
if ( ! method_exists( 'WP_Script_Modules', 'print_a11y_script_module_html' ) ) {
add_action( 'wp_footer', 'gutenberg_a11y_script_module_html' );
add_action( 'admin_footer', 'gutenberg_a11y_script_module_html' );
}
41 changes: 0 additions & 41 deletions lib/experimental/script-modules.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -200,44 +200,3 @@ function gutenberg_dequeue_module( $module_identifier ) {
_deprecated_function( __FUNCTION__, 'Gutenberg 17.6.0', 'wp_dequeue_script_module' );
wp_script_modules()->dequeue( $module_identifier );
}

/**
* Prints HTML for the a11y Script Module.
*
* a11y relies on some DOM elements to use as ARIA live regions.
* Ideally, these elements are part of the initial HTML of the page
* so that accessibility tools can find them and observe updates.
*/
function gutenberg_a11y_script_module_html() {
$a11y_module_available = false;

$get_marked_for_enqueue = new ReflectionMethod( 'WP_Script_Modules', 'get_marked_for_enqueue' );
$get_marked_for_enqueue->setAccessible( true );
$get_import_map = new ReflectionMethod( 'WP_Script_Modules', 'get_import_map' );
$get_import_map->setAccessible( true );

foreach ( array_keys( $get_marked_for_enqueue->invoke( wp_script_modules() ) ) as $id ) {
if ( '@wordpress/a11y' === $id ) {
$a11y_module_available = true;
break;
}
}
if ( ! $a11y_module_available ) {
foreach ( array_keys( $get_import_map->invoke( wp_script_modules() )['imports'] ) as $id ) {
if ( '@wordpress/a11y' === $id ) {
$a11y_module_available = true;
break;
}
}
}
if ( ! $a11y_module_available ) {
return;
}
echo '<div style="position:absolute;margin:-1px;padding:0;height:1px;width:1px;overflow:hidden;clip-path:inset(50%);border:0;word-wrap:normal !important;">'
. '<p id="a11y-speak-intro-text" class="a11y-speak-intro-text" hidden>' . esc_html__( 'Notifications', 'default' ) . '</p>'
. '<div id="a11y-speak-assertive" class="a11y-speak-region" aria-live="assertive" aria-relevant="additions text" aria-atomic="true"></div>'
. '<div id="a11y-speak-polite" class="a11y-speak-region" aria-live="polite" aria-relevant="additions text" aria-atomic="true"></div>'
. '</div>';
}
add_action( 'wp_footer', 'gutenberg_a11y_script_module_html' );
add_action( 'admin_footer', 'gutenberg_a11y_script_module_html' );