diff --git a/src/wp-includes/interactivity-api/class-wp-interactivity-api.php b/src/wp-includes/interactivity-api/class-wp-interactivity-api.php
index 1213a5c097440..e4dec8e262381 100644
--- a/src/wp-includes/interactivity-api/class-wp-interactivity-api.php
+++ b/src/wp-includes/interactivity-api/class-wp-interactivity-api.php
@@ -199,6 +199,26 @@ public function print_client_interactivity_data() {
_deprecated_function( __METHOD__, '6.7.0' );
}
+ /**
+ * Set client-side interactivity-router data.
+ *
+ * Once in the browser, the state will be parsed and used to hydrate the client-side
+ * interactivity stores and the configuration will be available using a `getConfig` utility.
+ *
+ * @since 6.7.0
+ *
+ * @param array $data Data to filter.
+ * @return array Data for the Interactivity Router script module.
+ */
+ public function filter_script_module_interactivity_router_data( array $data ): array {
+ if ( ! isset( $data['i18n'] ) ) {
+ $data['i18n'] = array();
+ }
+ $data['i18n']['loading'] = __( 'Loading page, please wait.' );
+ $data['i18n']['loaded'] = __( 'Page Loaded.' );
+ return $data;
+ }
+
/**
* Set client-side interactivity data.
*
@@ -296,6 +316,7 @@ public function register_script_modules() {
*/
public function add_hooks() {
add_filter( 'script_module_data_@wordpress/interactivity', array( $this, 'filter_script_module_interactivity_data' ) );
+ add_filter( 'script_module_data_@wordpress/interactivity-router', array( $this, 'filter_script_module_interactivity_router_data' ) );
}
/**
@@ -973,16 +994,14 @@ private function get_router_animation_styles(): string {
}
/**
- * Outputs the markup for the top loading indicator and the screen reader
- * notifications during client-side navigations.
+ * Outputs markup for the @wordpress/interactivity-router script module.
*
* This method prints a div element representing a loading bar visible during
- * navigation, as well as an aria-live region that can be read by screen
- * readers to announce navigation status.
+ * navigation.
*
- * @since 6.5.0
+ * @since 6.7.0
*/
- public function print_router_loading_and_screen_reader_markup() {
+ public function print_router_markup() {
echo <<
-
HTML;
}
@@ -1016,16 +1029,16 @@ private function data_wp_router_region_processor( WP_Interactivity_API_Directive
if ( 'enter' === $mode && ! $this->has_processed_router_region ) {
$this->has_processed_router_region = true;
- // Initialize the `core/router` store.
+ /*
+ * Initialize the `core/router` store.
+ * If the store is not initialized like this with minimal
+ * navigation object, the interactivity-router script module
+ * errors.
+ */
$this->state(
'core/router',
array(
- 'navigation' => array(
- 'texts' => array(
- 'loading' => __( 'Loading page, please wait.' ),
- 'loaded' => __( 'Page Loaded.' ),
- ),
- ),
+ 'navigation' => new stdClass(),
)
);
@@ -1035,7 +1048,7 @@ private function data_wp_router_region_processor( WP_Interactivity_API_Directive
wp_enqueue_style( 'wp-interactivity-router-animations' );
// Adds the necessary markup to the footer.
- add_action( 'wp_footer', array( $this, 'print_router_loading_and_screen_reader_markup' ) );
+ add_action( 'wp_footer', array( $this, 'print_router_markup' ) );
}
}
diff --git a/tests/phpunit/tests/interactivity-api/wpInteractivityAPI-wp-router-region.php b/tests/phpunit/tests/interactivity-api/wpInteractivityAPI-wp-router-region.php
index 8d8cdb6228d2e..d6deab48ab141 100644
--- a/tests/phpunit/tests/interactivity-api/wpInteractivityAPI-wp-router-region.php
+++ b/tests/phpunit/tests/interactivity-api/wpInteractivityAPI-wp-router-region.php
@@ -102,7 +102,7 @@ public function test_wp_router_region_missing() {
*
* @covers ::process_directives
*/
- public function test_wp_router_region_adds_loading_bar_aria_live_region_only_once() {
+ public function test_wp_router_region_adds_loading_bar_region_only_once() {
$html = '
Interactive region
Another interactive region
@@ -125,9 +125,5 @@ public function test_wp_router_region_adds_loading_bar_aria_live_region_only_onc
$p = new WP_HTML_Tag_Processor( $footer );
$this->assertTrue( $p->next_tag( $query ) );
$this->assertFalse( $p->next_tag( $query ) );
- $query = array( 'class_name' => 'screen-reader-text' );
- $p = new WP_HTML_Tag_Processor( $footer );
- $this->assertTrue( $p->next_tag( $query ) );
- $this->assertFalse( $p->next_tag( $query ) );
}
}