How to surface error ID to the client when an error occurs in Remix route?

[adaboese]

To avoid duplication, the issue is described here: remix-run/remix#8454

It is not clear whether it is something that Sentry can help with or something that Remix would need to change (or both).

[onurtemizkan]

For client-side errors, Sentry.captureRemixErrorBoundaryError() will return eventId, you can use it like:

export const ErrorBoundary = () => {
  const error = useRouteError();

  const eventId = captureRemixErrorBoundaryError(error);

  return <div>
    <span>Sentry Event Id: {eventId}</span>
  </div>;
}

Current implementation of Sentry.captureRemixServerException does not return an eventId, so it's not possible unless you opt-out from auto error tracking and manually instrument.

[adaboese]

I am Okay with the manual instrumentation (I think!). Are the steps for it are documented?

This is my handleError at the moment:

export const handleError = (
  error: unknown,
  { request }: DataFunctionArgs,
): void => {
  if (isResponse(error) || isRouteErrorResponse(error)) {
    return;
  }

  Sentry.captureRemixServerException(error, 'remix.server', request);
};

By the way, documentation on this page is broken https://docs.sentry.io/platforms/javascript/guides/remix/manual-setup/