diff --git a/apps/svelte.dev/src/routes/+layout.svelte b/apps/svelte.dev/src/routes/+layout.svelte index f0f136d2b6..085d6de94f 100644 --- a/apps/svelte.dev/src/routes/+layout.svelte +++ b/apps/svelte.dev/src/routes/+layout.svelte @@ -6,29 +6,23 @@ import { Nav } from '@sveltejs/site-kit/nav'; import { Search, SearchBox } from '@sveltejs/site-kit/search'; import { injectSpeedInsights } from '@vercel/speed-insights/sveltekit'; - import { afterNavigate } from '$app/navigation'; - import { needs_webcontainers } from './tutorial/[...slug]/shared'; - import type { Exercise } from '$lib/tutorial'; + import { beforeNavigate } from '$app/navigation'; injectSpeedInsights(); - let exercise: Exercise | undefined = undefined; - - afterNavigate(() => { - // Make all navigations between SvelteKit-tutorial and non-SvelteKit-tutorial pages (and vice versa) - // a full page navigation to ensure webcontainers get the correct origin restriction headers while - // ensuring those headers don't interfere with the rest of the page. These headers would have bad - // consequences on how we have to handle integration of images etc from other domains for example. - if ($page.data?.exercise && needs_webcontainers($page.data.exercise)) { - document.body.setAttribute('data-sveltekit-reload', 'true'); - if (!!exercise && !needs_webcontainers(exercise)) { - location.reload(); - } - } else { - document.body.removeAttribute('data-sveltekit-reload'); + // Make all navigations between SvelteKit-tutorial and non-SvelteKit-tutorial pages (and vice versa) + // a full page navigation to ensure webcontainers get the correct origin restriction headers while + // ensuring those headers don't interfere with the rest of the page. These headers would have bad + // consequences on how we have to handle integration of images etc from other domains for example. + beforeNavigate(({ from, to, cancel }) => { + if (!from || !to) return; + + if ( + from.url.pathname.startsWith('/tutorial/kit/') !== to.url.pathname.startsWith('/tutorial/kit') + ) { + cancel(); + location.href = to.url.href; } - - exercise = $page.data?.exercise; }); let { data, children: layout_children } = $props();