Why do images break on form error submissions in blog comments?

[leungvi8]

Page of the issue: blog posts

Trigger: blog comment (specifically if there is a form error upon submission)

Issue: Alright so I see images no problem, I have a large image on top, and have a "Read More Our Latest News" sections with more images at the bottom - see attached (LEFT). Upon form submission of my comment area, if a user has an error, in my example I had an incomplete email, the images from the page breaks, and seems to display only the shopify image link.

Supporting Images:

 

I'd appreciate any help. Thank you!

[gordonzed]

Hard to say for sure without being able to see what's going on in the background. Are you using Chrome? If so, hit Ctrl+Shift+J to open the console. Then refresh the page, and copy and paste the contents of the console.

Don't know the shortcut for console on other browsers off the top of my head but I'm sure a quick Google search will reveal it.

Looking for the contents of this:

[gordonzed]

That or send a link to that page and I can just fiddle with it and see what's causing it.

[leungvi8]

@gordonzed thanks for the quick response, unfortunately I did check Dev tools and it's coming up blank:

The theme is a private in development theme so it's not accessible to the public. I can send you a private message with the password if you want.

[gordonzed]

Yeah if you'd be able, that would probably help. Past my bed time though so I can take a look in the morning if you haven't figured it out by then.

[gordonzed]

What's interesting is it's basically printing the output of {{ 'coffeewhatever.png | asset_url }} which implies to me that either asset_url just sets the alt attr to it's URL, which I kind of doubt but I guess I've never checked. I'm at my desk if you still need help with this. Otherwise, curious to know how you solved it.