Add fetchpriority=low to IMG tags in collapsed Details blocks

packages/block-library/src/details/index.php

@@ -0,0 +1,47 @@
+<?php
+/**
+ * Server-side rendering of the `core/details` block.
+ *
+ * @package WordPress
+ */
+
+/**
+ * Sets fetchpriority="low" on all IMG tags within the collapsed Details block.
+ *
+ * Images in a collapsed Details block are hidden until the block is expanded, so they should
+ * not compete with any resources in the critical rendering path, such as the LCP element image.
+ *
+ * @since 7.0.0
+ *
+ * @param string $block_content The block content.
+ * @param array  $block         The full block, including name and attributes.
+ * @return string Modified HTML with fetchpriority="low" on all IMG tags when the showContent attribute is false.
+ */
+function block_core_details_set_img_fetchpriority_low( $block_content, array $block ): string {
+	if ( ! is_string( $block_content ) ) {
+		return '';
+	}
+
+	// If the Details block is open by default, short-circuit to let core add fetchpriority=high if appropriate.
+	if ( $block['attrs']['showContent'] ?? false ) {
+		return $block_content;
+	}
+
+	$tags = new WP_HTML_Tag_Processor( $block_content );
+	while ( $tags->next_tag( 'IMG' ) ) {
+		$tags->set_attribute( 'fetchpriority', 'low' );
+	}
+	return $tags->get_updated_html();
+}
+
+add_filter( 'render_block_core/details', 'block_core_details_set_img_fetchpriority_low', 10, 2 );
+
+/**
+ * Registers the `core/details` block on server.
+ *
+ * @since 7.0.0
+ */
+function register_block_core_details() {
+	register_block_type_from_metadata( __DIR__ . '/details' );
+}
+add_action( 'init', 'register_block_core_details' );

phpunit/blocks/render-block-details-test.php

@@ -0,0 +1,72 @@
+<?php
+/**
+ * Details block rendering tests.
+ *
+ * @package WordPress
+ * @subpackage Blocks
+ */
+
+/**
+ * Tests for the Details block.
+ *
+ * @group blocks
+ */
+class Tests_Blocks_Render_Details extends WP_UnitTestCase {
+
+	/**
+	 * @covers ::block_core_details_set_img_fetchpriority_low
+	 */
+	public function test_should_add_fetchpriority_low_to_img_in_collapsed_details_block(): void {
+		$details_block = <<<'BLOCK_CONTENT'
+			<!-- wp:details -->
+			<details class="wp-block-details"><summary>Collapsed</summary><!-- wp:image {"linkDestination":"none"} -->
+			<figure class="wp-block-image size-large"><img src="https://example.com/image.jpg" alt="" /></figure>
+			<!-- /wp:image --></details>
+			<!-- /wp:details -->
+		BLOCK_CONTENT;
+
+		$rendered_block = do_blocks( $details_block );
+
+		$processor = new WP_HTML_Tag_Processor( $rendered_block );
+		$this->assertTrue( $processor->next_tag( 'IMG' ) );
+		$this->assertSame( 'low', $processor->get_attribute( 'fetchpriority' ) );
+	}
+
+	/**
+	 * @covers ::block_core_details_set_img_fetchpriority_low
+	 */
+	public function test_should_not_add_fetchpriority_low_to_img_in_expanded_details_block(): void {
+		$details_block = <<<'BLOCK_CONTENT'
+			<!-- wp:details {"showContent":true} -->
+			<details class="wp-block-details" open><summary>Expanded</summary><!-- wp:image {"linkDestination":"none"} -->
+			<figure class="wp-block-image size-large"><img src="https://example.com/image.jpg" alt="" /></figure>
+			<!-- /wp:image --></details>
+			<!-- /wp:details -->
+		BLOCK_CONTENT;
+
+		$rendered_block = do_blocks( $details_block );
+
+		$processor = new WP_HTML_Tag_Processor( $rendered_block );
+		$this->assertTrue( $processor->next_tag( 'IMG' ) );
+		$this->assertNotSame( 'low', $processor->get_attribute( 'fetchpriority' ) );
+	}
+
+	/**
+	 * @covers ::block_core_details_set_img_fetchpriority_low
+	 */
+	public function test_should_preserve_fetchpriority_high_on_img_in_expanded_details_block(): void {
+		$details_block = <<<'BLOCK_CONTENT'
+			<!-- wp:details {"showContent":true} -->
+			<details class="wp-block-details" open><summary>Expanded</summary><!-- wp:image {"linkDestination":"none"} -->
+			<figure class="wp-block-image size-large"><img src="https://example.com/image.jpg" fetchpriority="high" alt="" /></figure>
+			<!-- /wp:image --></details>
+			<!-- /wp:details -->
+		BLOCK_CONTENT;
+
+		$rendered_block = do_blocks( $details_block );
+
+		$processor = new WP_HTML_Tag_Processor( $rendered_block );
+		$this->assertTrue( $processor->next_tag( 'IMG' ) );
+		$this->assertSame( 'high', $processor->get_attribute( 'fetchpriority' ) );
+	}
+}