Script Loader: Use wp_get_script_tag() and wp_get_inline_script_tag()/wp_print_inline_script_tag() helper functions to output scripts on the frontend and login screen.

Using script tag helper functions allows plugins to employ the `wp_script_attributes` and `wp_inline_script_attributes` filters to inject the `nonce` attribute to apply Content Security Policy (e.g. Strict CSP). Use of helper functions also simplifies logic in `WP_Scripts`.

* Update `wp_get_inline_script_tag()` to wrap inline script in CDATA blocks for XHTML-compatibility when not using HTML5.
* Ensure the `type` attribute is printed first in `wp_get_inline_script_tag()` for back-compat.
* Wrap existing `<script>` tags in output buffering to retain IDE supports.
* In `wp_get_inline_script_tag()`, append the newline to `$javascript` before it is passed into the `wp_inline_script_attributes` filter so that the CSP hash can be computed properly.
* In `the_block_template_skip_link()`, opt to enqueue the inline script rather than print it.
* Add `ext-php` to `composer.json` under `suggest` as previously it was an undeclared dependency for running PHPUnit tests.
* Update tests to rely on `DOMDocument` to compare script markup, normalizing unsemantic differences.

Props westonruter, spacedmonkey, flixos90, 10upsimon, dmsnell, mukesh27, joemcgill, swissspidy, azaozz.
Fixes #58664.
See #39941.


git-svn-id: https://develop.svn.wordpress.org/trunk@56687 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Weston Ruter
2023-09-25 21:03:19 +00:00
parent 5c8b4c1b00
commit 4df5cd15a5
17 changed files with 214 additions and 147 deletions

View File

@@ -122,17 +122,6 @@ class WP_Scripts extends WP_Dependencies {
*/
public $default_dirs;
/**
* Holds a string which contains the type attribute for script tag.
*
* If the active theme does not declare HTML5 support for 'script',
* then it initializes as `type='text/javascript'`.
*
* @since 5.3.0
* @var string
*/
private $type_attr = '';
/**
* Holds a mapping of dependents (as handles) for a given script handle.
* Used to optimize recursive dependency tree checks.
@@ -167,14 +156,6 @@ class WP_Scripts extends WP_Dependencies {
* @since 3.4.0
*/
public function init() {
if (
function_exists( 'is_admin' ) && ! is_admin()
&&
function_exists( 'current_theme_supports' ) && ! current_theme_supports( 'html5', 'script' )
) {
$this->type_attr = " type='text/javascript'";
}
/**
* Fires when the WP_Scripts instance is initialized.
*
@@ -245,20 +226,7 @@ class WP_Scripts extends WP_Dependencies {
return $output;
}
printf( "<script%s id='%s-js-extra'>\n", $this->type_attr, esc_attr( $handle ) );
// CDATA is not needed for HTML 5.
if ( $this->type_attr ) {
echo "/* <![CDATA[ */\n";
}
echo "$output\n";
if ( $this->type_attr ) {
echo "/* ]]> */\n";
}
echo "</script>\n";
wp_print_inline_script_tag( $output, array( 'id' => "{$handle}-js-extra" ) );
return true;
}
@@ -335,7 +303,7 @@ class WP_Scripts extends WP_Dependencies {
$translations = $this->print_translations( $handle, false );
if ( $translations ) {
$translations = sprintf( "<script%s id='%s-js-translations'>\n%s\n</script>\n", $this->type_attr, esc_attr( $handle ), $translations );
$translations = wp_get_inline_script_tag( $translations, array( 'id' => "{$handle}-js-translations" ) );
}
if ( $this->do_concat ) {
@@ -403,21 +371,24 @@ class WP_Scripts extends WP_Dependencies {
}
/** This filter is documented in wp-includes/class-wp-scripts.php */
$src = esc_url( apply_filters( 'script_loader_src', $src, $handle ) );
$src = esc_url_raw( apply_filters( 'script_loader_src', $src, $handle ) );
if ( ! $src ) {
return true;
}
$tag = $translations . $cond_before . $before_script;
$tag .= sprintf(
"<script%s src='%s' id='%s-js'%s%s></script>\n",
$this->type_attr,
$src, // Value is escaped above.
esc_attr( $handle ),
$strategy ? " {$strategy}" : '',
$intended_strategy ? " data-wp-strategy='{$intended_strategy}'" : ''
$attr = array(
'src' => $src,
'id' => "{$handle}-js",
);
if ( $strategy ) {
$attr[ $strategy ] = true;
}
if ( $intended_strategy ) {
$attr['data-wp-strategy'] = $intended_strategy;
}
$tag = $translations . $cond_before . $before_script;
$tag .= wp_get_script_tag( $attr );
$tag .= $after_script . $cond_after;
/**
@@ -720,7 +691,7 @@ class WP_Scripts extends WP_Dependencies {
JS;
if ( $display ) {
printf( "<script%s id='%s-js-translations'>\n%s\n</script>\n", $this->type_attr, esc_attr( $handle ), $output );
wp_print_inline_script_tag( $output, array( 'id' => "{$handle}-js-translations" ) );
}
return $output;