Similar machine names of image styles will cause responsive images to use the wrong styles

Created on 3 July 2025, 4 days ago

Problem/Motivation

I have found with responsive images that you could end up with the same image for all of your responsive images if you name them similarly. So you will only get 1 responsive image even though I have set 3 images.

Steps to reproduce

  • Setup the media with contextual cropping
  • Create 3 image styles with machine names of focal_point_crop, focal_point_crop_2x, focal_point_crop_3x
  • Create a responsive image style that uses these 3 images
  • Apply it to the image display to render as responsive with the responsive image style

It will use just the 1st responsive image only as the first image style is always found to be contained in the other image styles.

Proposed resolution

Update the logic in the check to include the slashes to make sure the name is just matching the exact part of the image style path

🐛 Bug report
Status

Active

Version

2.1

Component

Code

Created by

🇨🇦Canada erichomanchuk

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

Production build 0.71.5 2024