Image in collapsed Details block may erroneously get `fetchpriority=high` even though hidden

[westonruter]

Description

This is closely related to the Navigation Overlay issue:

• Image in navigation overlay can get fetchpriority=high and degrade LCP metric for page #76181

Given a post content that contains two Details block, with an Image block in each:

<!-- wp:details -->
<details class="wp-block-details"><summary>Collapsed kitty</summary><!-- wp:image {"id":415,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large"><img src="http://localhost:8000/wp-content/uploads/2026/03/PXL_20260302_201050363-1024x771.jpg" alt="" class="wp-image-415"/></figure>
<!-- /wp:image --></details>
<!-- /wp:details -->

<!-- wp:details {"showContent":true} -->
<details class="wp-block-details" open><summary>Expanded bison</summary><!-- wp:image {"id":37,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large"><img src="http://localhost:8000/wp-content/uploads/2025/11/Bison_with_its_young-2560w-1024x683.jpg" alt="" class="wp-image-37"/></figure>
<!-- /wp:image --></details>
<!-- /wp:details -->

This is rendered by WordPress as follows:

❌ The IMG in the collapsed Details block gets fetchpriority=high even though it is not displayed:

<details class="wp-block-details">
  <summary>Collapsed kitty</summary>
  <figure class="wp-block-image size-large">
    <img
      fetchpriority="high"
      decoding="async"
      width="1024"
      height="771"
      sizes="(max-width: 645px) 100vw, 645px"
      src="http://localhost:8000/wp-content/uploads/2026/03/PXL_20260302_201050363-1024x771.jpg"
      alt=""
      class="wp-image-415"
      srcset="
        http://localhost:8000/wp-content/uploads/2026/03/PXL_20260302_201050363-1024x771.jpg  1024w,
        http://localhost:8000/wp-content/uploads/2026/03/PXL_20260302_201050363-300x226.jpg    300w,
        http://localhost:8000/wp-content/uploads/2026/03/PXL_20260302_201050363-768x578.jpg    768w,
        http://localhost:8000/wp-content/uploads/2026/03/PXL_20260302_201050363-1536x1157.jpg 1536w,
        http://localhost:8000/wp-content/uploads/2026/03/PXL_20260302_201050363-2048x1542.jpg 2048w
      "
    />
  </figure>
</details>

<details class="wp-block-details" open>
  <summary>Expanded bison</summary>
  <figure class="wp-block-image size-large">
    <img
      decoding="async"
      width="1024"
      height="683"
      sizes="(max-width: 645px) 100vw, 645px"
      src="http://localhost:8000/wp-content/uploads/2025/11/Bison_with_its_young-2560w-1024x683.jpg"
      alt=""
      class="wp-image-37"
      srcset="
        http://localhost:8000/wp-content/uploads/2025/11/Bison_with_its_young-2560w-1024x683.jpg  1024w,
        http://localhost:8000/wp-content/uploads/2025/11/Bison_with_its_young-2560w-300x200.jpg    300w,
        http://localhost:8000/wp-content/uploads/2025/11/Bison_with_its_young-2560w-768x512.jpg    768w,
        http://localhost:8000/wp-content/uploads/2025/11/Bison_with_its_young-2560w-1536x1025.jpg 1536w,
        http://localhost:8000/wp-content/uploads/2025/11/Bison_with_its_young-2560w-2048x1366.jpg 2048w
      "
    />
  </figure>
</details>

Step-by-step reproduction instructions

See above.

Screenshots, screen recording, code snippet

No response

Environment info

• WordPress 7.0-beta3, Gutenberg @ 47e6413

Please confirm that you have searched existing issues in the repo.

• Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

• Yes

Please confirm which theme type you used for testing.

• Block
• Classic
• Hybrid (e.g. classic with theme.json)
• Not sure

[westonruter]

Related:

• Block Visibility: IMG in viewport-conditional block may get fetchpriority=high even when not displayed #76301