Blank colour svg injected as bg image

[Cstrachan4]

Describe the bug

After updating to version 5.0.2 images are getting a grey svg injected as a css background via the style attribute meaning images with a transparency show a grey background instead. (downgrading to 5.0.1 fixes the issue)

To reproduce

Steps to reproduce the behaviour:

1. Have image with transparency
2. View on front end

Expected behaviour

This style attribute shouldn't get injected ('generatePlaceholders' setting is set to false)

Screenshots

resulting in

Versions

• Plugin version: 5.0.2
• Craft version: 5.4.5.1

[khalwat]

Can you show me the code you're using to output said image?

[Cstrachan4]

Sure, here you go:

In template

{% block bWhoBlockImage %}
      {% if whoBlockImage %}
            {# Output optimized image #}
            {{ whoBlockImage.imageTransformMax.pictureTag()
              .pictureAttrs({
                  'class': 'who-section-block__image',
              })
              .imgAttrs({
                  'alt': whoBlockImage.alt ??? ' ',
              })
              .loadingStrategy('lazy')
              .render() }}
      {% endif %}
{% endblock %}

Component

{% if whoBlockImage or _whoBlockImage is defined %}
      <div class="who-section-block__image-wrap">

        {% block bWhoBlockImage %}

          {% if _whoBlockImage %}
            <img class="who-section-block__image" src="{{ _whoBlockImage }}" alt="" />
          {% endif %}

        {% endblock %}

      </div>
{% endif %}

[khalwat]

This is a result of the lazy loading strategy that is being used which works fine for normal images, but not for images like SVGs that can be transparent in places.

I'm looking into a solution that makes sense here.

[khalwat]

Addressed in the above commits.

Craft CMS 3:

You can try it now by setting your semver in your composer.json to look like this:

    "nystudio107/craft-imageoptimize": "dev-develop as 1.6.56”,

Then do a composer clear-cache && composer update

…..

Craft CMS 4:

You can try it now by setting your semver in your composer.json to look like this:

    "nystudio107/craft-imageoptimize": "dev-develop-v4 as 4.0.10”,

Then do a composer clear-cache && composer update

…..

Craft CMS 5:

You can try it now by setting your semver in your composer.json to look like this:

    "nystudio107/craft-imageoptimize": "dev-develop-v5 as 5.0.3”,

Then do a composer clear-cache && composer update