Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[5.x]: Image Transforms srcset are broken in 5.6.0.2 #16486

Closed
MattWilcox opened this issue Jan 22, 2025 · 2 comments · Fixed by #16495
Closed

[5.x]: Image Transforms srcset are broken in 5.6.0.2 #16486

MattWilcox opened this issue Jan 22, 2025 · 2 comments · Fixed by #16495
Labels

Comments

@MattWilcox
Copy link

MattWilcox commented Jan 22, 2025

What happened?

Description

Image Transforms are broken in Craft 5.6.0.2 on DDEV, they all output the same path.

Our project on Craft 5.5.10 outputs this code for the Image tag's srcset values:

https://craft5-vca.ddev.site/content/images/native-transforms/_420x280_crop_center-center_80_none/38/test-page-6.webp 420w,
https://craft5-vca.ddev.site/content/images/native-transforms/_720x480_crop_center-center_80_none/38/test-page-6.webp 720w,
https://craft5-vca.ddev.site/content/images/native-transforms/_1440x960_crop_center-center_80_none/38/test-page-6.webp 1440w,
https://craft5-vca.ddev.site/content/images/native-transforms/_2160x1440_crop_center-center_80_none/38/test-page-6.webp 2160w

Running ddev composer update, ddev craft up, clearing the caches, and then refreshing the same page results in the following srcset values being output:

https://craft5-vca.ddev.site/content/images/native-transforms/_landscape32/38/test-page-6.webp 420w, 
https://craft5-vca.ddev.site/content/images/native-transforms/_landscape32/38/test-page-6.webp 720w,
https://craft5-vca.ddev.site/content/images/native-transforms/_landscape32/38/test-page-6.webp 1440w,
https://craft5-vca.ddev.site/content/images/native-transforms/_landscape32/38/test-page-6.webp 2160w

Here's the TWIG code generating the images:

	{# What image crop was chosen (this will map the the image transform) #}
	{% set chosenImageCrop = imageEntry.imageCrop.value %}

	{# Load the image into a variable #}
	{% set theImage = imageEntry.singlePhoto
		.eagerly()
		.withTransforms([ chosenImageCrop ])
		.one()
	%}

	{# Use the dropdown crop value to select the matching defined Image Transform to apply on the source image #}
	{% do theImage.setTransform( chosenImageCrop ) %}

	{# Ok, that's the base "small" transform, so lets generate larger transforms AS NEEDED #}
	{% switch chosenImageCrop %}
		{% case
			'uncropped' or
			'landscape32' or
			'landscape169' or
			'landscape2391'
		%}
			{% set srcSet = ['420w', '720w', '1440w', '2160w'] %}
		{% case
			'portrait23' or
			'square'
		%}
			{% set srcSet = ['420w', '720w'] %}
		{% default %}
			{% set srcSet = ['420w'] %}
	{% endswitch %}

	{# Now output the tag #}
	<img
		src="{{ theImage.url }}"
		srcset="{{ theImage.getSrcset( srcSet ) }}"
		width="{{ theImage.width }}"
		height="{{ theImage.height }}"
		alt="{{ imageEntry.alternativeText ??? theImage.alternativeText ??? theImage.title }}"
		loading="lazy"
		decoding="async"
	/>
</div>

Here's the dump of ddev version.

ddev version
 ITEM             VALUE                                    
 DDEV version     v1.24.2                                  
 architecture     amd64                                    
 cgo_enabled      0                                        
 db               ddev/ddev-dbserver-mariadb-10.11:v1.24.2 
 ddev-ssh-agent   ddev/ddev-ssh-agent:v1.24.2              
 docker           27.4.1                                   
 docker-api       1.47                                     
 docker-compose   v2.32.4                                  
 docker-platform  orbstack                                 
 global-ddev-dir  /Users/mattwilcox/.ddev                  
 mutagen          0.18.0                                   
 os               darwin                                   
 router           ddev/ddev-traefik-router:v1.24.2         
 web              ddev/ddev-webserver:v1.24.2 

Craft CMS version

5.6.0.2

PHP version

8.3

Operating system and version

DDEV

Database type and version

No response

Image driver and version

No response

Installed plugins and versions

Application Info

PHP version 8.2.27
OS version Linux 6.12.9-orbstack-00297-gaa9b46293ea3
Database driver & version MySQL 8.0.40
Image driver & version Imagick 3.7.0 (ImageMagick 6.9.11-60)
Craft edition & version Craft Pro 5.6.0.2
Yii version 2.0.51
Twig version v3.15.0
Guzzle version 7.9.2

Plugins

Blitz 5.9.9
CKEditor 4.4.0
Navigation 3.0.5
SEO 5.1.10
Sprig 3.5.2
Vite 5.0.1

@timkelty
Copy link
Contributor

@MattWilcox thanks for reporting!

Should be fixed by #16495.
We'll get a patched release out asap, but if you want to try ahead of time:

composer require "craftcms/cms:dev-bugfix/srcset-urls as 5.6.0.2"

@brandonkelly
Copy link
Member

Craft 5.6.1 is out with that fix now. Thanks again!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants