Svelte v.5 passes a file as a string (rather than as a file) into a web component prop

[nevil2]

Describe the bug

With Svelte 5 pre-release (up to 23rd September), an image as a file could be passed into a web component as follows:

<webcomponent {image} />

With Svelte 5 stable (after installation on 5th November), the web component receives the image as a string "[object File]" rather than as a file.

Since there were no changes to the web component and the problem occurs on multiple browsers, the issue must relate to a change in Svelte 5. Web component also works with other frameworks such as React.

Reproduction

https://climbers-club.co.uk/climbing/submission?tab=Create%20Topo demonstrates the problem.

Inspect the console to see logging messages.

Drag a photo into the box.

The svelte component receives the image file and passes it to the web component.

The web component receives a string.

Logs

Svelte component loaded image with filename Hollowstones.jpg; instanceof File : true
Webcomponent receiving image: typeof string; value: [object File]

System Info

System:
    OS: Linux 5.15 Ubuntu 22.04.3 LTS 22.04.3 LTS (Jammy Jellyfish)
    CPU: (12) x64 AMD Ryzen 5 5600X 6-Core Processor
    Memory: 3.18 GB / 15.59 GB
    Container: Yes
    Shell: 5.1.16 - /bin/bash
  Binaries:
    Node: 20.10.0 - /tmp/fnm_multishells/6152_1732173769447/bin/node
    npm: 10.9.0 - /tmp/fnm_multishells/6152_1732173769447/bin/npm
  npmPackages:
    svelte: ^5.1.4 => 5.2.7

Severity

blocking all usage of svelte

[dummdidumm]

Please provide a minimum reproducible with access to the code, not a blackbox link to a full website

[nevil2]

I have made a repository https://github.com/nevil2/svelte-testing-wc

The web component can be found here:
https://github.com/nevil2/svelte-testing-wc/blob/ecb28c205307b503178f94cf63a265dcf94031c2/test-component/src/routes/%2Bpage.svelte#L47

Is this what you need?

[dummdidumm]

Yes, thank you