`enhanced:img` does not support dynamically provided SVGs

[mquandalle]

Describe the bug

On the server I use a dynamic import

import.meta.glob("./images/*.{png,svg}", { query: { enhanced: true } })

And when on the client inside a {#each} block I display each image using <enhanced:img src={image} />, I get the following exception :

TypeError: Cannot read properties of undefined (reading 'src')

Looking at the implementation it seems that the enhanced:img package is supposed to support this at runtime with the following code

kit/packages/enhanced-img/src/preprocessor.js

Lines 352 to 361 in b183244

	return `{#if typeof ${src_var_name} === 'string'}
	<img ${serialize_img_attributes(content, attributes, details)} />
	{:else}
	<picture>
	{#each Object.entries(${src_var_name}.sources) as [format, srcset]}
	<source {srcset}${sizes_string} type={'image/' + format} />
	{/each}
	<img ${serialize_img_attributes(content, attributes, details)} />
	</picture>
	{/if}`;

But it generates the following code :

if (typeof image === "string") {
    $$payload.out += "<!--[-->";
    $$payload.out += `<img${attr("src", image.img.src)}${attr("width", image.img.w)}${attr("height", image.img.h)}>`;
  } else {
    $$payload.out += "<!--[!-->";

It tests that image is a string and then try to access image.img.src

Reproduction

https://github.com/mquandalle/enhanced-img-svgpng

git clone git@github.com:mquandalle/enhanced-img-svgpng.git
npm run dev

Logs

System Info

System:
    OS: macOS 15.0
    CPU: (8) arm64 Apple M2
    Memory: 93.03 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.12.0 - ~/.nvm/versions/node/v22.12.0/bin/node
    npm: 10.9.0 - ~/.nvm/versions/node/v22.12.0/bin/npm
    bun: 1.2.8 - ~/.bun/bin/bun
  Browsers:
    Chrome: 135.0.7049.114
    Safari: 18.0
  npmPackages:
    @sveltejs/adapter-auto: ^4.0.0 => 4.0.0 
    @sveltejs/enhanced-img: ^0.4.4 => 0.4.4 
    @sveltejs/kit: ^2.16.0 => 2.20.7 
    @sveltejs/vite-plugin-svelte: ^5.0.0 => 5.0.3 
    svelte: ^5.0.0 => 5.28.2 
    vite: ^6.2.5 => 6.3.3

Severity

annoyance

Additional Information

No response

[benmccann]

I tried to debug this and wasted a lot of time by hitting what appears to be a Vite bug different than the issue reported here: vitejs/vite#21013

[benmccann]

I figured out that svg are currently only supported statically rather than dynamically. You can reproduce this much more easily with just import logo from './logo.svg?enhanced';

For now, I sent #14845, which prevents a crash and issues a warning and also updates the docs

I'll leave this open as a feature request