WordPress.org
Get WordPress

Make WordPress Core


Ignore:
Timestamp:
09/26/2024 05:53:11 PM (23 months ago)
Author:
czapla
Message:

Interactivity API: Move interactivity-router i18n strings to Script Module data.

Moves the 'loading' and 'loaded' i18n strings for the interactivity-router to the script module data via the script_module_data_@wordpress/interactivity-router filter.

Key changes:

  • Add the filter_script_module_interactivity_router_data() method, hooked into the script_module_data_@wordpress/interactivity-router filter, to set the i18n data with the 'loading' and 'loaded' messages.
  • Rename the print_router_loading_and_screen_reader_markup() method to print_router_markup() and remove the screen reader markup from it because it's no longer needed.
  • Remove the loading and loaded strings from the core/router store state because they're no longer needed.
  • Initialize the core/router store with a minimal navigation object to prevent errors in the interactivity-router script module when the store is not properly initialized.
  • Update corresponding unit tests to reflect these changes.

This change ensures that the interactivity-router i18n messages are localized in a single place and removes the need to initialize them in the core/router store state.

Props jonsurrell, swissspidy, czapla.
See #60647.

File:
1 edited

Legend:

Unmodified
Added
Removed

  • trunk/src/wp-includes/interactivity-api/class-wp-interactivity-api.php

    r59083 r59097  
    201201
    202202        /**
     203         * Set client-side interactivity-router data.
     204         *
     205         * Once in the browser, the state will be parsed and used to hydrate the client-side
     206         * interactivity stores and the configuration will be available using a `getConfig` utility.
     207         *
     208         * @since 6.7.0
     209         *
     210         * @param array $data Data to filter.
     211         * @return array Data for the Interactivity Router script module.
     212         */
     213        public function filter_script_module_interactivity_router_data( array $data ): array {
     214                if ( ! isset( $data['i18n'] ) ) {
     215                        $data['i18n'] = array();
     216                }
     217                $data['i18n']['loading'] = __( 'Loading page, please wait.' );
     218                $data['i18n']['loaded']  = __( 'Page Loaded.' );
     219                return $data;
     220        }
     221
     222        /**
    203223         * Set client-side interactivity data.
    204224         *
    … …  
    297317        public function add_hooks() {
    298318                add_filter( 'script_module_data_@wordpress/interactivity', array( $this, 'filter_script_module_interactivity_data' ) );
     319                add_filter( 'script_module_data_@wordpress/interactivity-router', array( $this, 'filter_script_module_interactivity_router_data' ) );
    299320        }
    300321
    … …  
    974995
    975996        /**
    976          * Outputs the markup for the top loading indicator and the screen reader
    977          * notifications during client-side navigations.
     997         * Outputs markup for the @wordpress/interactivity-router script module.
    978998         *
    979999         * This method prints a div element representing a loading bar visible during
    980          * navigation, as well as an aria-live region that can be read by screen
    981          * readers to announce navigation status.
    982          *
    983          * @since 6.5.0
    984          */
    985         public function print_router_loading_and_screen_reader_markup() {
     1000         * navigation.
     1001         *
     1002         * @since 6.7.0
     1003         */
     1004        public function print_router_markup() {
    9861005                echo <<<HTML
    9871006                        <div
    … …  
    9911010                                data-wp-class--finish-animation="state.navigation.hasFinished"
    9921011                        ></div>
    993                         <div
    994                                 class="screen-reader-text"
    995                                 aria-live="polite"
    996                                 data-wp-interactive="core/router"
    997                                 data-wp-text="state.navigation.message"
    998                         ></div>
    9991012HTML;
    10001013        }
    … …  
    10171030                        $this->has_processed_router_region = true;
    10181031
    1019                         // Initialize the `core/router` store.
     1032                        /*
     1033                         * Initialize the `core/router` store.
     1034                         * If the store is not initialized like this with minimal
     1035                         * navigation object, the interactivity-router script module
     1036                         * errors.
     1037                         */
    10201038                        $this->state(
    10211039                                'core/router',
    10221040                                array(
    1023                                         'navigation' => array(
    1024                                                 'texts' => array(
    1025                                                         'loading' => __( 'Loading page, please wait.' ),
    1026                                                         'loaded'  => __( 'Page Loaded.' ),
    1027                                                 ),
    1028                                         ),
     1041                                        'navigation' => new stdClass(),
    10291042                                )
    10301043                        );
    … …  
    10361049
    10371050                        // Adds the necessary markup to the footer.
    1038                         add_action( 'wp_footer', array( $this, 'print_router_loading_and_screen_reader_markup' ) );
     1051                        add_action( 'wp_footer', array( $this, 'print_router_markup' ) );
    10391052                }
    10401053        }
Note: See TracChangeset for help on using the changeset viewer.