Set the value of all data-wp-each-child to the top most data-wp-each element

Author: DAreRodz

src/wp-includes/interactivity-api/class-wp-interactivity-api.php

@@ -1272,13 +1272,11 @@ private function data_wp_each_processor( WP_Interactivity_API_Directives_Process
 				 *
 				 * Nested `data-wp-each` directives could render
 				 * `data-wp-each-child` elements at the top level as well, and
-				 * they should be ignored.
+				 * they should be overwritten.
 				 */
 				$i = new WP_Interactivity_API_Directives_Processor( $processed_item );
 				while ( $i->next_tag() ) {
-					if ( ! $i->get_attribute( 'data-wp-each-child' ) ) {
-						$i->set_attribute( 'data-wp-each-child', $namespace_value . '::' . $path );
-					}
+					$i->set_attribute( 'data-wp-each-child', $namespace_value . '::' . $path );
 					$i->next_balanced_tag_closer_tag();
 				}
 				$processed_content .= $i->get_updated_html();

tests/phpunit/tests/interactivity-api/wpInteractivityAPI-wp-each.php

@@ -477,14 +477,14 @@ public function test_wp_each_nested_template_tags() {
 			'<template data-wp-each-child="myPlugin::state.list" data-wp-each--item2="myPlugin::state.list2">' .
 				'<span data-wp-text="myPlugin::context.item2"></span>' .
 			'</template>' .
-			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.item2">3</span>' .
-			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.item2">4</span>' .
+			'<span data-wp-each-child="myPlugin::state.list" data-wp-text="myPlugin::context.item2">3</span>' .
+			'<span data-wp-each-child="myPlugin::state.list" data-wp-text="myPlugin::context.item2">4</span>' .
 			'<span data-wp-each-child="myPlugin::state.list" data-wp-text="myPlugin::context.item1">2</span>' .
 			'<template data-wp-each-child="myPlugin::state.list" data-wp-each--item2="myPlugin::state.list2">' .
 				'<span data-wp-text="myPlugin::context.item2"></span>' .
 			'</template>' .
-			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.item2">3</span>' .
-			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.item2">4</span>' .
+			'<span data-wp-each-child="myPlugin::state.list" data-wp-text="myPlugin::context.item2">3</span>' .
+			'<span data-wp-each-child="myPlugin::state.list" data-wp-text="myPlugin::context.item2">4</span>' .
 			'<div id="after-wp-each" data-wp-bind--id="myPlugin::state.after">Text</div>';
 		$new      = $this->interactivity->process_directives( $original );
 		$this->assertSame( $expected, $new );
@@ -519,18 +519,18 @@ public function test_wp_each_directly_nested_template_tags() {
 				'<span data-wp-text="myPlugin::context.item1"></span>' .
 				'<span data-wp-text="myPlugin::context.item2"></span>' .
 			'</template>' .
-			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.item1">1</span>' .
-			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.item2">3</span>' .
-			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.item1">1</span>' .
-			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.item2">4</span>' .
+			'<span data-wp-each-child="myPlugin::state.list" data-wp-text="myPlugin::context.item1">1</span>' .
+			'<span data-wp-each-child="myPlugin::state.list" data-wp-text="myPlugin::context.item2">3</span>' .
+			'<span data-wp-each-child="myPlugin::state.list" data-wp-text="myPlugin::context.item1">1</span>' .
+			'<span data-wp-each-child="myPlugin::state.list" data-wp-text="myPlugin::context.item2">4</span>' .
 			'<template data-wp-each-child="myPlugin::state.list" data-wp-each--item2="myPlugin::state.list2">' .
 				'<span data-wp-text="myPlugin::context.item1"></span>' .
 				'<span data-wp-text="myPlugin::context.item2"></span>' .
 			'</template>' .
-			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.item1">2</span>' .
-			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.item2">3</span>' .
-			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.item1">2</span>' .
-			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.item2">4</span>' .
+			'<span data-wp-each-child="myPlugin::state.list" data-wp-text="myPlugin::context.item1">2</span>' .
+			'<span data-wp-each-child="myPlugin::state.list" data-wp-text="myPlugin::context.item2">3</span>' .
+			'<span data-wp-each-child="myPlugin::state.list" data-wp-text="myPlugin::context.item1">2</span>' .
+			'<span data-wp-each-child="myPlugin::state.list" data-wp-text="myPlugin::context.item2">4</span>' .
 			'<div id="after-wp-each" data-wp-bind--id="myPlugin::state.after">Text</div>';
 		$new      = $this->interactivity->process_directives( $original );
 		$this->assertSame( $expected, $new );
@@ -562,13 +562,13 @@ public function test_wp_each_nested_template_tags_using_previous_item_as_list()
 			'<template data-wp-each-child="myPlugin::state.list2" data-wp-each--number="myPlugin::context.list">' .
 				'<span data-wp-text="myPlugin::context.number"></span>' .
 			'</template>' .
-			'<span data-wp-each-child="myPlugin::context.list" data-wp-text="myPlugin::context.number">1</span>' .
-			'<span data-wp-each-child="myPlugin::context.list" data-wp-text="myPlugin::context.number">2</span>' .
+			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.number">1</span>' .
+			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.number">2</span>' .
 			'<template data-wp-each-child="myPlugin::state.list2" data-wp-each--number="myPlugin::context.list">' .
 				'<span data-wp-text="myPlugin::context.number"></span>' .
 			'</template>' .
-			'<span data-wp-each-child="myPlugin::context.list" data-wp-text="myPlugin::context.number">3</span>' .
-			'<span data-wp-each-child="myPlugin::context.list" data-wp-text="myPlugin::context.number">4</span>' .
+			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.number">3</span>' .
+			'<span data-wp-each-child="myPlugin::state.list2" data-wp-text="myPlugin::context.number">4</span>' .
 			'<div id="after-wp-each" data-wp-bind--id="myPlugin::state.after">Text</div>';
 		$new      = $this->interactivity->process_directives( $original );
 		$this->assertSame( $expected, $new );