Media: Ensure that the image widget supports loading optimization attributes.

This changeset adds support for loading optimization attributes such as `loading="lazy"` and `fetchpriority="high"` to the image widget. A new context `widget_media_image` is introduced for that purpose.

Props spacedmonkey, thekt12, mukesh27, westonruter.
Fixes #58704.
See #58235.


git-svn-id: https://develop.svn.wordpress.org/trunk@56154 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Felix Arntz
2023-07-06 16:31:02 +00:00
parent e9d0712b49
commit 21490c6ba4
4 changed files with 42 additions and 10 deletions

View File

@@ -5662,7 +5662,7 @@ function wp_get_loading_optimization_attributes( $tag_name, $attr, $context ) {
}
// Special handling for programmatically created image tags.
if ( 'the_post_thumbnail' === $context || 'wp_get_attachment_image' === $context ) {
if ( 'the_post_thumbnail' === $context || 'wp_get_attachment_image' === $context || 'widget_media_image' === $context ) {
/*
* Skip programmatically created images within post content as they need to be handled together with the other
* images within the post content.

View File

@@ -239,14 +239,31 @@ class WP_Widget_Media_Image extends WP_Widget_Media {
$instance['height'] = '';
}
$image = sprintf(
'<img class="%1$s" src="%2$s" alt="%3$s" width="%4$s" height="%5$s" />',
esc_attr( $classes ),
esc_url( $instance['url'] ),
esc_attr( $instance['alt'] ),
esc_attr( $instance['width'] ),
esc_attr( $instance['height'] )
$attr = array(
'class' => $classes,
'src' => $instance['url'],
'alt' => $instance['alt'],
'width' => $instance['width'],
'height' => $instance['height'],
'decoding' => 'async',
);
$loading_optimization_attr = wp_get_loading_optimization_attributes(
'img',
$attr,
'widget_media_image'
);
$attr = array_merge( $attr, $loading_optimization_attr );
$attr = array_map( 'esc_attr', $attr );
$image = '<img';
foreach ( $attr as $name => $value ) {
$image .= ' ' . $name . '="' . $value . '"';
}
$image .= ' />';
} // End if().
$url = '';

View File

@@ -4191,7 +4191,7 @@ EOF;
*
* @expectedDeprecated wp_get_loading_attr_default
*
* @dataProvider data_special_contexts_for_the_content
* @dataProvider data_special_contexts_for_the_content_wp_get_loading_attr_default
*
* @param string $context Context for the element for which the `loading` attribute value is requested.
*/
@@ -4208,7 +4208,7 @@ EOF;
*
* @expectedDeprecated wp_get_loading_attr_default
*
* @dataProvider data_special_contexts_for_the_content
* @dataProvider data_special_contexts_for_the_content_wp_get_loading_attr_default
*
* @param string $context Context for the element for which the `loading` attribute value is requested.
*/
@@ -4233,6 +4233,19 @@ EOF;
* @return array[]
*/
public function data_special_contexts_for_the_content() {
return array(
'widget_media_image' => array( 'context' => 'widget_media_image' ),
'the_post_thumbnail' => array( 'context' => 'the_post_thumbnail' ),
'wp_get_attachment_image' => array( 'context' => 'wp_get_attachment_image' ),
);
}
/**
* Data provider.
*
* @return array[]
*/
public function data_special_contexts_for_the_content_wp_get_loading_attr_default() {
return array(
'the_post_thumbnail' => array( 'context' => 'the_post_thumbnail' ),
'wp_get_attachment_image' => array( 'context' => 'wp_get_attachment_image' ),

View File

@@ -494,6 +494,8 @@ class Tests_Widgets_wpWidgetMediaImage extends WP_UnitTestCase {
// Custom image class.
$this->assertStringContainsString( 'src="http://example.org/url/to/image.jpg"', $output );
$this->assertStringContainsString( 'decoding="async"', $output );
$this->assertStringContainsString( 'loading="lazy"', $output );
// Link settings.
ob_start();