ErrorBoundary doesn't catch errors from createMemo

💙Beginner

Possible Bug

Solid API

I have some code that looks like this:

function App() {
  const result = createAsync(() => someQuery());
  const derived = createMemo(() => someFunc(result()));

  return (
    <ErrorBoundary fallback={(_err) => <p>Error occurred</p>}>
      <p>{derived()}</p>
    </ErrorBoundary>
  );
}

function App() {
  const result = createAsync(() => someQuery());
  const derived = createMemo(() => someFunc(result()));

  return (
    <ErrorBoundary fallback={(_err) => <p>Error occurred</p>}>
      <p>{derived()}</p>
    </ErrorBoundary>
  );
}

function App() {
  const result = createAsync(() => someQuery());
  const derived = createMemo(() => someFunc(result()));

  return (
    <ErrorBoundary fallback={(_err) => <p>Error occurred</p>}>
      <p>{derived()}</p>
    </ErrorBoundary>
  );
}

function App() {
  const result = createAsync(() => someQuery());
  const derived = createMemo(() => someFunc(result()));

  return (
    <ErrorBoundary fallback={(_err) => <p>Error occurred</p>}>
      <p>{derived()}</p>
    </ErrorBoundary>
  );
}

someQuery()

someQuery()

someQuery()

someQuery() throws, then it produces an error that isn't caught by the

ErrorBoundary

ErrorBoundary

ErrorBoundary

ErrorBoundary. This isn't a problem if i make

derived

derived

derived

derived a simple derived signal (i.e.,

derived = () => someFunc(result())

derived = () => someFunc(result())

derived = () => someFunc(result())

derived = () => someFunc(result())). Is this a bug? Is there a better way to do this? I don't have much experience with reactive libraries so I'm not sure what to expect here. Thanks in advance

ErrorBoundary doesn't catch errors from createMemo

Similar Threads

Similar Threads

Similar Threads