Failed parsing 'srcset' attribute value since it has an unknown descriptor.

[hjujah]

Hello, I am really struggling to get this to work.

Here is how I import the script:
import picturefill from 'picturefill'

Here is my html:

<picture>
        <!--[if IE 9]><video style="display: none;"><![endif]-->
        <source srcset="/static/guy.webp" media="(min-width: 800px)" type="image/webp">
        <source srcset="/static/guy.png" media="(min-width: 800px)">
        <!--[if IE 9]></video><![endif]-->
        <img srcset="/static/guy.png" alt="image desc">
</picture>

And since I am using vue.js in the ,,mounted" (its being executed when the DOM is rendered) method i have the following:

mounted()  {
   picturefill()
},

And here is the full error which I am getting:

Failed parsing 'srcset' attribute value since it has an unknown descriptor.
Dropped srcset candidate "/static/guy.webp"

Any ideas what I am doing wrong?

Thanks!

[hackuun]

I got exactly the same issue. Did you solve it?

[paulroub]

Might this actually be the vue.js bug noted here, and nothing to do with Picturefill?

[aFarkas]

@paulroub
You should be right. Chrome does support srcset natively. So picturefill isn't doing anything here.

You can workaround this by explicitly specifying the default descriptor 1x.

This would look like this:

<img srcset="/static/guy.png 1x" alt="image desc" />