Script Loader: Add id attributes to script assets.

This commit adds a unique ID attribute to script loader generated <script> tags as well as related <script> tags for inline JavaScript, translations, or parameters.

This is a first step in adding support for lazy loading scripts and styles, but for now is only used to assist in debugging generated output.

Props dd32, spacedmonkey.
See #48654.


git-svn-id: https://develop.svn.wordpress.org/trunk@48295 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Timothy Jacobs 2020-07-04 16:52:49 +00:00
parent 6d3cedcc61
commit d241ab3b55
2 changed files with 131 additions and 117 deletions

View File

@ -227,7 +227,7 @@ class WP_Scripts extends WP_Dependencies {
return $output;
}
echo "<script{$this->type_attr}>\n";
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 ) {
@ -298,11 +298,11 @@ class WP_Scripts extends WP_Dependencies {
$after_handle = $this->print_inline_script( $handle, 'after', false );
if ( $before_handle ) {
$before_handle = sprintf( "<script%s>\n%s\n</script>\n", $this->type_attr, $before_handle );
$before_handle = sprintf( "<script%s id='%s-js-before'>\n%s\n</script>\n", $this->type_attr, esc_attr( $handle ), $before_handle );
}
if ( $after_handle ) {
$after_handle = sprintf( "<script%s>\n%s\n</script>\n", $this->type_attr, $after_handle );
$after_handle = sprintf( "<script%s id='%s-js-after'>\n%s\n</script>\n", $this->type_attr, esc_attr( $handle ), $after_handle );
}
if ( $before_handle || $after_handle ) {
@ -366,7 +366,7 @@ class WP_Scripts extends WP_Dependencies {
$translations = $this->print_translations( $handle, false );
if ( $translations ) {
$translations = sprintf( "<script%s>\n%s\n</script>\n", $this->type_attr, $translations );
$translations = sprintf( "<script%s id='%s-js-translations'>\n%s\n</script>\n", $this->type_attr, esc_attr( $handle ), $translations );
}
if ( ! preg_match( '|^(https?:)?//|', $src ) && ! ( $this->content_url && 0 === strpos( $src, $this->content_url ) ) ) {
@ -385,7 +385,7 @@ class WP_Scripts extends WP_Dependencies {
}
$tag = $translations . $cond_before . $before_handle;
$tag .= sprintf( "<script%s src='%s'></script>\n", $this->type_attr, $src );
$tag .= sprintf( "<script%s src='%s' id='%s-js'></script>\n", $this->type_attr, $src, esc_attr( $handle ) );
$tag .= $after_handle . $cond_after;
/**
@ -458,7 +458,7 @@ class WP_Scripts extends WP_Dependencies {
$output = trim( implode( "\n", $output ), "\n" );
if ( $echo ) {
printf( "<script%s>\n%s\n</script>\n", $this->type_attr, $output );
printf( "<script%s id='%s-js-%s'>\n%s\n</script>\n", $this->type_attr, esc_attr( $handle ), esc_attr( $position ), $output );
}
return $output;
@ -595,7 +595,7 @@ class WP_Scripts extends WP_Dependencies {
JS;
if ( $echo ) {
printf( "<script%s>\n%s\n</script>\n", $this->type_attr, $output );
printf( "<script%s id='%s-js-translations'>\n%s\n</script>\n", $this->type_attr, esc_attr( $handle ), $output );
}
return $output;

View File

@ -17,7 +17,7 @@ class Tests_Dependencies_Scripts extends WP_UnitTestCase {
$GLOBALS['wp_scripts']->default_version = get_bloginfo( 'version' );
$this->wp_scripts_print_translations_output = <<<JS
<script type='text/javascript'>
<script type='text/javascript' id='__HANDLE__-js-translations'>
( function( domain, translations ) {
var localeData = translations.locale_data[ domain ] || translations.locale_data.messages;
localeData[""].domain = domain;
@ -46,10 +46,10 @@ JS;
wp_enqueue_script( 'empty-deps-null-version', 'example.com', array(), null );
$ver = get_bloginfo( 'version' );
$expected = "<script type='text/javascript' src='http://example.com?ver=$ver'></script>\n";
$expected .= "<script type='text/javascript' src='http://example.com?ver=$ver'></script>\n";
$expected .= "<script type='text/javascript' src='http://example.com?ver=1.2'></script>\n";
$expected .= "<script type='text/javascript' src='http://example.com'></script>\n";
$expected = "<script type='text/javascript' src='http://example.com?ver=$ver' id='no-deps-no-version-js'></script>\n";
$expected .= "<script type='text/javascript' src='http://example.com?ver=$ver' id='empty-deps-no-version-js'></script>\n";
$expected .= "<script type='text/javascript' src='http://example.com?ver=1.2' id='empty-deps-version-js'></script>\n";
$expected .= "<script type='text/javascript' src='http://example.com' id='empty-deps-null-version-js'></script>\n";
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
@ -69,7 +69,7 @@ JS;
wp_enqueue_script( 'empty-deps-no-version', 'example.com' );
$ver = get_bloginfo( 'version' );
$expected = "<script src='http://example.com?ver=$ver'></script>\n";
$expected = "<script src='http://example.com?ver=$ver' id='empty-deps-no-version-js'></script>\n";
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -90,24 +90,24 @@ JS;
// Try with an HTTP reference.
wp_enqueue_script( 'jquery-http', 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' );
$expected .= "<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js?ver=$ver'></script>\n";
$expected .= "<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js?ver=$ver' id='jquery-http-js'></script>\n";
// Try with an HTTPS reference.
wp_enqueue_script( 'jquery-https', 'https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' );
$expected .= "<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js?ver=$ver'></script>\n";
$expected .= "<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js?ver=$ver' id='jquery-https-js'></script>\n";
// Try with an automatic protocol reference (//).
wp_enqueue_script( 'jquery-doubleslash', '//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' );
$expected .= "<script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js?ver=$ver'></script>\n";
$expected .= "<script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js?ver=$ver' id='jquery-doubleslash-js'></script>\n";
// Try with a local resource and an automatic protocol reference (//).
$url = '//my_plugin/script.js';
wp_enqueue_script( 'plugin-script', $url );
$expected .= "<script type='text/javascript' src='$url?ver=$ver'></script>\n";
$expected .= "<script type='text/javascript' src='$url?ver=$ver' id='plugin-script-js'></script>\n";
// Try with a bad protocol.
wp_enqueue_script( 'jquery-ftp', 'ftp://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' );
$expected .= "<script type='text/javascript' src='{$wp_scripts->base_url}ftp://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js?ver=$ver'></script>\n";
$expected .= "<script type='text/javascript' src='{$wp_scripts->base_url}ftp://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js?ver=$ver' id='jquery-ftp-js'></script>\n";
// Go!
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
@ -150,8 +150,8 @@ JS;
// Enqueue and add data.
wp_enqueue_script( 'test-only-data', 'example.com', array(), null );
wp_script_add_data( 'test-only-data', 'data', 'testing' );
$expected = "<script type='text/javascript'>\n/* <![CDATA[ */\ntesting\n/* ]]> */\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com'></script>\n";
$expected = "<script type='text/javascript' id='test-only-data-js-extra'>\n/* <![CDATA[ */\ntesting\n/* ]]> */\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com' id='test-only-data-js'></script>\n";
// Go!
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
@ -169,7 +169,7 @@ JS;
// Enqueue and add conditional comments.
wp_enqueue_script( 'test-only-conditional', 'example.com', array(), null );
wp_script_add_data( 'test-only-conditional', 'conditional', 'gt IE 7' );
$expected = "<!--[if gt IE 7]>\n<script type='text/javascript' src='http://example.com'></script>\n<![endif]-->\n";
$expected = "<!--[if gt IE 7]>\n<script type='text/javascript' src='http://example.com' id='test-only-conditional-js'></script>\n<![endif]-->\n";
// Go!
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
@ -188,8 +188,8 @@ JS;
wp_enqueue_script( 'test-conditional-with-data', 'example.com', array(), null );
wp_script_add_data( 'test-conditional-with-data', 'data', 'testing' );
wp_script_add_data( 'test-conditional-with-data', 'conditional', 'lt IE 9' );
$expected = "<!--[if lt IE 9]>\n<script type='text/javascript'>\n/* <![CDATA[ */\ntesting\n/* ]]> */\n</script>\n<![endif]-->\n";
$expected .= "<!--[if lt IE 9]>\n<script type='text/javascript' src='http://example.com'></script>\n<![endif]-->\n";
$expected = "<!--[if lt IE 9]>\n<script type='text/javascript' id='test-conditional-with-data-js-extra'>\n/* <![CDATA[ */\ntesting\n/* ]]> */\n</script>\n<![endif]-->\n";
$expected .= "<!--[if lt IE 9]>\n<script type='text/javascript' src='http://example.com' id='test-conditional-with-data-js'></script>\n<![endif]-->\n";
// Go!
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
@ -207,7 +207,7 @@ JS;
// Enqueue and add an invalid key.
wp_enqueue_script( 'test-invalid', 'example.com', array(), null );
wp_script_add_data( 'test-invalid', 'invalid', 'testing' );
$expected = "<script type='text/javascript' src='http://example.com'></script>\n";
$expected = "<script type='text/javascript' src='http://example.com' id='test-invalid-js'></script>\n";
// Go!
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
@ -230,8 +230,8 @@ JS;
* @ticket 35229
*/
function test_wp_register_script_with_handle_without_source() {
$expected = "<script type='text/javascript' src='http://example.com?ver=1'></script>\n";
$expected .= "<script type='text/javascript' src='http://example.com?ver=2'></script>\n";
$expected = "<script type='text/javascript' src='http://example.com?ver=1' id='handle-one-js'></script>\n";
$expected .= "<script type='text/javascript' src='http://example.com?ver=2' id='handle-two-js'></script>\n";
wp_register_script( 'handle-one', 'http://example.com', array(), 1 );
wp_register_script( 'handle-two', 'http://example.com', array(), 2 );
@ -319,9 +319,9 @@ JS;
$header = get_echo( 'wp_print_head_scripts' );
$footer = get_echo( 'wp_print_footer_scripts' );
$expected_header = "<script type='text/javascript' src='/child-footer.js'></script>\n";
$expected_header .= "<script type='text/javascript' src='/child-head.js'></script>\n";
$expected_footer = "<script type='text/javascript' src='/parent.js'></script>\n";
$expected_header = "<script type='text/javascript' src='/child-footer.js' id='child-footer-js'></script>\n";
$expected_header .= "<script type='text/javascript' src='/child-head.js' id='child-head-js'></script>\n";
$expected_footer = "<script type='text/javascript' src='/parent.js' id='parent-js'></script>\n";
$this->assertEquals( $expected_header, $header );
$this->assertEquals( $expected_footer, $footer );
@ -340,9 +340,9 @@ JS;
$header = get_echo( 'wp_print_head_scripts' );
$footer = get_echo( 'wp_print_footer_scripts' );
$expected_header = "<script type='text/javascript' src='/child-head.js'></script>\n";
$expected_footer = "<script type='text/javascript' src='/child-footer.js'></script>\n";
$expected_footer .= "<script type='text/javascript' src='/parent.js'></script>\n";
$expected_header = "<script type='text/javascript' src='/child-head.js' id='child-head-js'></script>\n";
$expected_footer = "<script type='text/javascript' src='/child-footer.js' id='child-footer-js'></script>\n";
$expected_footer .= "<script type='text/javascript' src='/parent.js' id='parent-js'></script>\n";
$this->assertEquals( $expected_header, $header );
$this->assertEquals( $expected_footer, $footer );
@ -366,14 +366,14 @@ JS;
$header = get_echo( 'wp_print_head_scripts' );
$footer = get_echo( 'wp_print_footer_scripts' );
$expected_header = "<script type='text/javascript' src='/child-head.js'></script>\n";
$expected_header .= "<script type='text/javascript' src='/grandchild-head.js'></script>\n";
$expected_header .= "<script type='text/javascript' src='/child2-head.js'></script>\n";
$expected_header .= "<script type='text/javascript' src='/parent-header.js'></script>\n";
$expected_header = "<script type='text/javascript' src='/child-head.js' id='child-head-js'></script>\n";
$expected_header .= "<script type='text/javascript' src='/grandchild-head.js' id='grandchild-head-js'></script>\n";
$expected_header .= "<script type='text/javascript' src='/child2-head.js' id='child2-head-js'></script>\n";
$expected_header .= "<script type='text/javascript' src='/parent-header.js' id='parent-header-js'></script>\n";
$expected_footer = "<script type='text/javascript' src='/child-footer.js'></script>\n";
$expected_footer .= "<script type='text/javascript' src='/child2-footer.js'></script>\n";
$expected_footer .= "<script type='text/javascript' src='/parent-footer.js'></script>\n";
$expected_footer = "<script type='text/javascript' src='/child-footer.js' id='child-footer-js'></script>\n";
$expected_footer .= "<script type='text/javascript' src='/child2-footer.js' id='child2-footer-js'></script>\n";
$expected_footer .= "<script type='text/javascript' src='/parent-footer.js' id='parent-footer-js'></script>\n";
$this->assertEquals( $expected_header, $header );
$this->assertEquals( $expected_footer, $footer );
@ -403,8 +403,8 @@ JS;
wp_enqueue_script( 'test-example', 'example.com', array(), null );
wp_add_inline_script( 'test-example', 'console.log("before");', 'before' );
$expected = "<script type='text/javascript'>\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com'></script>\n";
$expected = "<script type='text/javascript' id='test-example-js-before'>\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com' id='test-example-js'></script>\n";
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -416,8 +416,8 @@ JS;
wp_enqueue_script( 'test-example', 'example.com', array(), null );
wp_add_inline_script( 'test-example', 'console.log("after");' );
$expected = "<script type='text/javascript' src='http://example.com'></script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"after\");\n</script>\n";
$expected = "<script type='text/javascript' src='http://example.com' id='test-example-js'></script>\n";
$expected .= "<script type='text/javascript' id='test-example-js-after'>\nconsole.log(\"after\");\n</script>\n";
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -430,9 +430,9 @@ JS;
wp_add_inline_script( 'test-example', 'console.log("before");', 'before' );
wp_add_inline_script( 'test-example', 'console.log("after");' );
$expected = "<script type='text/javascript'>\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com'></script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"after\");\n</script>\n";
$expected = "<script type='text/javascript' id='test-example-js-before'>\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com' id='test-example-js'></script>\n";
$expected .= "<script type='text/javascript' id='test-example-js-after'>\nconsole.log(\"after\");\n</script>\n";
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -445,7 +445,7 @@ JS;
wp_enqueue_script( 'test-example' );
wp_add_inline_script( 'test-example', 'console.log("before");', 'before' );
$expected = "<script type='text/javascript'>\nconsole.log(\"before\");\n</script>\n";
$expected = "<script type='text/javascript' id='test-example-js-before'>\nconsole.log(\"before\");\n</script>\n";
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -458,7 +458,7 @@ JS;
wp_enqueue_script( 'test-example' );
wp_add_inline_script( 'test-example', 'console.log("after");' );
$expected = "<script type='text/javascript'>\nconsole.log(\"after\");\n</script>\n";
$expected = "<script type='text/javascript' id='test-example-js-after'>\nconsole.log(\"after\");\n</script>\n";
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -472,8 +472,8 @@ JS;
wp_add_inline_script( 'test-example', 'console.log("before");', 'before' );
wp_add_inline_script( 'test-example', 'console.log("after");' );
$expected = "<script type='text/javascript'>\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"after\");\n</script>\n";
$expected = "<script type='text/javascript' id='test-example-js-before'>\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript' id='test-example-js-after'>\nconsole.log(\"after\");\n</script>\n";
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -488,9 +488,9 @@ JS;
wp_add_inline_script( 'test-example', 'console.log("after");' );
wp_add_inline_script( 'test-example', 'console.log("after");' );
$expected = "<script type='text/javascript'>\nconsole.log(\"before\");\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com'></script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"after\");\nconsole.log(\"after\");\n</script>\n";
$expected = "<script type='text/javascript' id='test-example-js-before'>\nconsole.log(\"before\");\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com' id='test-example-js'></script>\n";
$expected .= "<script type='text/javascript' id='test-example-js-after'>\nconsole.log(\"after\");\nconsole.log(\"after\");\n</script>\n";
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -504,10 +504,10 @@ JS;
wp_add_inline_script( 'test-example', 'console.log("before");', 'before' );
wp_add_inline_script( 'test-example', 'console.log("after");' );
$expected = "<script type='text/javascript'>\n/* <![CDATA[ */\nvar testExample = {\"foo\":\"bar\"};\n/* ]]> */\n</script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com'></script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"after\");\n</script>\n";
$expected = "<script type='text/javascript' id='test-example-js-extra'>\n/* <![CDATA[ */\nvar testExample = {\"foo\":\"bar\"};\n/* ]]> */\n</script>\n";
$expected .= "<script type='text/javascript' id='test-example-js-before'>\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com' id='test-example-js'></script>\n";
$expected .= "<script type='text/javascript' id='test-example-js-after'>\nconsole.log(\"after\");\n</script>\n";
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -529,11 +529,11 @@ JS;
wp_add_inline_script( 'two', 'console.log("before two");', 'before' );
$ver = get_bloginfo( 'version' );
$expected = "<script type='text/javascript'>\nconsole.log(\"before one\");\n</script>\n";
$expected .= "<script type='text/javascript' src='/directory/one.js?ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"before two\");\n</script>\n";
$expected .= "<script type='text/javascript' src='/directory/two.js?ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript' src='/directory/three.js?ver={$ver}'></script>\n";
$expected = "<script type='text/javascript' id='one-js-before'>\nconsole.log(\"before one\");\n</script>\n";
$expected .= "<script type='text/javascript' src='/directory/one.js?ver={$ver}' id='one-js'></script>\n";
$expected .= "<script type='text/javascript' id='two-js-before'>\nconsole.log(\"before two\");\n</script>\n";
$expected .= "<script type='text/javascript' src='/directory/two.js?ver={$ver}' id='two-js'></script>\n";
$expected .= "<script type='text/javascript' src='/directory/three.js?ver={$ver}' id='three-js'></script>\n";
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -554,10 +554,10 @@ JS;
wp_add_inline_script( 'one', 'console.log("before one");', 'before' );
$ver = get_bloginfo( 'version' );
$expected = "<script type='text/javascript'>\nconsole.log(\"before one\");\n</script>\n";
$expected .= "<script type='text/javascript' src='/directory/one.js?ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript' src='/directory/two.js?ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript' src='/directory/three.js?ver={$ver}'></script>\n";
$expected = "<script type='text/javascript' id='one-js-before'>\nconsole.log(\"before one\");\n</script>\n";
$expected .= "<script type='text/javascript' src='/directory/one.js?ver={$ver}' id='one-js'></script>\n";
$expected .= "<script type='text/javascript' src='/directory/two.js?ver={$ver}' id='two-js'></script>\n";
$expected .= "<script type='text/javascript' src='/directory/three.js?ver={$ver}' id='three-js'></script>\n";
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -581,11 +581,11 @@ JS;
$ver = get_bloginfo( 'version' );
$expected = "<script type='text/javascript' src='/wp-admin/load-scripts.php?c=0&amp;load%5Bchunk_0%5D=one&amp;ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript' src='/directory/two.js?ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"after two\");\n</script>\n";
$expected .= "<script type='text/javascript' src='/directory/three.js?ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"after three\");\n</script>\n";
$expected .= "<script type='text/javascript' src='/directory/four.js?ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript' src='/directory/two.js?ver={$ver}' id='two-js'></script>\n";
$expected .= "<script type='text/javascript' id='two-js-after'>\nconsole.log(\"after two\");\n</script>\n";
$expected .= "<script type='text/javascript' src='/directory/three.js?ver={$ver}' id='three-js'></script>\n";
$expected .= "<script type='text/javascript' id='three-js-after'>\nconsole.log(\"after three\");\n</script>\n";
$expected .= "<script type='text/javascript' src='/directory/four.js?ver={$ver}' id='four-js'></script>\n";
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -600,13 +600,13 @@ JS;
$wp_scripts->default_dirs = array( '/wp-admin/js/', '/wp-includes/js/' ); // Default dirs as in wp-includes/script-loader.php.
$expected_localized = "<!--[if gte IE 9]>\n";
$expected_localized .= "<script type='text/javascript'>\n/* <![CDATA[ */\nvar testExample = {\"foo\":\"bar\"};\n/* ]]> */\n</script>\n";
$expected_localized .= "<script type='text/javascript' id='test-example-js-extra'>\n/* <![CDATA[ */\nvar testExample = {\"foo\":\"bar\"};\n/* ]]> */\n</script>\n";
$expected_localized .= "<![endif]-->\n";
$expected = "<!--[if gte IE 9]>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com'></script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"after\");\n</script>\n";
$expected .= "<script type='text/javascript' id='test-example-js-before'>\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com' id='test-example-js'></script>\n";
$expected .= "<script type='text/javascript' id='test-example-js-after'>\nconsole.log(\"after\");\n</script>\n";
$expected .= "<![endif]-->\n";
wp_enqueue_script( 'test-example', 'example.com', array(), null );
@ -633,8 +633,8 @@ JS;
$ver = get_bloginfo( 'version' );
$expected = "<script type='text/javascript' src='/wp-admin/load-scripts.php?c=0&amp;load%5Bchunk_0%5D=jquery-core,jquery-migrate&amp;ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript' src='http://example.com'></script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"after\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com' id='test-example-js'></script>\n";
$expected .= "<script type='text/javascript' id='test-example-js-after'>\nconsole.log(\"after\");\n</script>\n";
wp_enqueue_script( 'test-example', 'http://example.com', array( 'jquery' ), null );
wp_add_inline_script( 'test-example', 'console.log("after");' );
@ -659,8 +659,8 @@ JS;
$ver = get_bloginfo( 'version' );
$expected = "<script type='text/javascript' src='/wp-admin/load-scripts.php?c=0&amp;load%5Bchunk_0%5D=jquery-core,jquery-migrate&amp;ver={$ver}'></script>\n";
$expected .= "<!--[if gte IE 9]>\n";
$expected .= "<script type='text/javascript' src='http://example.com'></script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"after\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com' id='test-example-js'></script>\n";
$expected .= "<script type='text/javascript' id='test-example-js-after'>\nconsole.log(\"after\");\n</script>\n";
$expected .= "<![endif]-->\n";
wp_enqueue_script( 'test-example', 'http://example.com', array( 'jquery' ), null );
@ -687,8 +687,8 @@ JS;
$ver = get_bloginfo( 'version' );
$expected = "<script type='text/javascript' src='/wp-admin/load-scripts.php?c=0&amp;load%5Bchunk_0%5D=jquery-core,jquery-migrate&amp;ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com'></script>\n";
$expected .= "<script type='text/javascript' id='test-example-js-before'>\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com' id='test-example-js'></script>\n";
wp_enqueue_script( 'test-example', 'http://example.com', array( 'jquery' ), null );
wp_add_inline_script( 'test-example', 'console.log("before");', 'before' );
@ -713,24 +713,24 @@ JS;
$ver = get_bloginfo( 'version' );
$expected = "<script type='text/javascript' src='/wp-admin/load-scripts.php?c=0&amp;load%5Bchunk_0%5D=jquery-core,jquery-migrate&amp;ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/dist/vendor/wp-polyfill.min.js'></script>\n";
$expected .= "<script type='text/javascript'>\n";
$expected .= "<script type='text/javascript' id='test-example-js-before'>\nconsole.log(\"before\");\n</script>\n";
$expected .= "<script type='text/javascript' src='http://example.com' id='test-example-js'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/dist/vendor/wp-polyfill.min.js' id='wp-polyfill-js'></script>\n";
$expected .= "<script type='text/javascript' id='wp-polyfill-js-after'>\n";
$expected .= "( 'fetch' in window ) || document.write( '<script src=\"http://example.org/wp-includes/js/dist/vendor/wp-polyfill-fetch.min.js\"></scr' + 'ipt>' );( document.contains ) || document.write( '<script src=\"http://example.org/wp-includes/js/dist/vendor/wp-polyfill-node-contains.min.js\"></scr' + 'ipt>' );( window.DOMRect ) || document.write( '<script src=\"http://example.org/wp-includes/js/dist/vendor/wp-polyfill-dom-rect.min.js\"></scr' + 'ipt>' );( window.URL && window.URL.prototype && window.URLSearchParams ) || document.write( '<script src=\"http://example.org/wp-includes/js/dist/vendor/wp-polyfill-url.min.js\"></scr' + 'ipt>' );( window.FormData && window.FormData.prototype.keys ) || document.write( '<script src=\"http://example.org/wp-includes/js/dist/vendor/wp-polyfill-formdata.min.js\"></scr' + 'ipt>' );( Element.prototype.matches && Element.prototype.closest ) || document.write( '<script src=\"http://example.org/wp-includes/js/dist/vendor/wp-polyfill-element-closest.min.js\"></scr' + 'ipt>' );\n";
$expected .= "</script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/dist/dom-ready.min.js'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/dist/i18n.min.js'></script>\n";
$expected .= "<script type='text/javascript'>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/dist/dom-ready.min.js' id='wp-dom-ready-js'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/dist/i18n.min.js' id='wp-i18n-js'></script>\n";
$expected .= "<script type='text/javascript' id='wp-a11y-js-translations'>\n";
$expected .= "( function( domain, translations ) {\n";
$expected .= " var localeData = translations.locale_data[ domain ] || translations.locale_data.messages;\n";
$expected .= " localeData[\"\"].domain = domain;\n";
$expected .= " wp.i18n.setLocaleData( localeData, domain );\n";
$expected .= "} )( \"default\", { \"locale_data\": { \"messages\": { \"\": {} } } } );\n";
$expected .= "</script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/dist/a11y.min.js'></script>\n";
$expected .= "<script type='text/javascript' src='http://example2.com'></script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"after\");\n</script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/dist/a11y.min.js' id='wp-a11y-js'></script>\n";
$expected .= "<script type='text/javascript' src='http://example2.com' id='test-example2-js'></script>\n";
$expected .= "<script type='text/javascript' id='test-example2-js-after'>\nconsole.log(\"after\");\n</script>\n";
wp_enqueue_script( 'test-example', 'http://example.com', array( 'jquery' ), null );
wp_add_inline_script( 'test-example', 'console.log("before");', 'before' );
@ -767,8 +767,8 @@ JS;
$wp_scripts->base_url = '';
$wp_scripts->do_concat = true;
$expected_tail = "<script type='text/javascript' src='/customize-dependency.js'></script>\n";
$expected_tail .= "<script type='text/javascript'>\n";
$expected_tail = "<script type='text/javascript' src='/customize-dependency.js' id='customize-dependency-js'></script>\n";
$expected_tail .= "<script type='text/javascript' id='customize-dependency-js-after'>\n";
$expected_tail .= "tryCustomizeDependency()\n";
$expected_tail .= "</script>\n";
@ -779,7 +779,7 @@ JS;
$print_scripts = get_echo( 'wp_print_scripts' );
$print_scripts .= get_echo( '_print_scripts' );
$tail = substr( $print_scripts, strrpos( $print_scripts, "<script type='text/javascript' src='/customize-dependency.js'>" ) );
$tail = substr( $print_scripts, strrpos( $print_scripts, "<script type='text/javascript' src='/customize-dependency.js' id='customize-dependency-js'>" ) );
$this->assertEquals( $expected_tail, $tail );
}
@ -799,11 +799,11 @@ JS;
wp_enqueue_script( 'four', '/wp-includes/js/script4.js' );
$ver = get_bloginfo( 'version' );
$expected = "<script type='text/javascript' src='/wp-includes/js/script.js?ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"after one\");\n</script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/script2.js?ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/script3.js?ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/script4.js?ver={$ver}'></script>\n";
$expected = "<script type='text/javascript' src='/wp-includes/js/script.js?ver={$ver}' id='one-js'></script>\n";
$expected .= "<script type='text/javascript' id='one-js-after'>\nconsole.log(\"after one\");\n</script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/script2.js?ver={$ver}' id='two-js'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/script3.js?ver={$ver}' id='three-js'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/script4.js?ver={$ver}' id='four-js'></script>\n";
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -825,9 +825,9 @@ JS;
$ver = get_bloginfo( 'version' );
$expected = "<script type='text/javascript' src='/wp-admin/load-scripts.php?c=0&amp;load%5Bchunk_0%5D=one,two&amp;ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript'>\nconsole.log(\"before three\");\n</script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/script3.js?ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/script4.js?ver={$ver}'></script>\n";
$expected .= "<script type='text/javascript' id='three-js-before'>\nconsole.log(\"before three\");\n</script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/script3.js?ver={$ver}' id='three-js'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/script4.js?ver={$ver}' id='four-js'></script>\n";
$this->assertEquals( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -840,19 +840,21 @@ JS;
wp_enqueue_script( 'test-example', '/wp-includes/js/script.js', array(), null );
wp_set_script_translations( 'test-example', 'default', DIR_TESTDATA . '/languages' );
$expected = "<script type='text/javascript' src='/wp-includes/js/dist/wp-i18n.js'></script>\n";
$expected = "<script type='text/javascript' src='/wp-includes/js/dist/wp-i18n.js' id='wp-i18n-js'></script>\n";
$expected .= str_replace(
array(
'__DOMAIN__',
'__HANDLE__',
'__JSON_TRANSLATIONS__',
),
array(
'default',
'test-example',
file_get_contents( DIR_TESTDATA . '/languages/en_US-813e104eb47e13dd4cc5af844c618754.json' ),
),
$this->wp_scripts_print_translations_output
);
$expected .= "<script type='text/javascript' src='/wp-includes/js/script.js'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/script.js' id='test-example-js'></script>\n";
$this->assertEqualsIgnoreEOL( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -865,19 +867,21 @@ JS;
wp_enqueue_script( 'plugin-example', '/wp-content/plugins/my-plugin/js/script.js', array(), null );
wp_set_script_translations( 'plugin-example', 'internationalized-plugin', DIR_TESTDATA . '/languages/plugins' );
$expected = "<script type='text/javascript' src='/wp-includes/js/dist/wp-i18n.js'></script>\n";
$expected = "<script type='text/javascript' src='/wp-includes/js/dist/wp-i18n.js' id='wp-i18n-js'></script>\n";
$expected .= str_replace(
array(
'__DOMAIN__',
'__HANDLE__',
'__JSON_TRANSLATIONS__',
),
array(
'internationalized-plugin',
'plugin-example',
file_get_contents( DIR_TESTDATA . '/languages/plugins/internationalized-plugin-en_US-2f86cb96a0233e7cb3b6f03ad573be0b.json' ),
),
$this->wp_scripts_print_translations_output
);
$expected .= "<script type='text/javascript' src='/wp-content/plugins/my-plugin/js/script.js'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-content/plugins/my-plugin/js/script.js' id='plugin-example-js'></script>\n";
$this->assertEqualsIgnoreEOL( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -890,19 +894,21 @@ JS;
wp_enqueue_script( 'theme-example', '/wp-content/themes/my-theme/js/script.js', array(), null );
wp_set_script_translations( 'theme-example', 'internationalized-theme', DIR_TESTDATA . '/languages/themes' );
$expected = "<script type='text/javascript' src='/wp-includes/js/dist/wp-i18n.js'></script>\n";
$expected = "<script type='text/javascript' src='/wp-includes/js/dist/wp-i18n.js' id='wp-i18n-js'></script>\n";
$expected .= str_replace(
array(
'__DOMAIN__',
'__HANDLE__',
'__JSON_TRANSLATIONS__',
),
array(
'internationalized-theme',
'theme-example',
file_get_contents( DIR_TESTDATA . '/languages/themes/internationalized-theme-en_US-2f86cb96a0233e7cb3b6f03ad573be0b.json' ),
),
$this->wp_scripts_print_translations_output
);
$expected .= "<script type='text/javascript' src='/wp-content/themes/my-theme/js/script.js'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-content/themes/my-theme/js/script.js' id='theme-example-js'></script>\n";
$this->assertEqualsIgnoreEOL( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -915,19 +921,21 @@ JS;
wp_enqueue_script( 'script-handle', '/wp-admin/js/script.js', array(), null );
wp_set_script_translations( 'script-handle', 'admin', DIR_TESTDATA . '/languages/' );
$expected = "<script type='text/javascript' src='/wp-includes/js/dist/wp-i18n.js'></script>\n";
$expected = "<script type='text/javascript' src='/wp-includes/js/dist/wp-i18n.js' id='wp-i18n-js'></script>\n";
$expected .= str_replace(
array(
'__DOMAIN__',
'__HANDLE__',
'__JSON_TRANSLATIONS__',
),
array(
'admin',
'script-handle',
file_get_contents( DIR_TESTDATA . '/languages/admin-en_US-script-handle.json' ),
),
$this->wp_scripts_print_translations_output
);
$expected .= "<script type='text/javascript' src='/wp-admin/js/script.js'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-admin/js/script.js' id='script-handle-js'></script>\n";
$this->assertEqualsIgnoreEOL( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -955,19 +963,21 @@ JS;
wp_enqueue_script( 'test-example', '/wp-admin/js/script.js', array(), null );
wp_set_script_translations( 'test-example', 'admin', DIR_TESTDATA . '/languages/' );
$expected = "<script type='text/javascript' src='/wp-includes/js/dist/wp-i18n.js'></script>\n";
$expected = "<script type='text/javascript' src='/wp-includes/js/dist/wp-i18n.js' id='wp-i18n-js'></script>\n";
$expected .= str_replace(
array(
'__DOMAIN__',
'__HANDLE__',
'__JSON_TRANSLATIONS__',
),
array(
'admin',
'test-example',
'{ "locale_data": { "messages": { "": {} } } }',
),
$this->wp_scripts_print_translations_output
);
$expected .= "<script type='text/javascript' src='/wp-admin/js/script.js'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-admin/js/script.js' id='test-example-js'></script>\n";
$this->assertEqualsIgnoreEOL( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -982,19 +992,21 @@ JS;
wp_enqueue_script( 'test-example' );
$expected = "<script type='text/javascript' src='/wp-includes/js/dist/wp-i18n.js'></script>\n";
$expected = "<script type='text/javascript' src='/wp-includes/js/dist/wp-i18n.js' id='wp-i18n-js'></script>\n";
$expected .= str_replace(
array(
'__DOMAIN__',
'__HANDLE__',
'__JSON_TRANSLATIONS__',
),
array(
'default',
'test-example',
file_get_contents( DIR_TESTDATA . '/languages/en_US-813e104eb47e13dd4cc5af844c618754.json' ),
),
$this->wp_scripts_print_translations_output
);
$expected .= "<script type='text/javascript' src='/wp-includes/js/script.js'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/script.js' id='test-example-js'></script>\n";
$this->assertEqualsIgnoreEOL( $expected, get_echo( 'wp_print_scripts' ) );
}
@ -1009,20 +1021,22 @@ JS;
wp_enqueue_script( 'test-example', '/wp-includes/js/script2.js', array( 'test-dependency' ), null );
$expected = "<script type='text/javascript' src='/wp-includes/js/dist/wp-i18n.js'></script>\n";
$expected = "<script type='text/javascript' src='/wp-includes/js/dist/wp-i18n.js' id='wp-i18n-js'></script>\n";
$expected .= str_replace(
array(
'__DOMAIN__',
'__HANDLE__',
'__JSON_TRANSLATIONS__',
),
array(
'default',
'test-dependency',
file_get_contents( DIR_TESTDATA . '/languages/en_US-813e104eb47e13dd4cc5af844c618754.json' ),
),
$this->wp_scripts_print_translations_output
);
$expected .= "<script type='text/javascript' src='/wp-includes/js/script.js'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/script2.js'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/script.js' id='test-dependency-js'></script>\n";
$expected .= "<script type='text/javascript' src='/wp-includes/js/script2.js' id='test-example-js'></script>\n";
$this->assertEqualsIgnoreEOL( $expected, get_echo( 'wp_print_scripts' ) );
}