<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"

"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />

<title>[60295] trunk/tests/phpunit: Tests: Add new `assertEqualHTML` assertion.</title>

</head>

<body>

<style type="text/css"><!--

#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }

#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }

#msg dt:after { content:':';}

#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt;  }

#msg dl a { font-weight: bold}

#msg dl a:link    { color:#fc3; }

#msg dl a:active  { color:#ff0; }

#msg dl a:visited { color:#cc6; }

h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }

#msg pre { white-space: pre-line; overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }

#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }

#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }

#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }

#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }

#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }

#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }

#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }

#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }

#logmsg pre { background: #eee; padding: 1em; }

#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}

#logmsg dl { margin: 0; }

#logmsg dt { font-weight: bold; }

#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }

#logmsg dd:before { content:'\00bb';}

#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }

#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }

#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }

#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }

#logmsg table th.Corner { text-align: left; }

#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }

#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }

#patch { width: 100%; }

#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}

#patch .propset h4, #patch .binary h4 {margin:0;}

#patch pre {padding:0;line-height:1.2em;margin:0;}

#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}

#patch .propset .diff, #patch .binary .diff  {padding:10px 0;}

#patch span {display:block;padding:0 10px;}

#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}

#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}

#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}

#patch .lines, .info {color:#888;background:#fff;}

--></style>

<div id="msg">

<dl class="meta" style="font-size: 105%">

<dt style="float: left; width: 6em; font-weight: bold">Revision</dt> <dd><a style="font-weight: bold" href="https://core.trac.wordpress.org/changeset/60295">60295</a><script type="application/ld+json">{"@context":"http://schema.org","@type":"EmailMessage","description":"Review this Commit","action":{"@type":"ViewAction","url":"https://core.trac.wordpress.org/changeset/60295","name":"Review Commit"}}</script></dd>

<dt style="float: left; width: 6em; font-weight: bold">Author</dt> <dd>Bernhard Reiter</dd>

<dt style="float: left; width: 6em; font-weight: bold">Date</dt> <dd>2025-06-10 10:23:38 +0000 (Tue, 10 Jun 2025)</dd>

</dl>

<pre style='padding-left: 1em; margin: 2em 0; border-left: 2px solid #ccc; line-height: 1.25; font-size: 105%; font-family: sans-serif'>Tests: Add new `assertEqualHTML` assertion.

Add a new `assertEqualHTML` method to `WP_UnitTestClass` for tests comparing HTML (potentially including block markup).

Internally, the assertion builds a deterministic tree string representation of the markup (using the HTML API) and compares the results. The format of the tree is inspired by the HTML5lib-tests tree format. It is extended with a special representation of block delimiters and their attributes. This format also makes it easier to visually spot the differences between the two strings if the assertion fails.

Finally, this changeset updates `Tests_Dependencies_Scripts` to remove its `assertEqualMarkup` and `parse_markup_fragment` methods, and to use the newly introduced `assertEqualHTML` instead.

Props bernhard-reiter, jonsurrell, dmsnell, jorbin, gziolo.

Fixes <a href="https://core.trac.wordpress.org/ticket/63527">#63527</a>.</pre>

<h3>Modified Paths</h3>

<ul>

<li><a href="#trunktestsphpunitincludesabstracttestcasephp">trunk/tests/phpunit/includes/abstract-testcase.php</a></li>

<li><a href="#trunktestsphpunittestsdependenciesscriptsphp">trunk/tests/phpunit/tests/dependencies/scripts.php</a></li>

</ul>

<h3>Added Paths</h3>

<ul>

<li><a href="#trunktestsphpunitincludesbuildvisualhtmltreephp">trunk/tests/phpunit/includes/build-visual-html-tree.php</a></li>

<li><a href="#trunktestsphpunittestsbuildvisualhtmltreephp">trunk/tests/phpunit/tests/build-visual-html-tree.php</a></li>

</ul>

</div>

<div id="patch">

<h3>Diff</h3>

<a id="trunktestsphpunitincludesabstracttestcasephp"></a>

<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/tests/phpunit/includes/abstract-testcase.php</h4>

<pre class="diff"><span>

<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/tests/phpunit/includes/abstract-testcase.php        2025-06-09 18:49:44 UTC (rev 60294)

+++ trunk/tests/phpunit/includes/abstract-testcase.php  2025-06-10 10:23:38 UTC (rev 60295)

</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1,5 +1,6 @@

</span><span class="cx" style="display: block; padding: 0 10px"> <?php

</span><span class="cx" style="display: block; padding: 0 10px"> 

</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+require_once __DIR__ . '/build-visual-html-tree.php';

</ins><span class="cx" style="display: block; padding: 0 10px"> require_once __DIR__ . '/factory.php';

</span><span class="cx" style="display: block; padding: 0 10px"> require_once __DIR__ . '/trac.php';

</span><span class="cx" style="display: block; padding: 0 10px"> 

</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -13,7 +14,6 @@

<span class="cx" style="display: block; padding: 0 10px">  * All WordPress unit tests should inherit from this class.

</span><span class="cx" style="display: block; padding: 0 10px">  */

</span><span class="cx" style="display: block; padding: 0 10px"> abstract class WP_UnitTestCase_Base extends PHPUnit_Adapter_TestCase {

</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-

</del><span class="cx" style="display: block; padding: 0 10px">         protected static $forced_tickets   = array();

</span><span class="cx" style="display: block; padding: 0 10px">        protected $expected_deprecated     = array();

</span><span class="cx" style="display: block; padding: 0 10px">        protected $caught_deprecated       = array();

</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1181,6 +1181,44 @@

</span><span class="cx" style="display: block; padding: 0 10px">        }

</span><span class="cx" style="display: block; padding: 0 10px"> 

</span><span class="cx" style="display: block; padding: 0 10px">        /**

<ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+         * Check HTML markup (including blocks) for semantic equivalence.

+        *

+        * Given two markup strings, assert that they translate to the same semantic HTML tree,

+        * normalizing tag names, attribute names, and attribute order. Furthermore, attributes

+        * and class names are sorted and deduplicated, and whitespace in style attributes

+        * is normalized. Finally, block delimiter comments are recognized and normalized,

+        * applying the same principles.

+        *

+        * @since 6.9.0

+        *

+        * @param string      $expected         The expected HTML.

+        * @param string      $actual           The actual HTML.

+        * @param string|null $fragment_context Optional. The fragment context, for example "<td>" expected HTML

+        *                                      must occur within "<table><tr>" fragment context. Default "<body>".

+        *                                      Only "<body>" or `null` are supported at this time.

+        *                                      Set to `null` to parse a full HTML document.

+        * @param string|null $message          Optional. The assertion error message.

+        */

+       public function assertEqualHTML( string $expected, string $actual, ?string $fragment_context = '<body>', $message = 'HTML markup was not equivalent.' ): void {

+               try {

+                       $tree_expected = build_visual_html_tree( $expected, $fragment_context );

+                       $tree_actual   = build_visual_html_tree( $actual, $fragment_context );

+               } catch ( Exception $e ) {

+                       // For PHP 8.4+, we can retry, using the built-in DOM\HTMLDocument parser.

+                       if ( class_exists( 'DOM\HtmlDocument' ) ) {

+                               $dom_expected  = DOM\HtmlDocument::createFromString( $expected, LIBXML_NOERROR );

+                               $tree_expected = build_visual_html_tree( $dom_expected->saveHtml(), $fragment_context );

+                               $dom_actual    = DOM\HtmlDocument::createFromString( $actual, LIBXML_NOERROR );

+                               $tree_actual   = build_visual_html_tree( $dom_actual->saveHtml(), $fragment_context );

+                       } else {

+                               throw $e;

+                       }

+               }

+

+               $this->assertSame( $tree_expected, $tree_actual, $message );

+       }

+

+       /**

</ins><span class="cx" style="display: block; padding: 0 10px">          * Helper function to convert a single-level array containing text strings to a named data provider.

</span><span class="cx" style="display: block; padding: 0 10px">         *

<span class="cx" style="display: block; padding: 0 10px">         * The value of the data set will also be used as the name of the data set.

</span></span></pre></div>

<a id="trunktestsphpunitincludesbuildvisualhtmltreephp"></a>

<div class="addfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Added: trunk/tests/phpunit/includes/build-visual-html-tree.php</h4>

<pre class="diff"><span>

<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/tests/phpunit/includes/build-visual-html-tree.php                           (rev 0)

+++ trunk/tests/phpunit/includes/build-visual-html-tree.php     2025-06-10 10:23:38 UTC (rev 60295)

</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -0,0 +1,304 @@

</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+<?php

+

+/* phpcs:disable WordPress.Security.EscapeOutput.ExceptionNotEscaped */

+

+/**

+ * Generates representation of the semantic HTML tree structure.

+ *

+ * This is inspired by the representation used by the HTML5lib tests. It's been extended here for

+ * blocks to render the semantic structure of blocks and their attributes.

+ * The order of attributes and class names is normalized both for HTML tags and blocks,

+ * as is the whitespace in HTML tags' style attribute.

+ *

+ * For example, consider the following block markup:

+ *

+ *     <!-- wp:separator {"className":"is-style-default has-custom-classname","style":{"spacing":{"margin":{"top":"50px","bottom":"50px"}}},"backgroundColor":"accent-1"} -->

+ *         <hr class="wp-block-separator is-style-default has-custom-classname" style="margin-top: 50px; margin-bottom: 50px" />

+ *     <!-- /wp:separator -->

+ *

+ * This will be represented as:

+ *

+ *     BLOCK["core/separator"]

+ *       {

+ *         "backgroundColor": "accent-1",

+ *         "className": "has-custom-classname is-style-default",

+ *         "style": {

+ *           "spacing": {

+ *             "margin": {

+ *               "top": "50px",

+ *               "bottom": "50px"

+ *             }

+ *           }

+ *         }

+ *       }

+ *       <hr>

+ *         class="has-custom-classname is-style-default wp-block-separator"

+ *         style="margin-top:50px;margin-bottom:50px;"

+ *

+ *

+ * @see https://github.com/WordPress/wordpress-develop/blob/trunk/tests/phpunit/data/html5lib-tests/tree-construction/README.md

+ *

+ * @since 6.9.0

+ *

+ * @throws WP_HTML_Unsupported_Exception|Error If the markup could not be parsed.

+ *

+ * @param string      $html             Given test HTML.

+ * @param string|null $fragment_context Context element in which to parse HTML, such as BODY or SVG.

+ * @return string Tree structure of parsed HTML, if supported.

+ */

+function build_visual_html_tree( string $html, ?string $fragment_context ): string {

+       $processor = $fragment_context

+               ? WP_HTML_Processor::create_fragment( $html, $fragment_context )

+               : WP_HTML_Processor::create_full_parser( $html );

+       if ( null === $processor ) {

+               throw new Error( 'Could not create a parser.' );

+       }

+       $tree_indent = '  ';

+

+       $output       = '';

+       $indent_level = 0;

+       $was_text     = null;

+       $text_node    = '';

+

+       $block_context = array();

+

+       while ( $processor->next_token() ) {

+               if ( null !== $processor->get_last_error() ) {

+                       break;

+               }

+

+               $token_name = $processor->get_token_name();

+               $token_type = $processor->get_token_type();

+               $is_closer  = $processor->is_tag_closer();

+

+               if ( $was_text && '#text' !== $token_name ) {

+                       if ( '' !== $text_node ) {

+                               $output .= "{$text_node}\"\n";

+                       }

+                       $was_text  = false;

+                       $text_node = '';

+               }

+

+               switch ( $token_type ) {

+                       case '#doctype':

+                               $doctype = $processor->get_doctype_info();

+                               $output .= "<!DOCTYPE {$doctype->name}";

+                               if ( null !== $doctype->public_identifier || null !== $doctype->system_identifier ) {

+                                       $output .= " \"{$doctype->public_identifier}\" \"{$doctype->system_identifier}\"";

+                               }

+                               $output .= ">\n";

+                               break;

+

+                       case '#tag':

+                               $namespace = $processor->get_namespace();

+                               $tag_name  = 'html' === $namespace

+                                       ? strtolower( $processor->get_tag() )

+                                       : "{$namespace} {$processor->get_qualified_tag_name()}";

+

+                               if ( $is_closer ) {

+                                       --$indent_level;

+

+                                       if ( 'html' === $namespace && 'TEMPLATE' === $token_name ) {

+                                               --$indent_level;

+                                       }

+

+                                       break;

+                               }

+

+                               $tag_indent = $indent_level;

+

+                               if ( $processor->expects_closer() ) {

+                                       ++$indent_level;

+                               }

+

+                               $output .= str_repeat( $tree_indent, $tag_indent ) . "<{$tag_name}>\n";

+

+                               $attribute_names = $processor->get_attribute_names_with_prefix( '' );

+                               if ( $attribute_names ) {

+                                       $sorted_attributes = array();

+                                       foreach ( $attribute_names as $attribute_name ) {

+                                               $sorted_attributes[ $attribute_name ] = $processor->get_qualified_attribute_name( $attribute_name );

+                                       }

+

+                                       /*

+                                        * Sorts attributes to match html5lib sort order.

+                                        *

+                                        *  - First comes normal HTML attributes.

+                                        *  - Then come adjusted foreign attributes; these have spaces in their names.

+                                        *  - Finally come non-adjusted foreign attributes; these have a colon in their names.

+                                        *

+                                        * Example:

+                                        *

+                                        *       From: <math xlink:author definitionurl xlink:title xlink:show>

+                                        *     Sorted: 'definitionURL', 'xlink show', 'xlink title', 'xlink:author'

+                                        */

+                                       uasort(

+                                               $sorted_attributes,

+                                               static function ( $a, $b ) {

+                                                       $a_has_ns = str_contains( $a, ':' );

+                                                       $b_has_ns = str_contains( $b, ':' );

+

+                                                       // Attributes with `:` should follow all other attributes.

+                                                       if ( $a_has_ns !== $b_has_ns ) {

+                                                               return $a_has_ns ? 1 : -1;

+                                                       }

+

+                                                       $a_has_sp = str_contains( $a, ' ' );

+                                                       $b_has_sp = str_contains( $b, ' ' );

+

+                                                       // Attributes with a namespace ' ' should come after those without.

+                                                       if ( $a_has_sp !== $b_has_sp ) {

+                                                               return $a_has_sp ? 1 : -1;

+                                                       }

+

+                                                       return $a <=> $b;

+                                               }

+                                       );

+

+                                       foreach ( $sorted_attributes as $attribute_name => $display_name ) {

+                                               $val = $processor->get_attribute( $attribute_name );

+                                               /*

+                                                * Attributes with no value are `true` with the HTML API,

+                                                * we use the empty string value in the tree structure.

+                                                */

+                                               if ( true === $val ) {

+                                                       $val = '';

+                                               } elseif ( 'class' === $attribute_name ) {

+                                                       $class_names = iterator_to_array( $processor->class_list() );

+                                                       sort( $class_names, SORT_STRING );

+                                                       $val = implode( ' ', $class_names );

+                                               } elseif ( 'style' === $attribute_name ) {

+                                                       $normalized_style = '';

+                                                       foreach ( explode( ';', $val ) as $style ) {

+                                                               if ( empty( trim( $style ) ) ) {

+                                                                       continue;

+                                                               }

+                                                               list( $style_key, $style_val ) = explode( ':', $style );

+

+                                                               $style_key = trim( $style_key );

+                                                               $style_val = trim( $style_val );

+

+                                                               $normalized_style .= "{$style_key}:{$style_val};";

+                                                       }

+                                                       $val = $normalized_style;

+                                               }

+                                               $output .= str_repeat( $tree_indent, $tag_indent + 1 ) . "{$display_name}=\"{$val}\"\n";

+                                       }

+                               }

+

+                               // Self-contained tags contain their inner contents as modifiable text.

+                               $modifiable_text = $processor->get_modifiable_text();

+                               if ( '' !== $modifiable_text ) {

+                                       $output .= str_repeat( $tree_indent, $tag_indent + 1 ) . "\"{$modifiable_text}\"\n";

+                               }

+

+                               if ( 'html' === $namespace && 'TEMPLATE' === $token_name ) {

+                                       $output .= str_repeat( $tree_indent, $indent_level ) . "content\n";

+                                       ++$indent_level;

+                               }

+

+                               break;

+

+                       case '#cdata-section':

+                       case '#text':

+                               $text_content = $processor->get_modifiable_text();

+                               if ( '' === trim( $text_content, " \f\t\r\n" ) ) {

+                                       break;

+                               }

+                               $was_text = true;

+                               if ( '' === $text_node ) {

+                                       $text_node .= str_repeat( $tree_indent, $indent_level ) . '"';

+                               }

+                               $text_node .= $text_content;

+                               break;

+

+                       case '#funky-comment':

+                               // Comments must be "<" then "!-- " then the data then " -->".

+                               $output .= str_repeat( $tree_indent, $indent_level ) . "<!-- {$processor->get_modifiable_text()} -->\n";

+                               break;

+

+                       case '#comment':

+                               // Comments must be "<" then "!--" then the data then "-->".

+                               $comment = "<!--{$processor->get_full_comment_text()}-->";

+

+                               // Maybe the comment is a block delimiter.

+                               $parser           = new WP_Block_Parser();

+                               $parser->document = $comment;

+                               $parser->offset   = 0;

+                               list( $delimiter_type, $block_name, $block_attrs, $start_offset, $token_length ) = $parser->next_token();

+

+                               switch ( $delimiter_type ) {

+                                       case 'block-opener':

+                                       case 'void-block':

+                                               $output .= str_repeat( $tree_indent, $indent_level ) . "BLOCK[\"{$block_name}\"]\n";

+

+                                               if ( 'block-opener' === $delimiter_type ) {

+                                                       $block_context[] = $block_name;

+                                                       ++$indent_level;

+                                               }

+

+                                               // If they're no attributes, we're done here.

+                                               if ( empty( $block_attrs ) ) {

+                                                       break;

+                                               }

+

+                                               // Normalize attribute order.

+                                               ksort( $block_attrs, SORT_STRING );

+

+                                               if ( isset( $block_attrs['className'] ) ) {

+                                                       // Normalize class name order (and de-duplicate), as we need to be tolerant of different orders.

+                                                       // (Style attributes don't need this treatment, as they are parsed into a nested array.)

+                                                       $block_class_processor = new WP_HTML_Tag_Processor( '<div>' );

+                                                       $block_class_processor->next_token();

+                                                       $block_class_processor->set_attribute( 'class', $block_attrs['className'] );

+                                                       $class_names = iterator_to_array( $block_class_processor->class_list() );

+                                                       sort( $class_names, SORT_STRING );

+                                                       $block_attrs['className'] = implode( ' ', $class_names );

+                                               }

+

+                                               $block_attrs = json_encode( $block_attrs, JSON_PRETTY_PRINT );

+                                               // Fix indentation by "halving" it (2 spaces instead of 4).

+                                               // Additionally, we need to indent each line by the current indentation level.

+                                               $block_attrs = preg_replace( '/^( +)\1/m', str_repeat( $tree_indent, $indent_level ) . '$1', $block_attrs );

+                                               // Finally, indent the first line, and the last line (with the closing curly brace).

+                                               $output .= str_repeat( $tree_indent, $indent_level ) . substr( $block_attrs, 0, -1 ) . str_repeat( $tree_indent, $indent_level ) . "}\n";

+                                               break;

+                                       case 'block-closer':

+                                               // Is this a closer for the currently open block?

+                                               if ( ! empty( $block_context ) && end( $block_context ) === $block_name ) {

+                                                       // If it's a closer, we don't add it to the output.

+                                                       // Instead, we decrease indentation and remove the block from block context stack.

+                                                       --$indent_level;

+                                                       array_pop( $block_context );

+                                               }

+                                               break;

+                                       default: // Not a block delimiter.

+                                               $output .= str_repeat( $tree_indent, $indent_level ) . $comment . "\n";

+                                               break;

+                               }

+                               break;

+                       default:

+                               // phpcs:ignore WordPress.PHP.DevelopmentFunctions.error_log_var_export

+                               $serialized_token_type = var_export( $processor->get_token_type(), true );

+                               throw new Error( "Unhandled token type for tree construction: {$serialized_token_type}" );

+               }

+       }

+

+       if ( null !== $processor->get_unsupported_exception() ) {

+               throw $processor->get_unsupported_exception();

+       }

+

+       if ( null !== $processor->get_last_error() ) {

+               throw new Error( "Parser error: {$processor->get_last_error()}" );

+       }

+

+       if ( $processor->paused_at_incomplete_token() ) {

+               throw new Error( 'Paused at incomplete token.' );

+       }

+

+       if ( '' !== $text_node ) {

+               $output .= "{$text_node}\"\n";

+       }

+

+       return $output;

+}

</ins></span></pre></div>

<a id="trunktestsphpunittestsbuildvisualhtmltreephp"></a>

<div class="addfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Added: trunk/tests/phpunit/tests/build-visual-html-tree.php</h4>

<pre class="diff"><span>

<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/tests/phpunit/tests/build-visual-html-tree.php                              (rev 0)

+++ trunk/tests/phpunit/tests/build-visual-html-tree.php        2025-06-10 10:23:38 UTC (rev 60295)

</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -0,0 +1,144 @@

</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+<?php

+

+/**

+ * Tests for build_visual_html_tree().

+ *

+ * @package WordPress

+ *

+ * @group testsuite

+ */

+class Tests_Build_Equivalent_HTML_Semantic_Tree extends WP_UnitTestCase {

+       public function data_build_equivalent_html_semantic_tree() {

+               $block_markup = <<<END

+                       <!-- wp:separator {"className":"is-style-default has-custom-classname","style":{"spacing":{"margin":{"top":"50px","bottom":"50px"}}},"backgroundColor":"accent-1"} -->

+                         <hr class="wp-block-separator is-style-default has-custom-classname" style="margin-top: 50px; margin-bottom: 50px" />

+                       <!-- /wp:separator -->

+END;

+

+               $tree_structure = <<<END

+BLOCK["core/separator"]

+  {

+    "backgroundColor": "accent-1",

+    "className": "has-custom-classname is-style-default",

+    "style": {

+      "spacing": {

+        "margin": {

+          "top": "50px",

+          "bottom": "50px"

+        }

+      }

+    }

+  }

+  <hr>

+    class="has-custom-classname is-style-default wp-block-separator"

+    style="margin-top:50px;margin-bottom:50px;"

+

+END;

+

+               return array(

+                       'Block delimiter' => array( $block_markup, $tree_structure ),

+               );

+       }

+

+       /**

+        * @ticket 63527

+        *

+        * @covers ::build_visual_html_tree

+        *

+        * @dataProvider data_build_equivalent_html_semantic_tree

+        */

+       public function test_build_equivalent_html_semantic_tree( $markup, $expected ) {

+               $actual = build_visual_html_tree( $markup, '<body>' );

+               $this->assertSame( $expected, $actual );

+       }

+

+       public function data_build_equivalent_html_semantic_tree_with_equivalent_html() {

+               return array(

+                       'Different attribute order'                => array(

+                               '<img src="wp.png" alt="The WordPress logo">',

+                               '<img alt="The WordPress logo" src="wp.png">',

+                       ),

+                       'Different class name order'               => array(

+                               '<hr class="wp-block-separator is-style-default">',

+                               '<hr class="is-style-default wp-block-separator">',

+                       ),

+                       'Differences in style attribute whitespace and trailing semicolon' => array(

+                               '<hr style="margin-top: 50px; margin-bottom: 50px;">',

+                               '<hr style="margin-top:50px;margin-bottom: 50px">',

+                       ),

+                       'Different block attribute order'          => array(

+                               '<!-- wp:separator {"className":"is-style-default","backgroundColor":"accent-1"} -->',

+                               '<!-- wp:separator {"backgroundColor":"accent-1","className":"is-style-default"} -->',

+                       ),

+                       'Different block class name order'         => array(

+                               '<!-- wp:separator {"className":"is-style-default has-custom-classname"} -->',

+                               '<!-- wp:separator {"className":"has-custom-classname is-style-default"} -->',

+                       ),

+                       'Different whitespace in block class name' => array(

+                               '<!-- wp:separator {"className":"wp-block-separator is-style-default"} -->',

+                               '<!-- wp:separator {"className":"wp-block-separator   is-style-default "} -->',

+                       ),

+                       'Duplicated block class names'             => array(

+                               '<!-- wp:separator {"className":"wp-block-separator is-style-default"} -->',

+                               '<!-- wp:separator {"className":"wp-block-separator is-style-default wp-block-separator"} -->',

+                       ),

+                       'Different Capitalization of tag'          => array(

+                               '<IMG src="wp.png" alt="The WordPress logo">',

+                               '<img src="wp.png" alt="The WordPress logo">',

+                       ),

+               );

+       }

+

+       /**

+        * @ticket 63527

+        *

+        * @covers ::build_visual_html_tree

+        *

+        * @dataProvider data_build_equivalent_html_semantic_tree_with_equivalent_html

+        */

+       public function test_build_equivalent_html_semantic_tree_with_equivalent_html( $expected, $actual ) {

+               $tree_expected = build_visual_html_tree( $expected, '<body>' );

+               $tree_actual   = build_visual_html_tree( $actual, '<body>' );

+

+               $this->assertSame( $tree_expected, $tree_actual );

+       }

+

+       public function data_build_equivalent_html_semantic_tree_with_non_equivalent_html() {

+               return array(

+                       'Different attributes'             => array(

+                               '<img src="wp.png" alt="The WordPress logo">',

+                               '<img alt="The WordPress logo" src="wp.png" title="WordPress">',

+                       ),

+                       'Different class names'            => array(

+                               '<hr class="wp-block-separator is-style-default">',

+                               '<hr class="is-style-default wp-block-hairline">',

+                       ),

+                       'Different styles'                 => array(

+                               '<hr style="margin-top: 50px; margin-bottom: 50px;">',

+                               '<hr style="margin-top: 50px; margin-bottom: 100px">',

+                       ),

+                       'Different comments'               => array(

+                               '<!-- abc -->',

+                               '<!-- xyz -->',

+                       ),

+                       'Semantically relevant whitespace' => array(

+                               '<div style="color: rgb(50 139 31)">Test</div>',

+                               '<div style="color:rgb(5013931)">Test</div>',

+                       ),

+               );

+       }

+

+       /**

+        * @ticket 63527

+        *

+        * @covers ::build_visual_html_tree

+        *

+        * @dataProvider data_build_equivalent_html_semantic_tree_with_non_equivalent_html

+        */

+       public function test_build_equivalent_html_semantic_tree_with_non_equivalent_html( $expected, $actual ) {

+               $tree_expected = build_visual_html_tree( $expected, '<body>' );

+               $tree_actual   = build_visual_html_tree( $actual, '<body>' );

+

+               $this->assertNotSame( $tree_expected, $tree_actual );

+       }

+}

</ins></span></pre></div>

<a id="trunktestsphpunittestsdependenciesscriptsphp"></a>

<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/tests/phpunit/tests/dependencies/scripts.php</h4>

<pre class="diff"><span>

<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/tests/phpunit/tests/dependencies/scripts.php        2025-06-09 18:49:44 UTC (rev 60294)

+++ trunk/tests/phpunit/tests/dependencies/scripts.php  2025-06-10 10:23:38 UTC (rev 60295)

</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -79,7 +79,7 @@

</span><span class="cx" style="display: block; padding: 0 10px">                $expected .= "<script type='text/javascript' src='http://example.com?ver=1.2' id='empty-deps-version-js'></script>\n";

</span><span class="cx" style="display: block; padding: 0 10px">                $expected .= "<script type='text/javascript' src='http://example.com' id='empty-deps-null-version-js'></script>\n";

</span><span class="cx" style="display: block; padding: 0 10px"> 

</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-                $this->assertEqualMarkup( $expected, get_echo( 'wp_print_scripts' ) );

</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+         $this->assertEqualHTML( $expected, get_echo( 'wp_print_scripts' ) );

</ins><span class="cx" style="display: block; padding: 0 10px"> 