'Svelte/SvelteKit - Update iframed component when props change

In my sveltekit app, i have an embedded application via iframes, and when the user goes to the url it essentially loads that relative url within the iframe (for the embedded app)

I've got a [...slug].svelte file to handle this and the load function to set the iframe url, I'm finding that this works perfectly when it's SSR, however on the client side after a couple of page changes the iframe src doesn't get updated, I can see in the client side console log Loading: XXXX where XXX is the correct path but then the component doesn't update

REPL: https://svelte.dev/repl/3f1b36d444c6444ab7ad743248643c4e?version=3.42.4

iframesveltesvelte-3sveltekit


Solution 1:[1]

This looks to be caused by this

https://github.com/sveltejs/kit/issues/1449 https://github.com/sveltejs/kit/issues/1497

The workaround is detailed on the tickets, essentially you return props from load and declare as a reactive statement

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Tam2

Related Questions