What does “Failed parsing ‘srcset’ attribute value since its ‘w’ descriptor is invalid.” mean?

I get Chrome errors on my website that say:

Failed parsing ‘srcset’ attribute value since its ‘w’ descriptor is
invalid.
Dropped srcset candidate
http://i2.wp.com/domain.net/wp-content/…/image.jpg?resize=425%2C200

Read More

Any idea what this means?

I am using WordPress as my website platform. I also use its Photon feature (within its Jetpack framework). My suspicion is that it has to do with this feature. Are image dimensions getting specified incorrectly or something?

What are ‘w’ descriptors?


UPDATE:
Here is the HTML:

<img src="http://i1.wp.com/gaithersburgpsychologist.net/wp-content/uploads/2015/02/lightbulb.jpg?resize=425%2C200"
   srcset="http://i1.wp.com/gaithersburgpsychologist.net/wp-content/uploads/2015/02/lightbulb.jpg?resize=425%2C200 w, http://i1.wp.com/gaithersburgpsychologist.net/wp-content/uploads/2015/02/lightbulb.jpg?resize=450%2C320 w"
   sizes="(min-width: 768px) 720px, (min-width: 992px) 700px, (min-width: 1200px) 850px, calc(100vw-20px)"
   alt="Change your thoughts and you change your world.">

Related posts

8 comments

  1. I had a similar error:

    failed parsing srcset attribute value since it has an unknown descriptor

    and the problem was caused by a space in the image path URL.

  2. tldr; Your html is invalid and you are missing the actual width number.

    This is a valid img tag with srcset:

    <img src="phone.jpg" srcset="phone-small.jpg 256w, phone-big.jpg 512w" />
    

    It says that if your browser understands srcset it should use the small image when the width is approx 256 px wide, and the bigger image when it is 512 px wide.

    In your image tag you have nothing in front of the w:

    srcset="http://...resize=425%2C200 w, ...

    Notice there is nothing specifying the width? That’s the problem. Change it to something like 600w to use the pic for screen widths of 600 pixels, etc.

  3. In my case I was generating my srcset using a webpack loader called srcset-loader who was outputing a JSON object instead of a proper string.

  4. In my case, as with all cases above the image URL was corrupt:

    Example:

    https://aaaa.aaaa.com/?somequery
    

    Replacing /? with ? helped.

  5. in my case, I was programatically creating the srcset sizes, and had a value like 347.99999w. Solved with a Math.floor().

Comments are closed.