Error handling: A first example

A first example

<ErrorBoundary fallback={...}> renders its children.

For agentsUpdated 2026-10-20

<ErrorBoundary fallback={...}> renders its children. If creating them throws, or an effect, memo or cleanup inside them throws later, the children are disposed and the fallback is rendered instead. A function fallback receives the thrown value and a reset function.

src/app.tsxtsx

import { ErrorBoundary } from "@shadow-js/web";

export function describe(error: unknown): string {
  return error instanceof Error ? error.message : String(error);
}

export function Broken(): never {
  throw new Error("boom");
}

export function App() {
  return (
    <ErrorBoundary fallback={(error) => <p>Failed: {describe(error)}</p>}>
      <Broken />
    </ErrorBoundary>
  );
}