WordPress.org
Get WordPress

Make WordPress Core

Changeset 56690


Ignore:
Timestamp:
09/25/2023 10:37:00 PM (15 months ago)
Author:
flixos90
Message:

Media: Rely on wp_get_loading_optimization_attributes() to add decoding="async" to images.

The wp_get_loading_optimization_attributes() function was introduced in 6.3, as a single centralized place to control loading optimization attributes for various tags, most importantly images.

This changeset consolidates the decoding="async" optimization, which was added in 6.1, to occur solely as part of wp_get_loading_optimization_attributes(), removing duplicate code and allowing centralized filtering based on [56651].

As part of the change, the wp_img_tag_add_decoding_attr() function has been deprecated. The filter of the same name continues to be maintained for backward compatibility, as before covering only images that are part of a content blob such as post content (the_content).

Props pereirinha, mukesh27, joemcgill, flixos90.
Fixes #58892.
See #53232.

Location:
trunk
Files:
7 edited

Legend:

Unmodified
Added
Removed

  • trunk/src/wp-includes/deprecated.php

    r56682 r56690  
    59955995    update_option( 'https_detection_errors', $support_errors );
    59965996}
     5997
     5998/**
     5999 * Adds `decoding` attribute to an `img` HTML tag.
     6000 *
     6001 * The `decoding` attribute allows developers to indicate whether the
     6002 * browser can decode the image off the main thread (`async`), on the
     6003 * main thread (`sync`) or as determined by the browser (`auto`).
     6004 *
     6005 * By default WordPress adds `decoding="async"` to images but developers
     6006 * can use the {@see 'wp_img_tag_add_decoding_attr'} filter to modify this
     6007 * to remove the attribute or set it to another accepted value.
     6008 *
     6009 * @since 6.1.0
     6010 * @deprecated 6.4.0 Use wp_img_tag_add_loading_optimization_attrs() instead.
     6011 * @see wp_img_tag_add_loading_optimization_attrs()
     6012 *
     6013 * @param string $image   The HTML `img` tag where the attribute should be added.
     6014 * @param string $context Additional context to pass to the filters.
     6015 * @return string Converted `img` tag with `decoding` attribute added.
     6016 */
     6017function wp_img_tag_add_decoding_attr( $image, $context ) {
     6018    _deprecated_function( __FUNCTION__, '6.4.0', 'wp_img_tag_add_loading_optimization_attrs()' );
     6019
     6020    /*
     6021     * Only apply the decoding attribute to images that have a src attribute that
     6022     * starts with a double quote, ensuring escaped JSON is also excluded.
     6023     */
     6024    if ( ! str_contains( $image, ' src="' ) ) {
     6025        return $image;
     6026    }
     6027
     6028    /** This action is documented in wp-includes/media.php */
     6029    $value = apply_filters( 'wp_img_tag_add_decoding_attr', 'async', $image, $context );
     6030
     6031    if ( in_array( $value, array( 'async', 'sync', 'auto' ), true ) ) {
     6032        $image = str_replace( '<img ', '<img decoding="' . esc_attr( $value ) . '" ', $image );
     6033    }
     6034
     6035    return $image;
     6036}

  • trunk/src/wp-includes/media.php

    r56680 r56690  
    10611061
    10621062        $default_attr = array(
    1063             'src'      => $src,
    1064             'class'    => "attachment-$size_class size-$size_class",
    1065             'alt'      => trim( strip_tags( get_post_meta( $attachment_id, '_wp_attachment_image_alt', true ) ) ),
    1066             'decoding' => 'async',
     1063            'src'   => $src,
     1064            'class' => "attachment-$size_class size-$size_class",
     1065            'alt'   => trim( strip_tags( get_post_meta( $attachment_id, '_wp_attachment_image_alt', true ) ) ),
    10671066        );
    10681067
    … …  
    18931892            $filtered_image = wp_img_tag_add_loading_optimization_attrs( $filtered_image, $context );
    18941893
    1895             // Add 'decoding=async' attribute unless a 'decoding' attribute is already present.
    1896             if ( ! str_contains( $filtered_image, ' decoding=' ) ) {
    1897                 $filtered_image = wp_img_tag_add_decoding_attr( $filtered_image, $context );
    1898             }
    1899 
    19001894            /**
    19011895             * Filters an img tag within the content for a given context.
    … …  
    19581952    $loading_val       = preg_match( '/ loading=["\']([A-Za-z]+)["\']/', $image, $match_loading ) ? $match_loading[1] : null;
    19591953    $fetchpriority_val = preg_match( '/ fetchpriority=["\']([A-Za-z]+)["\']/', $image, $match_fetchpriority ) ? $match_fetchpriority[1] : null;
     1954    $decoding_val      = preg_match( '/ decoding=["\']([A-Za-z]+)["\']/', $image, $match_decoding ) ? $match_decoding[1] : null;
    19601955
    19611956    /*
    … …  
    19711966            'loading'       => $loading_val,
    19721967            'fetchpriority' => $fetchpriority_val,
     1968            'decoding'      => $decoding_val,
    19731969        ),
    19741970        $context
    19751971    );
    19761972
    1977     // Images should have source and dimension attributes for the loading optimization attributes to be added.
    1978     if ( ! str_contains( $image, ' src="' ) || ! str_contains( $image, ' width="' ) || ! str_contains( $image, ' height="' ) ) {
     1973    // Images should have source for the loading optimization attributes to be added.
     1974    if ( ! str_contains( $image, ' src="' ) ) {
     1975        return $image;
     1976    }
     1977
     1978    if ( empty( $decoding_val ) ) {
     1979        /**
     1980         * Filters the `decoding` attribute value to add to an image. Default `async`.
     1981         *
     1982         * Returning a falsey value will omit the attribute.
     1983         *
     1984         * @since 6.1.0
     1985         *
     1986         * @param string|false|null $value      The `decoding` attribute value. Returning a falsey value
     1987         *                                      will result in the attribute being omitted for the image.
     1988         *                                      Otherwise, it may be: 'async', 'sync', or 'auto'. Defaults to false.
     1989         * @param string            $image      The HTML `img` tag to be filtered.
     1990         * @param string            $context    Additional context about how the function was called
     1991         *                                      or where the img tag is.
     1992         */
     1993        $filtered_decoding_attr = apply_filters(
     1994            'wp_img_tag_add_decoding_attr',
     1995            isset( $optimization_attrs['decoding'] ) ? $optimization_attrs['decoding'] : false,
     1996            $image,
     1997            $context
     1998        );
     1999
     2000        // Validate the values after filtering.
     2001        if ( isset( $optimization_attrs['decoding'] ) && ! $filtered_decoding_attr ) {
     2002            // Unset `decoding` attribute if `$filtered_decoding_attr` is set to `false`.
     2003            unset( $optimization_attrs['decoding'] );
     2004        } elseif ( in_array( $filtered_decoding_attr, array( 'async', 'sync', 'auto' ), true ) ) {
     2005            $optimization_attrs['decoding'] = $filtered_decoding_attr;
     2006        }
     2007
     2008        if ( ! empty( $optimization_attrs['decoding'] ) ) {
     2009            $image = str_replace( '<img', '<img decoding="' . esc_attr( $optimization_attrs['decoding'] ) . '"', $image );
     2010        }
     2011    }
     2012
     2013    // Images should have dimension attributes for the 'loading' and 'fetchpriority' attributes to be added.
     2014    if ( ! str_contains( $image, ' width="' ) || ! str_contains( $image, ' height="' ) ) {
    19792015        return $image;
    19802016    }
    … …  
    20392075    if ( empty( $fetchpriority_val ) && ! empty( $optimization_attrs['fetchpriority'] ) ) {
    20402076        $image = str_replace( '<img', '<img fetchpriority="' . esc_attr( $optimization_attrs['fetchpriority'] ) . '"', $image );
    2041     }
    2042 
    2043     return $image;
    2044 }
    2045 
    2046 /**
    2047  * Adds `decoding` attribute to an `img` HTML tag.
    2048  *
    2049  * The `decoding` attribute allows developers to indicate whether the
    2050  * browser can decode the image off the main thread (`async`), on the
    2051  * main thread (`sync`) or as determined by the browser (`auto`).
    2052  *
    2053  * By default WordPress adds `decoding="async"` to images but developers
    2054  * can use the {@see 'wp_img_tag_add_decoding_attr'} filter to modify this
    2055  * to remove the attribute or set it to another accepted value.
    2056  *
    2057  * @since 6.1.0
    2058  *
    2059  * @param string $image   The HTML `img` tag where the attribute should be added.
    2060  * @param string $context Additional context to pass to the filters.
    2061  *
    2062  * @return string Converted `img` tag with `decoding` attribute added.
    2063  */
    2064 function wp_img_tag_add_decoding_attr( $image, $context ) {
    2065     /*
    2066      * Only apply the decoding attribute to images that have a src attribute that
    2067      * starts with a double quote, ensuring escaped JSON is also excluded.
    2068      */
    2069     if ( ! str_contains( $image, ' src="' ) ) {
    2070         return $image;
    2071     }
    2072 
    2073     /**
    2074      * Filters the `decoding` attribute value to add to an image. Default `async`.
    2075      *
    2076      * Returning a falsey value will omit the attribute.
    2077      *
    2078      * @since 6.1.0
    2079      *
    2080      * @param string|false|null $value   The `decoding` attribute value. Returning a falsey value
    2081      *                                   will result in the attribute being omitted for the image.
    2082      *                                   Otherwise, it may be: 'async' (default), 'sync', or 'auto'.
    2083      * @param string            $image   The HTML `img` tag to be filtered.
    2084      * @param string            $context Additional context about how the function was called
    2085      *                                   or where the img tag is.
    2086      */
    2087     $value = apply_filters( 'wp_img_tag_add_decoding_attr', 'async', $image, $context );
    2088 
    2089     if ( in_array( $value, array( 'async', 'sync', 'auto' ), true ) ) {
    2090         $image = str_replace( '<img ', '<img decoding="' . esc_attr( $value ) . '" ', $image );
    20912077    }
    20922078
    … …  
    56095595 * - `loading` attribute with a value of "lazy"
    56105596 * - `fetchpriority` attribute with a value of "high"
     5597 * - `decoding` attribute with a value of "async"
    56115598 *
    56125599 * If any of these attributes are already present in the given attributes, they will not be modified. Note that no
    … …  
    56585645    // For now this function only supports images and iframes.
    56595646    if ( 'img' !== $tag_name && 'iframe' !== $tag_name ) {
    5660         /** This filter is documented in wp-includes/media.php */
    5661         return apply_filters( 'wp_get_loading_optimization_attributes', $loading_attrs, $tag_name, $attr, $context );
    5662     }
    5663 
    5664     // For any resources, width and height must be provided, to avoid layout shifts.
    5665     if ( ! isset( $attr['width'], $attr['height'] ) ) {
    56665647        /** This filter is documented in wp-includes/media.php */
    56675648        return apply_filters( 'wp_get_loading_optimization_attributes', $loading_attrs, $tag_name, $attr, $context );
    … …  
    56775658    // TODO: Handle shortcode images together with the content (see https://core.trac.wordpress.org/ticket/58853).
    56785659    if ( 'the_content' !== $context && 'do_shortcode' !== $context && doing_filter( 'the_content' ) ) {
     5660        /** This filter is documented in wp-includes/media.php */
     5661        return apply_filters( 'wp_get_loading_optimization_attributes', $loading_attrs, $tag_name, $attr, $context );
     5662    }
     5663
     5664    /*
     5665     * Add `decoding` with a value of "async" for every image unless it has a
     5666     * conflicting `decoding` attribute already present.
     5667     */
     5668    if ( 'img' === $tag_name ) {
     5669        if ( isset( $attr['decoding'] ) ) {
     5670            $loading_attrs['decoding'] = $attr['decoding'];
     5671        } else {
     5672            $loading_attrs['decoding'] = 'async';
     5673        }
     5674    }
     5675
     5676    // For any resources, width and height must be provided, to avoid layout shifts.
     5677    if ( ! isset( $attr['width'], $attr['height'] ) ) {
    56795678        /** This filter is documented in wp-includes/media.php */
    56805679        return apply_filters( 'wp_get_loading_optimization_attributes', $loading_attrs, $tag_name, $attr, $context );

  • trunk/src/wp-includes/pluggable.php

    r56245 r56690  
    28462846            'fetchpriority' => null,
    28472847            'extra_attr'    => '',
    2848             'decoding'      => 'async',
    28492848        );
    28502849

  • trunk/src/wp-includes/theme.php

    r56687 r56690  
    12891289        $attr,
    12901290        array(
    1291             'src'      => $header->url,
    1292             'width'    => $width,
    1293             'height'   => $height,
    1294             'alt'      => $alt,
    1295             'decoding' => 'async',
     1291            'src'    => $header->url,
     1292            'width'  => $width,
     1293            'height' => $height,
     1294            'alt'    => $alt,
    12961295        )
    12971296    );

  • trunk/src/wp-includes/widgets/class-wp-widget-media-image.php

    r56597 r56690  
    241241
    242242            $attr = array(
    243                 'class'    => $classes,
    244                 'src'      => $instance['url'],
    245                 'alt'      => $instance['alt'],
    246                 'width'    => $instance['width'],
    247                 'height'   => $instance['height'],
    248                 'decoding' => 'async',
     243                'class'  => $classes,
     244                'src'    => $instance['url'],
     245                'alt'    => $instance['alt'],
     246                'width'  => $instance['width'],
     247                'height' => $instance['height'],
    249248            );
    250249

  • trunk/tests/phpunit/tests/media.php

    r56680 r56690  
    22642264            $respimg_html5
    22652265        );
    2266         $content_filtered = wp_img_tag_add_decoding_attr( $content_filtered, 'the_content' );
    22672266
    22682267        // Do not add width, height, and loading.
    22692268        add_filter( 'wp_img_tag_add_width_and_height_attr', '__return_false' );
    22702269        add_filter( 'wp_img_tag_add_loading_attr', '__return_false' );
     2270        add_filter( 'wp_img_tag_add_decoding_attr', '__return_false' );
    22712271
    22722272        $this->assertSame( $content_filtered, wp_filter_content_tags( $content_unfiltered ) );
    … …  
    22742274        remove_filter( 'wp_img_tag_add_width_and_height_attr', '__return_false' );
    22752275        remove_filter( 'wp_img_tag_add_loading_attr', '__return_false' );
     2276        remove_filter( 'wp_img_tag_add_decoding_attr', '__return_false' );
    22762277    }
    22772278
    … …  
    22902291        $img = get_image_tag( self::$large_id, '', '', '', 'medium' );
    22912292        $img = wp_img_tag_add_loading_optimization_attrs( $img, 'test' );
    2292         $img = wp_img_tag_add_decoding_attr( $img, 'the_content' );
    22932293
    22942294        // Replace the src URL.
    … …  
    23052305        $img = get_image_tag( self::$large_id, '', '', '', 'medium' );
    23062306        $img = wp_img_tag_add_loading_optimization_attrs( $img, 'test' );
    2307         $img = wp_img_tag_add_decoding_attr( $img, 'the_content' );
    23082307        $img = preg_replace( '|<img ([^>]+) />|', '<img $1 ' . 'srcset="image2x.jpg 2x" />', $img );
    23092308
    … …  
    24812480            $respimg_relative
    24822481        );
    2483         $expected = wp_img_tag_add_decoding_attr( $expected, 'the_content' );
    24842482
    24852483        $actual = wp_filter_content_tags( $unfiltered );
    … …  
    29742972            $img_no_height
    29752973        );
    2976         $content_filtered = wp_img_tag_add_decoding_attr( $content_filtered, 'the_content' );
    29772974
    29782975        // Do not add loading, srcset, and sizes.
    29792976        add_filter( 'wp_img_tag_add_loading_attr', '__return_false' );
    29802977        add_filter( 'wp_img_tag_add_srcset_and_sizes_attr', '__return_false' );
     2978        add_filter( 'wp_img_tag_add_decoding_attr', '__return_false' );
    29812979
    29822980        $this->assertSame( $content_filtered, wp_filter_content_tags( $content_unfiltered ) );
    … …  
    29842982        remove_filter( 'wp_img_tag_add_loading_attr', '__return_false' );
    29852983        remove_filter( 'wp_img_tag_add_srcset_and_sizes_attr', '__return_false' );
     2984        remove_filter( 'wp_img_tag_add_decoding_attr', '__return_false' );
    29862985    }
    29872986
    … …  
    30043003        $iframe                 = '<iframe src="https://www.example.com" width="640" height="360"></iframe>';
    30053004        $iframe_no_width_height = '<iframe src="https://www.example.com"></iframe>';
     3005
     3006        add_filter( 'wp_img_tag_add_decoding_attr', '__return_false' );
    30063007
    30073008        $lazy_img       = wp_img_tag_add_loading_optimization_attrs( $img, 'test' );
    … …  
    30553056            $iframe_no_width_height
    30563057        );
    3057         $content_filtered = wp_img_tag_add_decoding_attr( $content_filtered, 'the_content' );
    30583058
    30593059        // Do not add width, height, srcset, and sizes.
    … …  
    30653065        remove_filter( 'wp_img_tag_add_width_and_height_attr', '__return_false' );
    30663066        remove_filter( 'wp_img_tag_add_srcset_and_sizes_attr', '__return_false' );
     3067        remove_filter( 'wp_img_tag_add_decoding_attr', '__return_false' );
    30673068    }
    30683069
    … …  
    30753076        $img         = get_image_tag( self::$large_id, '', '', '', 'medium' );
    30763077        $lazy_img    = wp_img_tag_add_loading_optimization_attrs( $img, 'test' );
    3077         $lazy_img    = wp_img_tag_add_decoding_attr( $lazy_img, 'the_content' );
    30783078        $iframe      = '<iframe src="https://www.example.com" width="640" height="360"></iframe>';
    30793079        $lazy_iframe = wp_iframe_tag_add_loading_attr( $iframe, 'test' );
    … …  
    31053105    public function test_wp_filter_content_tags_loading_lazy_opted_out() {
    31063106        $img    = get_image_tag( self::$large_id, '', '', '', 'medium' );
    3107         $img    = wp_img_tag_add_decoding_attr( $img, 'the_content' );
    31083107        $iframe = '<iframe src="https://www.example.com" width="640" height="360"></iframe>';
    31093108
    … …  
    31203119        // Disable globally for all tags.
    31213120        add_filter( 'wp_lazy_loading_enabled', '__return_false' );
     3121        add_filter( 'wp_img_tag_add_decoding_attr', '__return_false' );
    31223122
    31233123        $this->assertSame( $content, wp_filter_content_tags( $content ) );
    31243124        remove_filter( 'wp_lazy_loading_enabled', '__return_false' );
    31253125        remove_filter( 'wp_img_tag_add_srcset_and_sizes_attr', '__return_false' );
     3126        remove_filter( 'wp_img_tag_add_decoding_attr', '__return_false' );
    31263127    }
    31273128
    … …  
    31873188     *
    31883189     * @ticket 56969
     3190     *
     3191     * @expectedDeprecated wp_img_tag_add_decoding_attr
    31893192     */
    31903193    public function test_wp_img_tag_add_decoding_attr_with_single_quotes() {
    … …  
    34363439            'false'       => array(
    34373440                'decoding' => false,
    3438                 'expected' => 'no value',
    3439             ),
    3440             'null'        => array(
    3441                 'decoding' => null,
    34423441                'expected' => 'no value',
    34433442            ),
    … …  
    37203719     * @ticket 53675
    37213720     * @ticket 58235
     3721     * @ticket 58892
    37223722     */
    37233723    public function test_wp_omit_loading_attr_threshold_filter() {
    … …  
    37393739            // Due to the filter, now the first five elements should not be lazy-loaded, i.e. return `false`.
    37403740            for ( $i = 0; $i < 5; $i++ ) {
    3741                 $this->assertEmpty(
     3741                $this->assertSameSetsWithIndex(
     3742                    array(
     3743                        'decoding' => 'async',
     3744                    ),
    37423745                    wp_get_loading_optimization_attributes( 'img', $attr, 'the_content' ),
    37433746                    'Expected second image to not be lazy-loaded.'
    … …  
    37463749
    37473750            // For following elements, lazy-load them again.
    3748             $this->assertSame(
    3749                 array( 'loading' => 'lazy' ),
     3751            $this->assertSameSetsWithIndex(
     3752                array(
     3753                    'decoding' => 'async',
     3754                    'loading'  => 'lazy',
     3755                ),
    37503756                wp_get_loading_optimization_attributes( 'img', $attr, 'the_content' )
    37513757            );
    … …  
    37623768     */
    37633769    public function test_wp_filter_content_tags_with_loading_optimization_attrs() {
     3770        add_filter( 'wp_img_tag_add_decoding_attr', '__return_false' );
    37643771        $img1         = get_image_tag( self::$large_id, '', '', '', 'large' );
    37653772        $iframe1      = '<iframe src="https://www.example.com" width="640" height="360"></iframe>';
    … …  
    37783785        $content_unfiltered = $img1 . $iframe1 . $img2 . $img3 . $iframe2;
    37793786        $content_expected   = $prio_img1 . $iframe1 . $lazy_img2 . $lazy_img3 . $lazy_iframe2;
    3780         $content_expected   = wp_img_tag_add_decoding_attr( $content_expected, 'the_content' );
    37813787
    37823788        $query = $this->get_new_wp_query_for_published_post();
    … …  
    37903796            remove_filter( 'wp_img_tag_add_srcset_and_sizes_attr', '__return_false' );
    37913797        }
     3798        remove_filter( 'wp_img_tag_add_decoding_attr', '__return_false' );
    37923799
    37933800        // After filtering, the first image should not be lazy-loaded while the other ones should be.
    … …  
    41294136     * @ticket 58089
    41304137     * @ticket 58235
     4138     * @ticket 58892
    41314139     *
    41324140     * @covers ::wp_filter_content_tags
    … …  
    41444152                'loading'       => false,
    41454153                'fetchpriority' => false,
     4154                'decoding'      => false,
    41464155            )
    41474156        );
    … …  
    41824191
    41834192        // Ensure that parsed content has the image with fetchpriority as it is the first large image.
    4184         $expected_content = wpautop( str_replace( '<img ', '<img fetchpriority="high" ', $expected_image ) );
     4193        $expected_content = wpautop( str_replace( '<img ', '<img fetchpriority="high" decoding="async" ', $expected_image ) );
    41854194        $this->assertSame( $expected_content, $content, 'Post content with programmatically injected image is missing loading optimization attributes' );
    41864195    }
    … …  
    42624271     * @ticket 56930
    42634272     * @ticket 58235
     4273     * @ticket 58892
    42644274     *
    42654275     * @covers ::wp_get_loading_optimization_attributes
    … …  
    42734283
    42744284        // Return 'lazy' by default.
    4275         $this->assertSame(
    4276             array( 'loading' => 'lazy' ),
     4285        $this->assertSameSetsWithIndex(
     4286            array(
     4287                'decoding' => 'async',
     4288                'loading'  => 'lazy',
     4289            ),
    42774290            wp_get_loading_optimization_attributes( 'img', $attr, 'test' )
    42784291        );
    4279         $this->assertSame(
    4280             array( 'loading' => 'lazy' ),
     4292        $this->assertSameSetsWithIndex(
     4293            array(
     4294                'decoding' => 'async',
     4295                'loading'  => 'lazy',
     4296            ),
    42814297            wp_get_loading_optimization_attributes( 'img', $attr, 'wp_get_attachment_image' )
    42824298        );
    42834299
    42844300        // Return 'lazy' if not in the loop or the main query.
    4285         $this->assertSame(
    4286             array( 'loading' => 'lazy' ),
     4301        $this->assertSameSetsWithIndex(
     4302            array(
     4303                'decoding' => 'async',
     4304                'loading'  => 'lazy',
     4305            ),
    42874306            wp_get_loading_optimization_attributes( 'img', $attr, $context )
    42884307        );
    … …  
    42944313
    42954314            // Return 'lazy' if in the loop but not in the main query.
    4296             $this->assertSame(
    4297                 array( 'loading' => 'lazy' ),
     4315            $this->assertSameSetsWithIndex(
     4316                array(
     4317                    'decoding' => 'async',
     4318                    'loading'  => 'lazy',
     4319                ),
    42984320                wp_get_loading_optimization_attributes( 'img', $attr, $context )
    42994321            );
    … …  
    43034325
    43044326            // First three element are not lazy loaded. However, first image is loaded with fetchpriority high.
    4305             $this->assertSame(
    4306                 array( 'fetchpriority' => 'high' ),
     4327            $this->assertSameSetsWithIndex(
     4328                array(
     4329                    'decoding'      => 'async',
     4330                    'fetchpriority' => 'high',
     4331                ),
    43074332                wp_get_loading_optimization_attributes( 'img', $attr, $context ),
    43084333                "Expected first image to not be lazy-loaded. First large image get's high fetchpriority."
    43094334            );
    4310             $this->assertEmpty(
     4335            $this->assertSameSetsWithIndex(
     4336                array(
     4337                    'decoding' => 'async',
     4338                ),
    43114339                wp_get_loading_optimization_attributes( 'img', $attr, $context ),
    43124340                'Expected second image to not be lazy-loaded.'
    43134341            );
    4314             $this->assertEmpty(
     4342            $this->assertSameSetsWithIndex(
     4343                array(
     4344                    'decoding' => 'async',
     4345                ),
    43154346                wp_get_loading_optimization_attributes( 'img', $attr, $context ),
    43164347                'Expected third image to not be lazy-loaded.'
    … …  
    43184349
    43194350            // Return 'lazy' if in the loop and in the main query for any subsequent elements.
    4320             $this->assertSame(
    4321                 array( 'loading' => 'lazy' ),
     4351            $this->assertSameSetsWithIndex(
     4352                array(
     4353                    'decoding' => 'async',
     4354                    'loading'  => 'lazy',
     4355                ),
    43224356                wp_get_loading_optimization_attributes( 'img', $attr, $context )
    43234357            );
    43244358
    43254359            // Yes, for all subsequent elements.
    4326             $this->assertSame(
    4327                 array( 'loading' => 'lazy' ),
     4360            $this->assertSameSetsWithIndex(
     4361                array(
     4362                    'decoding' => 'async',
     4363                    'loading'  => 'lazy',
     4364                ),
    43284365                wp_get_loading_optimization_attributes( 'img', $attr, $context )
    43294366            );
    … …  
    43454382        $attr = $this->get_width_height_for_high_priority();
    43464383
    4347         $this->assertSame(
    4348             array( 'loading' => 'lazy' ),
     4384        $this->assertSameSetsWithIndex(
     4385            array(
     4386                'decoding' => 'async',
     4387                'loading'  => 'lazy',
     4388            ),
    43494389            wp_get_loading_optimization_attributes( 'img', $attr, $context ),
    43504390            'The "loading" attribute should be "lazy" when not in the loop or the main query.'
    … …  
    43594399            the_post();
    43604400
    4361             $this->assertSame(
    4362                 array( 'fetchpriority' => 'high' ),
     4401            $this->assertSameSetsWithIndex(
     4402                array(
     4403                    'decoding'      => 'async',
     4404                    'fetchpriority' => 'high',
     4405                ),
    43634406                wp_get_loading_optimization_attributes( 'img', $attr, $context ),
    43644407                'The "fetchpriority" attribute should be "high" while in the loop and the main query.'
    … …  
    43894432        $this->set_main_query( $query );
    43904433
    4391         $this->assertSame(
    4392             array( 'loading' => 'lazy' ),
     4434        $this->assertSameSetsWithIndex(
     4435            array(
     4436                'decoding' => 'async',
     4437                'loading'  => 'lazy',
     4438            ),
    43934439            wp_get_loading_optimization_attributes( 'img', $attr, $context ),
    43944440            'The "loading" attribute should be "lazy" before the main query loop.'
    … …  
    43984444            the_post();
    43994445
    4400             $this->assertSame(
    4401                 array( 'fetchpriority' => 'high' ),
     4446            $this->assertSameSetsWithIndex(
     4447                array(
     4448                    'decoding'      => 'async',
     4449                    'fetchpriority' => 'high',
     4450                ),
    44024451                wp_get_loading_optimization_attributes( 'img', $attr, $context ),
    44034452                'The "fetchpriority" attribute should be "high" while in the loop and the main query.'
    … …  
    44684517        add_filter( 'wp_loading_optimization_force_header_contexts', '__return_empty_array' );
    44694518
    4470         $this->assertSame(
    4471             array( 'loading' => 'lazy' ),
     4519        $this->assertSameSetsWithIndex(
     4520            array(
     4521                'decoding' => 'async',
     4522                'loading'  => 'lazy',
     4523            ),
    44724524            wp_get_loading_optimization_attributes( 'img', $attr, $context ),
    44734525            'Images in the header context should get lazy-loaded after the wp_loading_optimization_force_header_contexts filter.'
    … …  
    45034555        );
    45044556
    4505         $this->assertSame(
    4506             array( 'fetchpriority' => 'high' ),
     4557        $this->assertSameSetsWithIndex(
     4558            array(
     4559                'decoding'      => 'async',
     4560                'fetchpriority' => 'high',
     4561            ),
    45074562            wp_get_loading_optimization_attributes( 'img', $attr, 'something_completely_arbitrary' )
    45084563        );
    … …  
    45144569     * @ticket 58211
    45154570     * @ticket 58235
     4571     * @ticket 58892
    45164572     *
    45174573     * @covers ::wp_get_loading_optimization_attributes
    … …  
    45314587
    45324588        // Lazy if not main query.
    4533         $this->assertSame(
    4534             array( 'loading' => 'lazy' ),
     4589        $this->assertSameSetsWithIndex(
     4590            array(
     4591                'decoding' => 'async',
     4592                'loading'  => 'lazy',
     4593            ),
    45354594            wp_get_loading_optimization_attributes( 'img', $attr, $context )
    45364595        );
    … …  
    45424601     * @ticket 58211
    45434602     * @ticket 58235
     4603     * @ticket 58892
    45444604     *
    45454605     * @covers ::wp_get_loading_optimization_attributes
    … …  
    45584618
    45594619        // Lazy if header not called.
    4560         $this->assertSame(
    4561             array( 'loading' => 'lazy' ),
     4620        $this->assertSameSetsWithIndex(
     4621            array(
     4622                'decoding' => 'async',
     4623                'loading'  => 'lazy',
     4624            ),
    45624625            wp_get_loading_optimization_attributes( 'img', $attr, $context )
    45634626        );
    … …  
    45864649
    45874650        // First image is loaded with high fetchpriority.
    4588         $this->assertSame(
    4589             array( 'fetchpriority' => 'high' ),
     4651        $this->assertSameSetsWithIndex(
     4652            array(
     4653                'decoding'      => 'async',
     4654                'fetchpriority' => 'high',
     4655            ),
    45904656            wp_get_loading_optimization_attributes( 'img', $attr, $context ),
    45914657            'Expected first image to not be lazy-loaded. First large image is loaded with high fetchpriority.'
    … …  
    45984664     * @ticket 58211
    45994665     * @ticket 58235
     4666     * @ticket 58892
    46004667     *
    46014668     * @covers ::wp_get_loading_optimization_attributes
    … …  
    46184685
    46194686        $attr = $this->get_width_height_for_high_priority();
    4620         $this->assertSame(
    4621             array( 'loading' => 'lazy' ),
     4687        $this->assertSameSetsWithIndex(
     4688            array(
     4689                'decoding' => 'async',
     4690                'loading'  => 'lazy',
     4691            ),
    46224692            wp_get_loading_optimization_attributes( 'img', $attr, $context )
    46234693        );
    … …  
    46294699     * @ticket 58211
    46304700     * @ticket 58235
     4701     * @ticket 58892
    46314702     *
    46324703     * @covers ::wp_get_loading_optimization_attributes
    … …  
    46494720
    46504721        // Load lazy if the there is no loop and footer was called.
    4651         $this->assertSame(
    4652             array( 'loading' => 'lazy' ),
     4722        $this->assertSameSetsWithIndex(
     4723            array(
     4724                'decoding' => 'async',
     4725                'loading'  => 'lazy',
     4726            ),
    46534727            wp_get_loading_optimization_attributes( 'img', $attr, $context )
    46544728        );
    … …  
    46604734     * @ticket 58089
    46614735     * @ticket 58235
     4736     * @ticket 58892
    46624737     *
    46634738     * @covers ::wp_get_loading_optimization_attributes
    … …  
    46694744    public function test_wp_get_loading_optimization_attributes_should_return_lazy_for_special_contexts_outside_of_the_content( $context ) {
    46704745        $attr = $this->get_width_height_for_high_priority();
    4671         $this->assertSame(
    4672             array( 'loading' => 'lazy' ),
     4746        $this->assertSameSetsWithIndex(
     4747            array(
     4748                'decoding' => 'async',
     4749                'loading'  => 'lazy',
     4750            ),
    46734751            wp_get_loading_optimization_attributes( 'img', $attr, $context )
    46744752        );
    … …  
    47054783
    47064784    /**
     4785     * Tests to cover the decoding attribute within wp_get_loading_optimization_attributes().
     4786     *
     4787     * @ticket 58892
     4788     *
     4789     * @covers ::wp_get_loading_optimization_attributes
     4790     */
     4791    public function test_wp_get_loading_optimization_attributes_decoding_attribute() {
     4792
     4793        $this->assertSameSetsWithIndex(
     4794            array(
     4795                'decoding' => 'async',
     4796            ),
     4797            wp_get_loading_optimization_attributes( 'img', array(), 'the_content' ),
     4798            'Expected decoding attribute to be async.'
     4799        );
     4800
     4801        $this->assertSameSetsWithIndex(
     4802            array(
     4803                'decoding' => 'auto',
     4804            ),
     4805            wp_get_loading_optimization_attributes( 'img', array( 'decoding' => 'auto' ), 'the_content' ),
     4806            'Expected decoding attribute to be auto.'
     4807        );
     4808
     4809        $result = null;
     4810        add_filter(
     4811            'the_content',
     4812            static function ( $content ) use ( &$result ) {
     4813                $result = wp_get_loading_optimization_attributes( 'img', array(), 'something_completely_arbitrary' );
     4814                return $content;
     4815            }
     4816        );
     4817        apply_filters( 'the_content', '' );
     4818
     4819        $this->assertSameSetsWithIndex(
     4820            array(),
     4821            $result,
     4822            'Expected decoding attribute to be empty for img on arbitrary context, while running the_content.'
     4823        );
     4824
     4825        $this->assertSameSetsWithIndex(
     4826            array(),
     4827            wp_get_loading_optimization_attributes( 'iframe', array(), 'the_content' ),
     4828            'Expected decoding attribute to be empty for iframe.'
     4829        );
     4830    }
     4831
     4832    /**
    47074833     * @ticket 44427
    47084834     * @ticket 50367
    … …  
    48104936            array(
    48114937                'loading'       => false,
     4938                'decoding'      => 'async',
    48124939                'fetchpriority' => 'high',
    48134940            )
    … …  
    50165143                    'height' => 100,
    50175144                ),
    5018                 array( 'loading' => 'lazy' ),
    5019                 'Expected default `loading="lazy"`.',
     5145                array(
     5146                    'decoding' => 'async',
     5147                    'loading'  => 'lazy',
     5148                ),
     5149                'Expected default `decoding="async"` and `loading="lazy"`.',
    50205150            ),
    50215151            'img_without_height' => array(
    50225152                'img',
    50235153                array( 'width' => 100 ),
    5024                 array(),
    5025                 'Expected blank array as height is required.',
     5154                array(
     5155                    'decoding' => 'async',
     5156                ),
     5157                'Only `decoding` is set as height is required for `loading` attribute.',
    50265158            ),
    50275159            'img_without_width'  => array(
    50285160                'img',
    50295161                array( 'height' => 100 ),
    5030                 array(),
    5031                 'Expected blank array as width is required.',
     5162                array(
     5163                    'decoding' => 'async',
     5164                ),
     5165                'Only `decoding` is set as width is required for `loading` attribute.',
    50325166            ),
    50335167        );
    … …  
    50625196            'img'    => array(
    50635197                'img',
    5064                 array( 'loading' => 'lazy' ),
    5065                 'Expected `loading="lazy"` for the img.',
     5198                array(
     5199                    'decoding' => 'async',
     5200                    'loading'  => 'lazy',
     5201                ),
     5202                'Expected `decoding="async"` and `loading="lazy"` and `decoding="async"` for the img.',
    50665203            ),
    50675204            'iframe' => array(
    … …  
    51065243
    51075244        // Skip logic if context is `template`.
    5108         $this->assertSame(
    5109             array( 'fetchpriority' => 'high' ),
     5245        $this->assertSameSetsWithIndex(
     5246            array(
     5247                'decoding'      => 'async',
     5248                'fetchpriority' => 'high',
     5249            ),
    51105250            wp_get_loading_optimization_attributes( 'img', $attr, 'template_part_' . WP_TEMPLATE_PART_AREA_HEADER ),
    51115251            'Images in the header block template part should not be lazy-loaded and first large image is set high fetchpriority.'
    … …  
    51155255    /**
    51165256     * @ticket 58235
     5257     * @ticket 58892
    51175258     *
    51185259     * @covers ::wp_get_loading_optimization_attributes
    … …  
    51265267        $this->assertEqualSetsWithIndex(
    51275268            array(
     5269                'decoding'      => 'async',
    51285270                'loading'       => 'lazy',
    51295271                'fetchpriority' => 'high',
    … …  
    51445286
    51455287        // Check fetchpriority high logic if loading attribute is present.
    5146         $this->assertSame(
    5147             array(
     5288        $this->assertSameSetsWithIndex(
     5289            array(
     5290                'decoding'      => 'async',
    51485291                'fetchpriority' => 'high',
    51495292            ),
    … …  
    51675310        // fetchpriority not set as image is of lower resolution.
    51685311        $this->assertSame(
    5169             array(),
     5312            array(
     5313                'decoding' => 'async',
     5314            ),
    51705315            wp_get_loading_optimization_attributes( 'img', $attr, 'test' ),
    51715316            'loading optimization attr array should be empty.'
    … …  
    51835328
    51845329        // The first image processed in a shortcode should have fetchpriority set to high.
    5185         $this->assertSame(
     5330        $this->assertSameSetsWithIndex(
    51865331            $expected,
    51875332            wp_get_loading_optimization_attributes( 'img', $attr, 'do_shortcode' ),
    … …  
    52015346                },
    52025347                'expected' => array(
     5348                    'decoding'      => 'async',
    52035349                    'fetchpriority' => 'high',
    52045350                ),
    … …  
    52185364                },
    52195365                'expected' => array(
    5220                     'loading' => 'lazy',
     5366                    'decoding' => 'async',
     5367                    'loading'  => 'lazy',
    52215368                ),
    5222                 'message'  => 'Lazy-loading not applied to during shortcode rendering.',
     5369                'message'  => 'Lazy-loading or decoding not applied to during shortcode rendering.',
    52235370            ),
    52245371            'shortcode_image_outside_of_the_loop_are_loaded_lazy'  => array(
    … …  
    52285375                },
    52295376                'expected' => array(
    5230                     'loading' => 'lazy',
     5377                    'decoding' => 'async',
     5378                    'loading'  => 'lazy',
    52315379                ),
    5232                 'message'  => 'Lazy-loading not applied to shortcodes outside the loop.',
     5380                'message'  => 'Lazy-loading or decoding not applied to shortcodes outside the loop.',
    52335381            ),
    52345382        );
    … …  
    53275475            ),
    53285476            'image with loading=lazy'       => array(
    5329                 array( 'loading' => 'lazy' ),
     5477                array(
     5478                    'loading'  => 'lazy',
     5479                    'decoding' => 'async',
     5480                ),
    53305481                'img',
    53315482                $this->get_width_height_for_high_priority(),
    … …  
    54645615        $attr = $this->get_width_height_for_high_priority();
    54655616
    5466         $this->assertSame(
     5617        $this->assertSameSetsWithIndex(
    54675618            array( 'fetchpriority' => 'high' ),
    54685619            wp_get_loading_optimization_attributes( 'img', $attr, 'the_content' ),
    … …  
    54735624        add_filter( 'pre_wp_get_loading_optimization_attributes', '__return_false' );
    54745625
    5475         $this->assertSameSets(
    5476             array( 'loading' => 'lazy' ),
     5626        $this->assertSameSetsWithIndex(
     5627            array(
     5628                'decoding' => 'async',
     5629                'loading'  => 'lazy',
     5630            ),
    54775631            wp_get_loading_optimization_attributes( 'img', $attr, 'the_content' ),
    54785632            'The filter did not return the default attributes.'
    … …  
    54825636        add_filter( 'pre_wp_get_loading_optimization_attributes', '__return_empty_array' );
    54835637
    5484         $this->assertSameSets(
     5638        $this->assertSameSetsWithIndex(
    54855639            array(),
    54865640            wp_get_loading_optimization_attributes( 'img', $attr, 'the_content' ),
    … …  
    55045658        );
    55055659
    5506         $this->assertSameSets(
     5660        $this->assertSameSetsWithIndex(
    55075661            array( 'custom_attr' => 'custom_value' ),
    55085662            wp_get_loading_optimization_attributes( 'img', $attr, 'the_content' ),
    … …  
    55195673        $attr = $this->get_width_height_for_high_priority();
    55205674
    5521         $this->assertSameSets(
    5522             array( 'loading' => 'lazy' ),
     5675        $this->assertSameSetsWithIndex(
     5676            array(
     5677                'decoding' => 'async',
     5678                'loading'  => 'lazy',
     5679            ),
    55235680            wp_get_loading_optimization_attributes( 'img', $attr, 'the_content' ),
    55245681            'Before the filter it will not return the loading attribute.'
    … …  
    55375694        );
    55385695
    5539         $this->assertSameSets(
    5540             array( 'fetchpriority' => 'high' ),
     5696        $this->assertSameSetsWithIndex(
     5697            array(
     5698                'decoding'      => 'async',
     5699                'fetchpriority' => 'high',
     5700            ),
    55415701            wp_get_loading_optimization_attributes( 'img', $attr, 'the_content' ),
    55425702            'After the filter it will not return the fetchpriority attribute.'

  • trunk/tests/phpunit/tests/media/wpImageTagAddDecodingAttr.php

    r56559 r56690  
    2020     * @param string $decoding The value for the 'decoding' attribute. 'no value' for default.
    2121     * @param string $expected The expected `img` tag.
     22     *
     23     * @expectedDeprecated wp_img_tag_add_decoding_attr
    2224     */
    2325    public function test_should_add_decoding_attr( $image, $context, $decoding, $expected ) {
    … …  
    8183     * @param mixed  $decoding The value for the 'decoding' attribute. 'no value' for default.
    8284     * @param string $expected The expected `img` tag.
     85     *
     86     * @expectedDeprecated wp_img_tag_add_decoding_attr
    8387     */
    8488    public function test_should_not_add_decoding_attr( $image, $context, $decoding, $expected ) {
Note: See TracChangeset for help on using the changeset viewer.