Changeset 59089

Timestamp:

09/25/2024 04:49:01 PM (2 years ago)

Author:

czapla

Message:

Script Loader: Add @wordpress/a11y as a Script Module.

The Script Module has the same API as the wp-a11y WP Script.

Key changes:

• Add @wordpress/a11y to the list of Script and Module dual packages.
• Update script-modules-packages.min.php to include the a11y module.
• Modify WP_Script_Modules class to track and handle a11y module availability.
• Add method to print required HTML markup for a11y speak() functionality.

See #60647.
Props jonsurrell, gziolo, czapla.

Location:

trunk

Files:

• src/wp-includes/assets/script-modules-packages.min.php (modified) (1 diff)
• src/wp-includes/class-wp-script-modules.php (modified) (4 diffs)
• tools/webpack/shared.js (modified) (1 diff)

trunk/src/wp-includes/assets/script-modules-packages.min.php

@@ -1 @@
-<?php return array('interactivity/index.min.js' => array('dependencies' => array(), 'version' => '2d6d1fdbcb3fda39c768', 'type' => 'module'), 'interactivity/debug.min.js' => array('dependencies' => array(), 'version' => '1ccc67b05c275e51a8f8', 'type' => 'module'), 'interactivity-router/index.min.js' => array('dependencies' => array('@wordpress/interactivity'), 'version' => '64645ef3cd2d32860d7d', 'type' => 'module'), 'block-library/file/view.min.js' => array('dependencies' => array('@wordpress/interactivity'), 'version' => 'fdc2f6842e015af83140', 'type' => 'module'), 'block-library/image/view.min.js' => array('dependencies' => array('@wordpress/interactivity'), 'version' => 'acfec7b3c0be4a859b31', 'type' => 'module'), 'block-library/navigation/view.min.js' => array('dependencies' => array('@wordpress/interactivity'), 'version' => '8ff192874fc8910a284c', 'type' => 'module'), 'block-library/query/view.min.js' => array('dependencies' => array('@wordpress/interactivity', array('id' => '@wordpress/interactivity-router', 'import' => 'dynamic')), 'version' => 'f4c91c89fa5271f3dad9', 'type' => 'module'), 'block-library/search/view.min.js' => array('dependencies' => array('@wordpress/interactivity'), 'version' => '2a73400a693958f604de', 'type' => 'module'));
+<?php return array('interactivity/index.min.js' => array('dependencies' => array(), 'version' => '2d6d1fdbcb3fda39c768', 'type' => 'module'), 'interactivity/debug.min.js' => array('dependencies' => array(), 'version' => '1ccc67b05c275e51a8f8', 'type' => 'module'), 'interactivity-router/index.min.js' => array('dependencies' => array('@wordpress/interactivity'), 'version' => '64645ef3cd2d32860d7d', 'type' => 'module'), 'a11y/index.min.js' => array('dependencies' => array(), 'version' => 'b7d06936b8bc23cff2ad', 'type' => 'module'), 'block-library/file/view.min.js' => array('dependencies' => array('@wordpress/interactivity'), 'version' => 'fdc2f6842e015af83140', 'type' => 'module'), 'block-library/image/view.min.js' => array('dependencies' => array('@wordpress/interactivity'), 'version' => 'acfec7b3c0be4a859b31', 'type' => 'module'), 'block-library/navigation/view.min.js' => array('dependencies' => array('@wordpress/interactivity'), 'version' => '8ff192874fc8910a284c', 'type' => 'module'), 'block-library/query/view.min.js' => array('dependencies' => array('@wordpress/interactivity', array('id' => '@wordpress/interactivity-router', 'import' => 'dynamic')), 'version' => 'f4c91c89fa5271f3dad9', 'type' => 'module'), 'block-library/search/view.min.js' => array('dependencies' => array('@wordpress/interactivity'), 'version' => '2a73400a693958f604de', 'type' => 'module'));

trunk/src/wp-includes/class-wp-script-modules.php

@@ -30 +30 @@
          */
         private $enqueued_before_registered = array();
+
+        /**
+         * Tracks whether the @wordpress/a11y script module is available.
+         *
+         * Some additional HTML is required on the page for the module to work. Track
+         * whether it's available to print at the appropriate time.
+         *
+         * @since 6.7.0
+         * @var bool
+         */
+        private $a11y_available = false;
 
         /**
@@ -186 +197 @@
                 add_action( 'wp_footer', array( $this, 'print_script_module_data' ) );
                 add_action( 'admin_print_footer_scripts', array( $this, 'print_script_module_data' ) );
+                add_action( 'wp_footer', array( $this, 'print_a11y_script_module_html' ), 20 );
+                add_action( 'admin_print_footer_scripts', array( $this, 'print_a11y_script_module_html' ), 20 );
         }
 
@@ -368 +381 @@
                 $modules = array();
                 foreach ( array_keys( $this->get_marked_for_enqueue() ) as $id ) {
+                        if ( '@wordpress/a11y' === $id ) {
+                                $this->a11y_available = true;
+                        }
                         $modules[ $id ] = true;
                 }
                 foreach ( array_keys( $this->get_import_map()['imports'] ) as $id ) {
+                        if ( '@wordpress/a11y' === $id ) {
+                                $this->a11y_available = true;
+                        }
                         $modules[ $id ] = true;
                 }
@@ -466 +485 @@
                 }
         }
+
+        /**
+         * @access private This is only intended to be called by the registered actions.
+         *
+         * @since 6.7.0
+         */
+        public function print_a11y_script_module_html() {
+                if ( ! $this->a11y_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' ) . '</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>';
+        }
 }

trunk/tools/webpack/shared.js

@@ -104 +104 @@
 ];
 const SCRIPT_AND_MODULE_DUAL_PACKAGES = [
+        '@wordpress/a11y',
         '@wordpress/block-library',
 ];