-
-
Notifications
You must be signed in to change notification settings - Fork 360
Support fallback UI for non-rendering JS errors (GlobalErrorBoundary) #5930
Description
React's error boundaries (and our Sentry.ErrorBoundary) only catch errors during the rendering phase — errors thrown in render(), lifecycle methods, and constructors. They do not catch errors in:
- Event handlers (onPress, onChange, etc.)
- Async code (setTimeout, fetch, promises)
- Errors thrown outside the React component tree
Customers who want to show a fallback UI for these non-rendering errors currently have to build their own solution by overriding ErrorUtils.setGlobalHandler, disabling our onerror integration, and bridging to React state manually. This is fragile, bypasses our error processing pipeline (flush, fatal deduplication, proper mechanism tagging), and risks running the app in a corrupted state.
Proposed Solution
Provide a Sentry.GlobalErrorBoundary component (or extend Sentry.ErrorBoundary with a global prop) that also catches fatal non-rendering JS errors and renders a fallback UI.
// Option A: Dedicated component
<Sentry.GlobalErrorBoundary fallback={({ error, resetError }) => <MyFallback />}>
<App />
</Sentry.GlobalErrorBoundary>
// Option B: Extend existing ErrorBoundary
<Sentry.ErrorBoundary fallback={...} global>
<App />
</Sentry.ErrorBoundary>