Repository navigation
Client navigation leaves stale +error.svelte mounted after remote query render error with experimental handleRenderingErrors #15694
Description
Activity
Throwing my 2c here since this affects me as well. For anyone encountering this, until the devs fix it, here's a temporary workaround on an index-level layout
{#key page.url.pathname} {@render children()} {/key}Forcing svelte to re-render pages will fix the issue. REMEMBER TO MARK THIS WITH A TODO or something that generates code smells in whatever tool you use. This likely is quite terrible for performance
Hit this too — same combo (
remoteFunctions+handleRenderingErrors, render-timeerror()from anawait-ed remote query). Confirmed on@sveltejs/kit@2.68.0/svelte@5.56.4. Worth adding the root cause, since it isn't analysed above:.svelte-kit/generated/root.sveltewraps each route layer in a<svelte:boundary>, and a failed Svelte 5 boundary stays failed untilreset()is called — a prop change alone doesn't re-render the main content. On each client navigation the router clears its own tracking var and callsroot.$set(...), but neverreset()s the boundary (nor is the boundary{#key}-ed on the route):// @sveltejs/kit/src/runtime/client/client.js (navigate flow) rendering_error = null; // TODO this can break with forks, rethink for SvelteKit 3 where we can assume Svelte 5 root.$set(navigation_result.props);
So the failed boundary survives every client navigation. The first load is fine because it goes through
initialize(), which creates the root fresh. Load errors (error()in aload) are unaffected because they go through the router, which resets normally.Possible fix:
reset()the failed boundary on client navigation, or{#key}it on the route id. The existing// TODO ... rethink for SvelteKit 3comment sits right at this line.Same root cause, different manifestation — traced it in the source; sharing a repro that doesn't need remote functions.
Root cause: with
handleRenderingErrorsthe generated root component wraps each layout depth in<svelte:boundary>. Once a boundary fails, nothing ever resets it: client navigation only callsroot.$set(...)(runtime/client/client.js), and a failed boundary ignores prop updates — per svelte semantics onlyreset()exits the failed state, and kit never calls it. Meanwhilepage.status/page.errorare updated by the successful navigation, so the stuck+error.sveltere-renders withstatus: 200while nothing is actually failing — console and server logs stay clean.Minimal repro —
handleRenderingErrors: true+compilerOptions.experimental.async:<!-- routes/+page.svelte --> <a href="/broken">break</a> <!-- routes/broken/+page.svelte --> <script> import { error } from '@sveltejs/kit' async function load() { error(404, 'nope') } </script> {await load()} <!-- routes/+error.svelte --> <script>import { page } from '$app/state'</script> <h1>status: {page.status}</h1> <a href="/">go home</a>
- Open
/, click break → error page,status: 404✅ - Click go home → URL changes to
/, but the error page stays mounted, now showingstatus: 200❌. Every further client-side navigation is trapped; only a full reload escapes.
Impact: any
+error.sveltecontaining links (e.g. a 401 page with a "Sign in" button) traps the user. Workarounds all fall short:beforeNavigate+location.hrefcorrupts history on back/forward traversals;{#key page.url.pathname}around layout children remounts the whole app on every navigation and can't cover the root-level boundary. Looks like kit needs toreset()its boundaries when a navigation commits.kit 2.69.1, svelte 5.56.4
- Open
- linked a pull request that will close this issuefix: reset sveltekit-controlled error boundaries on navigation #16296
on Jul 9, 2026 - added a commit that references this issue
on Jul 10, 2026
Describe the bug
I’m using SvelteKit with both
kit.experimental.remoteFunctionsandkit.experimental.handleRenderingErrorsenabled.When a remote query throws an
error(404, ...)during component render on a client-rendered page, the nearest+error.svelterenders as expected for that route. However, after navigating client-side to another route, the failed error UI is not torn down correctly and remains mounted above the next page’s content.This minimal repro has two routes:
/renders a normal home page with a link to/data/dataawaits a remote query at the top level of+page.svelteThe remote query throws:
Reproduction
https://github.com/tudor-cel-stan/sveltekit-error-page-navigation-repro
Steps:
bun installbun run dev/Go to error page/dataClick this to see the issue/renders, but the old error page remains mounted above the home page contentRelevant files in the repro:
src/routes/data.remote.tssrc/routes/data/+page.sveltesrc/routes/+error.sveltesrc/routes/+page.sveltesvelte.config.jsLogs
System Info
Severity
annoyance
Additional Information
Related issues / nearby prior art I found:
I don’t think those exactly match this repro.
What seems distinct here is:
A full page reload clears the bad state.
A client-side internal navigation does not.