Revert changes to bindings replacement logic to not use regex (WordPr…

…ess#62355)

* Revert changes to bindings replacement logic

* Add backport changelog

Co-authored-by: SantosGuillamot <santosguillamot@git.wordpress.org>
Co-authored-by: kevin940726 <kevin940726@git.wordpress.org>
Co-authored-by: talldan <talldanwp@git.wordpress.org>

backport-changelog/6.6/6744.md

@@ -0,0 +1,3 @@
+https://github.com/WordPress/wordpress-develop/pull/6744
+
+* https://github.com/WordPress/gutenberg/pull/62355

lib/compat/wordpress-6.5/blocks.php

@@ -65,27 +65,68 @@ function gutenberg_block_bindings_replace_html( $block_content, $block_name, str
 	switch ( $block_type->attributes[ $attribute_name ]['source'] ) {
 		case 'html':
 		case 'rich-text':
-			// Hardcode the selectors and processing until the HTML API is able to read CSS selectors and replace inner HTML.
-			// TODO: Use the HTML API instead.
-			if ( 'core/paragraph' === $block_name && 'content' === $attribute_name ) {
-				$selector = 'p';
-			}
-			if ( 'core/heading' === $block_name && 'content' === $attribute_name ) {
-				$selector = 'h[1-6]';
+			$block_reader = new WP_HTML_Tag_Processor( $block_content );
+
+			// TODO: Support for CSS selectors whenever they are ready in the HTML API.
+			// In the meantime, support comma-separated selectors by exploding them into an array.
+			$selectors = explode( ',', $block_type->attributes[ $attribute_name ]['selector'] );
+			// Add a bookmark to the first tag to be able to iterate over the selectors.
+			$block_reader->next_tag();
+			$block_reader->set_bookmark( 'iterate-selectors' );
+
+			// TODO: This shouldn't be needed when the `set_inner_html` function is ready.
+			// Store the parent tag and its attributes to be able to restore them later in the button.
+			// The button block has a wrapper while the paragraph and heading blocks don't.
+			if ( 'core/button' === $block_name ) {
+				$button_wrapper                 = $block_reader->get_tag();
+				$button_wrapper_attribute_names = $block_reader->get_attribute_names_with_prefix( '' );
+				$button_wrapper_attrs           = array();
+				foreach ( $button_wrapper_attribute_names as $name ) {
+					$button_wrapper_attrs[ $name ] = $block_reader->get_attribute( $name );
+				}
 			}
-			if ( 'core/button' === $block_name && 'text' === $attribute_name ) {
-				// Check if it is a <button> or <a> tag.
-				if ( preg_match( '/<button[^>]*>.*?<\/button>/', $block_content ) ) {
-					$selector = 'button';
+
+			foreach ( $selectors as $selector ) {
+				// If the parent tag, or any of its children, matches the selector, replace the HTML.
+				if ( strcasecmp( $block_reader->get_tag( $selector ), $selector ) === 0 || $block_reader->next_tag(
+					array(
+						'tag_name' => $selector,
+					)
+				) ) {
+					$block_reader->release_bookmark( 'iterate-selectors' );
+
+					// TODO: Use `set_inner_html` method whenever it's ready in the HTML API.
+					// Until then, it is hardcoded for the paragraph, heading, and button blocks.
+					// Store the tag and its attributes to be able to restore them later.
+					$selector_attribute_names = $block_reader->get_attribute_names_with_prefix( '' );
+					$selector_attrs           = array();
+					foreach ( $selector_attribute_names as $name ) {
+						$selector_attrs[ $name ] = $block_reader->get_attribute( $name );
+					}
+					$selector_markup = "<$selector>" . wp_kses_post( $source_value ) . "</$selector>";
+					$amended_content = new WP_HTML_Tag_Processor( $selector_markup );
+					$amended_content->next_tag();
+					foreach ( $selector_attrs as $attribute_key => $attribute_value ) {
+						$amended_content->set_attribute( $attribute_key, $attribute_value );
+					}
+					if ( 'core/paragraph' === $block_name || 'core/heading' === $block_name ) {
+						return $amended_content->get_updated_html();
+					}
+					if ( 'core/button' === $block_name ) {
+						$button_markup  = "<$button_wrapper>{$amended_content->get_updated_html()}</$button_wrapper>";
+						$amended_button = new WP_HTML_Tag_Processor( $button_markup );
+						$amended_button->next_tag();
+						foreach ( $button_wrapper_attrs as $attribute_key => $attribute_value ) {
+							$amended_button->set_attribute( $attribute_key, $attribute_value );
+						}
+						return $amended_button->get_updated_html();
+					}
 				} else {
-					$selector = 'a';
+					$block_reader->seek( 'iterate-selectors' );
 				}
 			}
-			if ( empty( $selector ) ) {
-				return $block_content;
-			}
-			$pattern = '/(<' . $selector . '[^>]*>).*?(<\/' . $selector . '>)/i';
-			return preg_replace( $pattern, '$1' . wp_kses_post( $source_value ) . '$2', $block_content );
+			$block_reader->release_bookmark( 'iterate-selectors' );
+			return $block_content;
 
 		case 'attribute':
 			$amended_content = new WP_HTML_Tag_Processor( $block_content );