Invalid empty srcSet attribute in SSR

Describe the bug We’re attempting to use this library with Gatsby. In SSR (server-side rendering), an empty srcSet="" attribute is rendered on the <img tag. This is bad because:

a) an empty srcset attribute is invalid, and b) This may cause the browser to block rendering and attempt to load the img based on srcset, completely defeating the purpose of image-lazyloading.

Here’s an example of the minified output:

<img style="height:100%;width:100%;visibility:hidden;position:absolute;top:0;left:0" alt="retropie" src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=" srcSet="" data-src="https://howchoo.com/media/mt/a5/yz/mta5yzzjoweg_md.jpeg" data-srcset="https://howchoo.com/media/mt/a5/yz/mta5yzzjowet.jpeg 200w, https://howchoo.com/media/mt/a5/yz/mta5yzzjoweg_xs.jpeg 360w, https://howchoo.com/media/mt/a5/yz/mta5yzzjowem.jpeg 414w, https://howchoo.com/media/mt/a5/yz/mta5yzzjoweg_md.jpeg 768w, https://howchoo.com/media/mt/a5/yz/mta5yzzjoweg.jpeg 900w, https://howchoo.com/media/mt/a5/yz/mta5yzzjowel.jpeg 1440w" sizes="(max-width: 200px) 200px, (max-width: 360px) 360px,(max-width: 414px) 414px, (max-width: 768px) 768px,(max-width: 900px) 900px, (max-width: 1440px) 1440px, 900px"/>

Note srcSet="" above.

To Reproduce Steps to reproduce the behavior:

1. Use react-simple-img normally
2. Run SSR (for gatsby, using gatsby build && gatsby serve)
3. Observe the HTML output contains an empty srcSet="" attribute on the <img> tag.

Expected behavior I expect that attribute to not exist in the SSR HTML.

Screenshots N/A

Desktop (please complete the following information):

• OS: MacOS
• Browser Chrome
• react-simple-img@2.3.7

Thanks for the excellent library! I’d be happy to help test a fix if needed.

[bluebill1049]

awesome thanks @ZLevine I will release the patch soon.

[bluebill1049]

any chance you can create a PR for this? I am pretty busy with another OS project at the moment.