Skip to content

Error when using enhanced:img (CSR and inside div) #14279

@timephy

Description

@timephy

Describe the bug

I have a page that uses <enhanced:img>, it is built using adapter-static.

<div>
    <enhanced:img src="$images/cover.jpeg?w=500;1000;1500;2000" alt="" />
</div>

build and check report no error, but when accessing the site I get this weird client runtime error:

Uncaught (in promise) TypeError: Illegal invocation
    at k (runtime.B6UWzKrK.js:1:2756)
    at Zn (runtime.B6UWzKrK.js:1:2227)
    at d (2.6eHHlTyd.js:1:1572)
    at app.CC3Bztr1.js:2:7895
    at app.CC3Bztr1.js:2:3429
    at Lt (runtime.B6UWzKrK.js:1:7538)
    at W (runtime.B6UWzKrK.js:1:8229)
    at P (runtime.B6UWzKrK.js:1:4260)
    at ur (runtime.B6UWzKrK.js:1:4993)
    at app.CC3Bztr1.js:2:3423

When disabling CSR, it does not error (no client side code.. of course)...
When putting the img in the root of the file, it does not error (weird...), however a hydration_mismatch warning is logged to the console anyway (should this be?)

Reproduction

https://github.com/timephy/svelte-5-weird-runtime-error

This page errors, it is using CSR and <enhanced:img> is inside a <div>.
https://timephy.github.io/svelte-5-weird-runtime-error

This page does not error, CSR is disabled.
https://timephy.github.io/svelte-5-weird-runtime-error/working_no_csr

This page does not error, <enhanced:img> is in the root of the file.
https://timephy.github.io/svelte-5-weird-runtime-error/working_root_img
⚠️ However I get a hydration_mismatch warning!

Logs

No response

System Info

System:
    OS: macOS 15.1
    CPU: (20) x64 Intel(R) Xeon(R) W-2150B CPU @ 3.00GHz
    Memory: 7.96 GB / 64.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 23.1.0 - /usr/local/bin/node
    Yarn: 1.22.11 - /usr/local/bin/yarn
    npm: 10.9.0 - /usr/local/bin/npm
    pnpm: 9.12.3 - /usr/local/bin/pnpm
    bun: 1.0.25 - /usr/local/bin/bun
  Browsers:
    Chrome: 130.0.6723.117
    Safari: 18.1
  npmPackages:
    svelte: ^5.1.15 => 5.1.15

Note

❗❗❗ All of this only happens on build > preview and not during dev!

Severity

blocking all usage of svelte

Metadata

Metadata

Assignees

No one assigned

    Labels

    awaiting submitterneeds a reproduction, or clarification

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions