Changeset 56748

Timestamp:

09/29/2023 07:45:53 PM (12 months ago)

Author:

westonruter

Message:

Script Loader: Harden removal of script tag wrappers.

• Add wp_remove_surrounding_empty_script_tags() to more precisely remove script tag wrappers and warn when doing it wrong.
• Add clarifying comments for XML escaping logic in wp_get_inline_script_tag().
• Leverage WP_HTML_Tag_Processor in test_remove_frameless_preview_messenger_channel.
• Reuse assertEqualMarkup in test_blocking_dependent_with_delayed_dependency.
• Normalize whitespace in parse_markup_fragment for assertEqualMarkup.

Follow-up to [56687].
Props dmsnell, westonruter, flixos90.
See #58664.

Location:

trunk

Files:

• phpcs.xml.dist (modified) (1 diff)
• src/wp-includes/class-wp-customize-manager.php (modified) (4 diffs)
• src/wp-includes/functions.php (modified) (1 diff)
• src/wp-includes/script-loader.php (modified) (2 diffs)
• src/wp-includes/theme-templates.php (modified) (1 diff)
• src/wp-includes/theme.php (modified) (1 diff)
• src/wp-includes/widgets/class-wp-widget-archives.php (modified) (1 diff)
• src/wp-includes/widgets/class-wp-widget-categories.php (modified) (1 diff)
• src/wp-login.php (modified) (4 diffs)
• tests/phpunit/tests/customize/manager.php (modified) (1 diff)
• tests/phpunit/tests/dependencies/scripts.php (modified) (2 diffs)
• tests/phpunit/tests/dependencies/wpRemoveSurroundingEmptyScriptTags.php (added)

trunk/phpcs.xml.dist

@@ -172 +172 @@
                 <element value="nodeName"/>
                 <element value="nodeType"/>
+                <element value="nodeValue"/>
                 <element value="parentNode"/>
                 <element value="preserveWhiteSpace"/>

trunk/src/wp-includes/class-wp-customize-manager.php

@@ -475 +475 @@
             </script>
             <?php
-            $message .= wp_get_inline_script_tag( str_replace( array( '<script>', '</script>' ), '', ob_get_clean() ) );
+            $message .= wp_get_inline_script_tag( wp_remove_surrounding_empty_script_tags( ob_get_clean() ) );
         }
 
@@ -2110 +2110 @@
         </script>
         <?php
-        wp_print_inline_script_tag( str_replace( array( '<script>', '</script>' ), '', ob_get_clean() ) );
+        wp_print_inline_script_tag( wp_remove_surrounding_empty_script_tags( ob_get_clean() ) );
     }
 
@@ -2231 +2231 @@
         </script>
         <?php
-        wp_print_inline_script_tag( str_replace( array( '<script>', '</script>' ), '', ob_get_clean() ) );
+        wp_print_inline_script_tag( wp_remove_surrounding_empty_script_tags( ob_get_clean() ) );
     }
 
@@ -5020 +5020 @@
         </script>
         <?php
-        wp_print_inline_script_tag( str_replace( array( '<script>', '</script>' ), '', ob_get_clean() ) );
+        wp_print_inline_script_tag( wp_remove_surrounding_empty_script_tags( ob_get_clean() ) );
     }
 

trunk/src/wp-includes/functions.php

@@ -7620 +7620 @@
     </script>
     <?php
-    wp_print_inline_script_tag( str_replace( array( '<script>', '</script>' ), '', ob_get_clean() ) );
+    wp_print_inline_script_tag( wp_remove_surrounding_empty_script_tags( ob_get_clean() ) );
 }
 

trunk/src/wp-includes/script-loader.php

@@ -2854 +2854 @@
     }
 
-    // Ensure markup is XHTML compatible if not HTML5.
+    /*
+     * XHTML extracts the contents of the SCRIPT element and then the XML parser
+     * decodes character references and other syntax elements. This can lead to
+     * misinterpretation of the script contents or invalid XHTML documents.
+     *
+     * Wrapping the contents in a CDATA section instructs the XML parser not to
+     * transform the contents of the SCRIPT element before passing them to the
+     * JavaScript engine.
+     *
+     * Example:
+     *
+     *     <script>console.log('&hellip;');</script>
+     *
+     *     In an HTML document this would print "&hellip;" to the console,
+     *     but in an XHTML document it would print "…" to the console.
+     *
+     *     <script>console.log('An image is <img> in HTML');</script>
+     *
+     *     In an HTML document this would print "An image is <img> in HTML",
+     *     but it's an invalid XHTML document because it interprets the `<img>`
+     *     as an empty tag missing its closing `/`.
+     *
+     * @see https://www.w3.org/TR/xhtml1/#h-4.8
+     */
     if ( ! $is_html5 ) {
-        $javascript = str_replace( ']]>', ']]]]><![CDATA[>', $javascript ); // Escape any existing CDATA section.
+        /*
+         * If the string `]]>` exists within the JavaScript it would break
+         * out of any wrapping CDATA section added here, so to start, it's
+         * necessary to escape that sequence which requires splitting the
+         * content into two CDATA sections wherever it's found.
+         *
+         * Note: it's only necessary to escape the closing `]]>` because
+         * an additional `<![CDATA[` leaves the contents unchanged.
+         */
+        $javascript = str_replace( ']]>', ']]]]><![CDATA[>', $javascript );
+
+        // Wrap the entire escaped script inside a CDATA section.
         $javascript = sprintf( "/* <![CDATA[ */\n%s\n/* ]]> */", $javascript );
     }
@@ -3300 +3334 @@
     return $editor_settings;
 }
+
+/**
+ * Removes leading and trailing _empty_ script tags.
+ *
+ * This is a helper meant to be used for literal script tag construction
+ * within `wp_get_inline_script_tag()` or `wp_print_inline_script_tag()`.
+ * It removes the literal values of "<script>" and "</script>" from
+ * around an inline script after trimming whitespace. Typlically this
+ * is used in conjunction with output buffering, where `ob_get_clean()`
+ * is passed as the `$contents` argument.
+ *
+ * Example:
+ *
+ *     // Strips exact literal empty SCRIPT tags.
+ *     $js = '<script>sayHello();</script>;
+ *     'sayHello();' === wp_remove_surrounding_empty_script_tags( $js );
+ *
+ *     // Otherwise if anything is different it warns in the JS console.
+ *     $js = '<script type="text/javascript">console.log( "hi" );</script>';
+ *     'console.error( ... )' === wp_remove_surrounding_empty_script_tags( $js );
+ *
+ * @private
+ * @since 6.4.0
+ *
+ * @see wp_print_inline_script_tag()
+ * @see wp_get_inline_script_tag()
+ *
+ * @param string $contents Script body with manually created SCRIPT tag literals.
+ * @return string Script body without surrounding script tag literals, or
+ *                original contents if both exact literals aren't present.
+ */
+function wp_remove_surrounding_empty_script_tags( $contents ) {
+    $contents = trim( $contents );
+    $opener   = '<SCRIPT>';
+    $closer   = '</SCRIPT>';
+
+    if (
+        strlen( $contents ) > strlen( $opener ) + strlen( $closer ) &&
+        strtoupper( substr( $contents, 0, strlen( $opener ) ) ) === $opener &&
+        strtoupper( substr( $contents, -strlen( $closer ) ) ) === $closer
+    ) {
+        return substr( $contents, strlen( $opener ), -strlen( $closer ) );
+    } else {
+        $error_message = __( 'Expected string to start with script tag (without attributes) and end with script tag, with optional whitespace.' );
+        _doing_it_wrong( __FUNCTION__, $error_message, '6.4' );
+        return sprintf( 'console.error(%s)', wp_json_encode( __( 'Function wp_remove_surrounding_empty_script_tags() used incorrectly in PHP.' ) . ' ' . $error_message ) );
+    }
+}

trunk/src/wp-includes/theme-templates.php

@@ -206 +206 @@
     </script>
     <?php
-    $skip_link_script = str_replace( array( '<script>', '</script>' ), '', ob_get_clean() );
+    $skip_link_script = wp_remove_surrounding_empty_script_tags( ob_get_clean() );
     $script_handle    = 'wp-block-template-skip-link';
     wp_register_script( $script_handle, false );

trunk/src/wp-includes/theme.php

@@ -3801 +3801 @@
     </script>
     <?php
-    wp_print_inline_script_tag( str_replace( array( '<script>', '</script>' ), '', ob_get_clean() ) );
+    wp_print_inline_script_tag( wp_remove_surrounding_empty_script_tags( ob_get_clean() ) );
 }
 

trunk/src/wp-includes/widgets/class-wp-widget-archives.php

@@ -121 +121 @@
 </script>
             <?php
-            wp_print_inline_script_tag( str_replace( array( '<script>', '</script>' ), '', ob_get_clean() ) );
+            wp_print_inline_script_tag( wp_remove_surrounding_empty_script_tags( ob_get_clean() ) );
         } else {
             $format = current_theme_supports( 'html5', 'navigation-widgets' ) ? 'html5' : 'xhtml';

trunk/src/wp-includes/widgets/class-wp-widget-categories.php

@@ -109 +109 @@
 
             <?php
-            wp_print_inline_script_tag( str_replace( array( '<script>', '</script>' ), '', ob_get_clean() ) );
+            wp_print_inline_script_tag( wp_remove_surrounding_empty_script_tags( ob_get_clean() ) );
         } else {
             $format = current_theme_supports( 'html5', 'navigation-widgets' ) ? 'html5' : 'xhtml';

trunk/src/wp-login.php

@@ -106 +106 @@
         <script>if("sessionStorage" in window){try{for(var key in sessionStorage){if(key.indexOf("wp-autosave-")!=-1){sessionStorage.removeItem(key)}}}catch(e){}};</script>
         <?php
-        wp_print_inline_script_tag( str_replace( array( '<script>', '</script>' ), '', ob_get_clean() ) );
+        wp_print_inline_script_tag( wp_remove_surrounding_empty_script_tags( ob_get_clean() ) );
     }
 
@@ -420 +420 @@
         ob_start();
         ?>
-        <script>
+        <script type="text/javascript">
         try{document.getElementById('<?php echo $input_id; ?>').focus();}catch(e){}
         if(typeof wpOnload==='function')wpOnload();
         </script>
         <?php
-        wp_print_inline_script_tag( str_replace( array( '<script>', '</script>' ), '', ob_get_clean() ) );
+        wp_print_inline_script_tag( wp_remove_surrounding_empty_script_tags( ob_get_clean() ) );
     }
 
@@ -1363 +1363 @@
                     <script>setTimeout( function(){ new wp.customize.Messenger({ url: '<?php echo wp_customize_url(); ?>', channel: 'login' }).send('login') }, 1000 );</script>
                     <?php
-                    wp_print_inline_script_tag( str_replace( array( '<script>', '</script>' ), '', ob_get_clean() ) );
+                    wp_print_inline_script_tag( wp_remove_surrounding_empty_script_tags( ob_get_clean() ) );
                 }
 
@@ -1628 +1628 @@
             </script>
             <?php
-            wp_print_inline_script_tag( str_replace( array( '<script>', '</script>' ), '', ob_get_clean() ) );
+            wp_print_inline_script_tag( wp_remove_surrounding_empty_script_tags( ob_get_clean() ) );
         }
 

trunk/tests/phpunit/tests/customize/manager.php

@@ -3136 +3136 @@
         ob_start();
         $manager->remove_frameless_preview_messenger_channel();
-        $output = ob_get_clean();
-        $this->assertStringContainsString( '<script', $output );
+        $processor = new WP_HTML_Tag_Processor( ob_get_clean() );
+        $this->assertTrue( $processor->next_tag( 'script' ), 'Failed to find expected SCRIPT element in output.' );
     }
 

trunk/tests/phpunit/tests/dependencies/scripts.php

@@ -261 +261 @@
         wp_enqueue_script( 'dependent-script-a3', '/dependent-script-a3.js', array( 'main-script-a3' ), null );
         $output   = get_echo( 'wp_print_scripts' );
-        $expected = str_replace( "'", '"', "<script type='text/javascript' src='/main-script-a3.js' id='main-script-a3-js' data-wp-strategy='{$strategy}'></script>" );
-        $this->assertStringContainsString( $expected, $output, 'Blocking dependents must force delayed dependencies to become blocking.' );
+        $expected = <<<JS
+            <script type='text/javascript' src='/main-script-a3.js' id='main-script-a3-js' data-wp-strategy='{$strategy}'></script>
+            <script id="dependent-script-a3-js" src="/dependent-script-a3.js" type="text/javascript"></script>
+JS;
+        $this->assertEqualMarkup( $expected, $output, 'Blocking dependents must force delayed dependencies to become blocking.' );
     }
 
@@ -2998 +3001 @@
         }
 
+        // Normalize other whitespace nodes.
+        $xpath = new DOMXPath( $dom );
+        foreach ( $xpath->query( '//text()' ) as $node ) {
+            /** @var DOMText $node */
+            if ( preg_match( '/^\s+$/', $node->nodeValue ) ) {
+                $node->nodeValue = ' ';
+            }
+        }
+
         return $dom;
     }