Skip to content
5 changes: 5 additions & 0 deletions src/class-tiny-source-base.php
Original file line number Diff line number Diff line change
Expand Up @@ -240,6 +240,11 @@ protected function create_alternative_sources( $original_source_html ) {
$source_attr_parts[ $attr ] = $attr_value;
}
}
} else {
$sizes_value = $this->get_attribute_value( $original_source_html, 'sizes' );
if ( $sizes_value ) {
$source_attr_parts['sizes'] = $sizes_value;
}
}

$source_attr_parts['type'] = $mimetype;
Expand Down
15 changes: 15 additions & 0 deletions test/unit/TinyPictureTest.php
Original file line number Diff line number Diff line change
Expand Up @@ -366,6 +366,21 @@ public function test_image_without_src() {
$this->assertSame($expected, $output);
}

/**
* sizes attribute on <img> also have to be set to <source> elements
*/
public function test_img_sizes_attribute_is_propagated_to_sources() {
$this->wp->createImage(1000, '2026/04', 'test-320w.webp');
$this->wp->createImage(1000, '2026/04', 'test-640w.webp');
$this->wp->createImage(1000, '2026/04', 'test.webp');

$input = '<img srcset="/wp-content/uploads/2026/04/test-320w.jpg 320w, /wp-content/uploads/2026/04/test-640w.jpg 640w" sizes="(max-width: 600px) 320px, 640px" src="/wp-content/uploads/2026/04/test.jpg">';
$expected = '<picture><source srcset="/wp-content/uploads/2026/04/test-320w.webp 320w, /wp-content/uploads/2026/04/test-640w.webp 640w" sizes="(max-width: 600px) 320px, 640px" type="image/webp" /><img srcset="/wp-content/uploads/2026/04/test-320w.jpg 320w, /wp-content/uploads/2026/04/test-640w.jpg 640w" sizes="(max-width: 600px) 320px, 640px" src="/wp-content/uploads/2026/04/test.jpg"></picture>';
$output = $this->tiny_picture->replace_sources($input);

$this->assertSame($expected, $output);
}

/**
* Images with only a srcset are valid and will be wrapped
*/
Expand Down
Loading