diff --git a/packages/repl/src/lib/Output/Viewer.svelte b/packages/repl/src/lib/Output/Viewer.svelte index 7b5ddd1a44..6c9ad8f8b4 100644 --- a/packages/repl/src/lib/Output/Viewer.svelte +++ b/packages/repl/src/lib/Output/Viewer.svelte @@ -270,6 +270,7 @@ error = null; } } catch (e) { + console.error(e); // make it show up in the console, too, not just the UI // @ts-ignore show_error(e); } diff --git a/packages/repl/src/lib/Repl.svelte b/packages/repl/src/lib/Repl.svelte index 39f868848e..f58542cbab 100644 --- a/packages/repl/src/lib/Repl.svelte +++ b/packages/repl/src/lib/Repl.svelte @@ -25,6 +25,10 @@ onversion?: (version: string) => void; onchange?: () => void; download?: () => void; + /** + * Invoked whenever there's a bundler or runtime error + */ + onerror?: (error: Error) => void; } let { @@ -40,7 +44,8 @@ previewTheme = 'light', onversion, onchange = () => {}, - download + download, + onerror }: Props = $props(); // TODO pass in real data @@ -185,6 +190,18 @@ $toggleable = mobile && orientation === 'columns' && embedded !== 'output-only'; }); + $effect(() => { + if (runtime_error) { + onerror?.(runtime_error); + } + }); + + $effect(() => { + if (bundler.result?.error) { + onerror?.(bundler.result.error as Error); + } + }); + let runes = $derived( workspace.current.name.endsWith('.svelte.js') || (workspace.current_compiled?.result?.metadata.runes ?? false) @@ -235,7 +252,7 @@ {injectedCSS} {previewTheme} {workspace} - runtimeError={runtime_error} + bind:runtimeError={runtime_error} /> {/snippet} diff --git a/packages/repl/src/lib/public.d.ts b/packages/repl/src/lib/public.d.ts index aca4e99aff..7c48ad4c53 100644 --- a/packages/repl/src/lib/public.d.ts +++ b/packages/repl/src/lib/public.d.ts @@ -1,4 +1,5 @@ import type { OutputChunk, RollupError } from '@rollup/browser'; +import type { CompileError } from 'svelte/compiler'; export interface BundleResult { uid: number; diff --git a/packages/repl/src/routes/v0.svelte b/packages/repl/src/routes/v0.svelte index 781db0bc96..6ddcb243b7 100644 --- a/packages/repl/src/routes/v0.svelte +++ b/packages/repl/src/routes/v0.svelte @@ -13,7 +13,14 @@
- + { + // @ts-expect-error so that v0 can react to REPL errors + window.__svelte_repl_onerror?.(error); + }} + />