Lazysizes: Iframe src attribute not set

[jpw123]

When lazy loading iframes, the src attribute is never set once the iframe has been lazy loaded. This becomes an issue when working with 3rd party libraries such as the YouTube iframe API that utilize the src attribute.

[aFarkas]

Can you provide a simplified testcase?

[jpw123]

Sure -- here is some quick and dirty JS that illustrates. You can uncomment line 17 in the JS to add a src attribute before calling the youtube API.

http://jsfiddle.net/v8kLgdfs/12/

Also -- this would be a great use case for adding a lazyAfterUnveil event. The load event fires at the beginning of the iframe load -- not after it has completed.

Thanks!

[aFarkas]

If I change the src attribute of an iframe, FF will add a new entry to the browser history. Which breaks the back button.

Here is a good workaround based on your example:
http://jsfiddle.net/v8kLgdfs/17/

To be honest I don't know how to solve this.

[thomas-j-moffett]

@aFarkas
I just tried a simple iframe lazyload and am getting the same result. It doesn't seem that the library supports lazyloading an iframe, and if that is truly the case, maybe the documentation should be updated so it doesn't say that we can lazyload iframes?

But otherwise, great work with the library! It does an awesome job with my images with zero configuration.

[Alfier]

Same problem here, only happening on Chrome 67. Works fine on Firefox 60.
@aFarkas 's workaround breaks all other lazyloaded images on the page, so not an option...

[aFarkas]

@Alfier
You are funny if you no only 1% of JS you can transform my example to only impact youtube iframes. My example is an extension based on a fiddle written by someone else. I didn't offer a plugin. But saying that this is not an option because one line out of 70lines is ...

There is a reason why lazysizes is written to be extnsebile. Extend it to your needs!