vuetify icon indicating copy to clipboard operation
vuetify copied to clipboard

[Bug Report][3.7.6] v-img SVG's aren't consistently loading on Firefox

Open andyiwest opened this issue 11 months ago • 1 comments

Environment

Vuetify Version: 3.7.6 Vue Version: 3.4.30 Browsers: Firefox 134.0 OS: Windows 10

Steps to reproduce

I'm using one of your playground links, with the image paths updated to my svg's, refresh it a few times in Firefox, and not all of the images will load. There isn't a pattern as to what loads and what doesn't either, I'm at a loss.

Expected Behavior

Expect the v-img to load the image every time

Actual Behavior

Sometimes loads, sometimes doesn't.

Reproduction Link

https://play.vuetifyjs.com/#...

Other comments

Not sure if it's related to my specific SVG images, or if it's Firefox, but it doesn't make sense.

andyiwest avatar Jan 28 '25 12:01 andyiwest

I've noticed this behavior as well. Only on Firefox and with an SVG image. When I inspect with the Vue dev tools the state is set to the 'error' but the default v-img is in the HTML:

<img class="v-img__img v-img__img--contain fade-transition-enter-to" src="/img/<myimage>.svg" alt="<alt>" style="display: none;">
<v-img
  :src="`/img/${isPublicSite() ? 'public' : 'live'}.svg`"
  :width="isPublicSite() ? 120 : 100"
  :alt="serverInstanceName()"
  :cover="false"
/>

I attached an @error event hook and noticed that it is throwing a couple times even though the img source is loading. Not sure why this is happening as it is loading from the browser cache.

MichaelGoff avatar Jun 11 '25 19:06 MichaelGoff