Skip to content

[5.x]: Srcset generates a 'width' tag even if the image is not generated #16984

@terryupton

Description

@terryupton

What happened?

Description

If an image transform is not created a width attribute is sometimes added in the srcset output.
See below:
Image

The images are portrait images with a ration of 3:4.

I use an image component; but here are the essential parts that drive this;

{% apply spaceless %}
   {% set transformParams = {
      mode: 'crop',
      width: imageWidth,
      height: imageHeight,
      format: 'webp'
   } %}
   {% if imageHeight > imageWidth %}
      {% set srcSetWidths = [320,640,800,1024,1280] %}
   {% else %}
      {% set srcSetWidths = [320,640,800,1024,1280,1920,2400] %}
   {% endif %}

   {% do image.setTransform(transformParams) %}
{% endapply %}

 {{ tag('img', {
     src: image.url,
     srcset: image.getSrcset(srcSetWidths),
     sizes: vars.sizes,
     width: imageWidth,
     height: imageHeight,
     alt: vars.alt,
     class: classImage,
     loading: vars.lazy == 1 ? 'lazy' : 'eager',
     style: vars.objectFit == 1 ? focalPointPosition : null
  }) }}

I am seeing that the 1280 image is not generated, assuming because it is too big to be generated.
I see the 1280w param set in the srcset output and then if the browser sties to use this 'width' there is no url and results in a dead image.

See here:
Image

I do not have any settings for ->upscaleImages() in my config.
However, I would still consider this a bug if ->upscaleImages() was true or false.

Steps to reproduce

Expected behavior

I would expect if an image is not generated that the whole url and width param are not output in the srcset code.

Actual behavior

I see the 1280w param set in the srcset output without any valid image url as it was not generated.

Craft CMS version

Craft Team 5.6.13

PHP version

8.3.17

Operating system and version

Linux 6.12.15-orbstack-00304-gd0ddcf70447d

Database type and version

MySQL 8.0.40

Image driver and version

Imagick 3.7.0 (ImageMagick 6.9.11-60)

Installed plugins and versions

  • CKEditor 4.6.0
  • Cloner 3.0.1
  • Entry Type Fields 2.0.0
  • Feed Me 6.8.0
  • Field Manager 4.0.3
  • Forms 5.10.3
  • Image Resizer 4.0.3
  • Imgixer 3.0.1
  • SEO & Social Media 5.1.11
  • Sprig 3.5.2
  • Store Hours 4.2.0
  • Vite 5.0.1

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions