bug: <svelte:boundary> is not working on SSR

[adiguba]

Describe the bug

The <svelte:boundary> do nothing on SSR !

On the REPL we can see that code like this :

<svelte:boundary>
	template
	{#snippet failed()}
		error
	{/snippet}
</svelte:boundary>

Will generate this server code :

	{
		function failed($$payload) {
			$$payload.out += `<!---->error`;
		}

		$$payload.out += `<!---->template`;
	}

The template is written, but there no try/catch and the failed() snippet is never caller when an error occurs in the template !

Actually this will produce an HTTP 500 error :(

I think it should render the failed() snippet instead...

Reproduction

Click on the links "Bad page" and "Good page" to see that the error is handheld on client-site.
Then, when on the "Bad page", click on the "reload to force SSR" button to regenerate the page via SSR... => HTTP 500

https://www.sveltelab.dev/ravzziihmogkq1a

Logs

System Info

Done on sveltelabs with last version

Severity

annoyance

[dummdidumm]

This works as designed, but it's not mentioned in the docs as I realize now

[adiguba]

But IMHO I think the SSR should generate the same result...
It's incorrect to generate an HTTP 500 in this case.

[paoloricciuti]

But IMHO I think the SSR should generate the same result... It's incorrect to generate an HTTP 500 in this case.

I had the same thought but @trueadm actually gave a good point: if you stream html you can't undo the html you sent

[adiguba]

Yes... but unless I am mistaken, Svelte does not support streaming html...
And even if it was the case, it would still be necessary to make a special case for this (how to cancel a stream on error?)

[paoloricciuti]

Yes... but unless I am mistaken, Svelte does not support streaming html...

There are plans to support it (Dominic knows more than I do)...and I guess if you error out stopping the stream is a non issue no?

[paoloricciuti]

That said I think it would be cool to render the fallback

[adiguba]

I tried quickly and I think it's possible to generate something like that :

    // store the current position :
    const $$pos = $$payload.out.length;

    try {
      // the content of the <svelte:boundary/>
      $$payload.out += `<!---->template`;
    } catch ($$err) {
      // reset the buffer to the previous position
      $$payload.out = $$payload.out.substring(0, $$pos);

      // the failed snippet (if any)
      let failed = function($$payload) {
        $$payload.out += `<!---->error`;
      };
      failed($$payload);
    }

But :

• I don't know if hydration will work correctly (but an hydration mismatch is better than a HTTP 500).
• I don't know how to handle {@const} correctly. Problem similar to svelte:boundary doesn't catch errors inside a @const tag #15368. They must be inside the try to catch the error, but also outsite in order to be accessible from failed()

[ShourovRoy]

to catch the errors, add +error.svelte in that particular route, the boundary is for client only.

https://svelte.dev/docs/kit/errors

[adiguba]

Yes but +error.svelte is for HTTP errors, and I don't want to render an HTTP error...

I just want to render the page correctly, without the svelte:boundary part when it fail... Like with a try/catch...

[trueadm]

I think we could allow error boundaries to work, but they'd need to use the failed snippet approach, rather than hand rolling a custom approach that renders the error fallback elsewhere, as there's no state on the server.