Demo | Doesn't display `alt` text if request to image source is blocked by client

[scriptype]

trafficstars

Hi, firstly I have to say that I really liked the idea behind this project. 👍

The problem is that I'm using the "Privacy Badger" chrome extension to block tracking networks, and seems like it also blocks images.unsplash.com, which I'll manually whitelist after submitting this issue.

I noticed that if I "refresh & use <img />", alt texts are properly displayed in place of the unloaded images. But if I "refresh & use <img-2>", alt texts are gone. I didn't inspect the source code much and not sure if this is only a demo problem. Just wanted to inform you about this situation.

What I expected: seeing alt text if img-2 fails loading the image for any reason.

I'm seeing this in the console:

[Nevraeka]

AMP image uses a <div fallback>alt text goes here</div> for the image alt (in addition to alt). Maybe that approach might work?

[RevillWeb]

Thank you for submitting this issue @scriptype. This is happening simply because it doesn't render the <img /> element inside the web component if it cannot successfully load the image, therefore it won't display the alt text 😞. As @Nevraeka suggests I should provide some kind of fallback to ensure the alt text gets displayed when an image doesn't load. I'll look into it 👍