Changeset 56142

Timestamp:

07/05/2023 07:28:02 PM (15 months ago)

Author:

flixos90

Message:

Media: Ensure custom header image tag supports loading optimization attributes.

This changeset is a follow up to [56037] and ensures that the get_header_image_tag() function receives the benefits of wp_get_loading_optimization_attributes() as well. Prior to fetchpriority support, this was not needed since the header image should never be lazy-loaded, but the image certainly is a fetchpriority candidate, so therefore it is crucial to have it supported.

Props felipeelia, spacedmonkey, mukesh27, westonruter, flixos90.
Fixes #58680.

Location:

trunk

Files:

• src/wp-includes/media.php (modified) (1 diff)
• src/wp-includes/theme.php (modified) (2 diffs)
• tests/phpunit/tests/theme/customHeader.php (modified) (1 diff)

trunk/src/wp-includes/media.php

@@ -5644 +5644 @@
     }
 
+    // The custom header image is always expected to be in the header.
+    if ( 'get_header_image_tag' === $context ) {
+        return $postprocess( $loading_attrs, true );
+    }
+
     // Special handling for programmatically created image tags.
     if ( 'the_post_thumbnail' === $context || 'wp_get_attachment_image' === $context ) {

trunk/src/wp-includes/theme.php

@@ -1238 +1238 @@
         $attr,
         array(
-            'src'    => $header->url,
-            'width'  => $width,
-            'height' => $height,
-            'alt'    => $alt,
+            'src'      => $header->url,
+            'width'    => $width,
+            'height'   => $height,
+            'alt'      => $alt,
+            'decoding' => 'async',
         )
     );
@@ -1264 +1265 @@
             }
         }
+    }
+
+    $attr = array_merge(
+        $attr,
+        wp_get_loading_optimization_attributes( 'img', $attr, 'get_header_image_tag' )
+    );
+
+    /*
+     * If the default value of `lazy` for the `loading` attribute is overridden
+     * to omit the attribute for this image, ensure it is not included.
+     */
+    if ( isset( $attr['loading'] ) && ! $attr['loading'] ) {
+        unset( $attr['loading'] );
+    }
+
+    // If the `fetchpriority` attribute is overridden and set to false or an empty string.
+    if ( isset( $attr['fetchpriority'] ) && ! $attr['fetchpriority'] ) {
+        unset( $attr['fetchpriority'] );
+    }
+
+    // If the `decoding` attribute is overridden and set to false or an empty string.
+    if ( isset( $attr['decoding'] ) && ! $attr['decoding'] ) {
+        unset( $attr['decoding'] );
     }
 

trunk/tests/phpunit/tests/theme/customHeader.php

@@ -175 +175 @@
     }
 
+    /**
+     * Tests default values of performance attributes for "get_header_image_tag".
+     *
+     * @ticket 58680
+     */
+    public function test_get_header_image_tag_with_default_performance_attributes() {
+        $this->add_theme_support(
+            array(
+                'default-image' => 'http://localhost/default-header.jpg',
+                'width'         => 60,
+                'height'        => 60,
+            )
+        );
+
+        add_filter(
+            'wp_min_priority_img_pixels',
+            static function() {
+                return 2500; // 50*50=2500
+            }
+        );
+
+        wp_high_priority_element_flag( true );
+
+        $html = get_header_image_tag();
+        $this->assertStringNotContainsString( ' loading="lazy"', $html );
+        $this->assertStringContainsString( ' fetchpriority="high"', $html );
+        $this->assertStringContainsString( ' decoding="async"', $html );
+    }
+
+    /**
+     * Tests custom values of performance attributes for "get_header_image_tag".
+     *
+     * @ticket 58680
+     */
+    public function test_get_header_image_tag_with_custom_performance_attributes() {
+        $this->add_theme_support(
+            array(
+                'default-image' => 'http://localhost/default-header.jpg',
+                'width'         => 500,
+                'height'        => 500,
+            )
+        );
+
+        $html = get_header_image_tag(
+            array(
+                'fetchpriority' => '',
+                'decoding'      => '',
+            )
+        );
+        $this->assertStringNotContainsString( ' fetchpriority="high"', $html );
+        $this->assertStringNotContainsString( ' decoding="async"', $html );
+    }
+
+    /**
+     * Tests custom lazy loading for "get_header_image_tag".
+     *
+     * @ticket 58680
+     */
+    public function test_get_header_image_tag_with_custom_lazy_loading() {
+        $this->add_theme_support(
+            array(
+                'default-image' => 'http://localhost/default-header.jpg',
+                'width'         => 500,
+                'height'        => 500,
+            )
+        );
+
+        $html = get_header_image_tag(
+            array(
+                'loading' => 'lazy',
+            )
+        );
+        $this->assertStringNotContainsString( ' fetchpriority="high"', $html );
+        $this->assertStringContainsString( ' loading="lazy"', $html );
+    }
+
     public function test_get_custom_header_markup_without_registered_default_image() {
         $this->add_theme_support();