Script Modules: Adjust data filter name and script tag ID (#62170)

Update the Script Module data filter name and script tag ID to align with Core changes.

See WordPress/wordpress-develop#6682.

Co-authored-by: sirreal <jonsurrell@git.wordpress.org>
Co-authored-by: gziolo <gziolo@git.wordpress.org>

lib/experimental/script-modules.php

@@ -205,10 +205,10 @@ function gutenberg_dequeue_module( $module_identifier ) {
  * This embeds data in the page HTML so that it is available on page load.
  *
  * Data can be associated with a given Script Module by using the
- * `scriptmoduledata_{$module_id}` filter.
+ * `script_module_data_{$module_id}` filter.
  *
  * The data for a given Script Module will be JSON serialized in a script tag with an ID
- * like `wp-scriptmodule-data_{$module_id}`.
+ * like `wp-script-module-data-{$module_id}`.
  */
 function gutenberg_print_script_module_data(): void {
  $get_marked_for_enqueue = new ReflectionMethod( 'WP_Script_Modules', 'get_marked_for_enqueue' );
@@ -236,14 +236,14 @@ function gutenberg_print_script_module_data(): void {
  * If the filter returns no data (an empty array), nothing will be embedded in the page.
  *
  * The data for a given Script Module, if provided, will be JSON serialized in a script tag
- * with an ID like `wp-scriptmodule-data_{$module_id}`.
+ * with an ID like `wp-script-module-data-{$module_id}`.
  *
  * The dynamic portion of the hook name, `$module_id`, refers to the Script Module ID that
  * the data is associated with.
  *
  * @param array $data The data that should be associated with the array.
  */
- $data = apply_filters( "scriptmoduledata_{$module_id}", array() );
+ $data = apply_filters( "script_module_data_{$module_id}", array() );
 
  if ( is_array( $data ) && ! empty( $data ) ) {
  /*
@@ -281,7 +281,7 @@ function gutenberg_print_script_module_data(): void {
  wp_json_encode( $data, $json_encode_flags ),
  array(
  'type' => 'application/json',
- 'id' => "wp-scriptmodule-data_{$module_id}",
+ 'id' => "wp-script-module-data-{$module_id}",
  )
  );
  }

packages/interactivity/src/store.ts

@@ -321,7 +321,9 @@ export function store(
 export const parseInitialData = ( dom = document ) => {
  const jsonDataScriptTag =
  // Preferred Script Module data passing form
- dom.getElementById( 'wp-scriptmodule-data_@wordpress/interactivity' ) ??
+ dom.getElementById(
+ 'wp-script-module-data-@wordpress/interactivity'
+ ) ??
  // Legacy form
  dom.getElementById( 'wp-interactivity-data' );
  if ( jsonDataScriptTag?.textContent ) {