NextJS App Crashes not being reported in Sentry

[zacharypodbela]

• Review the documentation: https://docs.sentry.io/
• Search for existing issues: https://github.com/getsentry/sentry-javascript/issues
• Use the latest release: https://github.com/getsentry/sentry-javascript/releases
• [N/A] Provide a link to the affected event from your Sentry account

Package + Version

• @sentry/nextjs

Version:

6.12.0

Description

When an error causes a crash in NextJS, it is not reported to Sentry, even though the error is logged in the Chrome/browser console.

Reproducable Demo can be found here: https://github.com/zacharypodbela/sentry-nextjs-crash-demo

• The above demo is a vanilla NextJS installation with Sentry installed. The only custom code added is the button that causes an intentional TypeError in the frontend.

[AbhiPrasad]

Hey, thanks for reporting and for the detailed repro demo, it's highly appreciated.

The second error is not reported to Sentry because it occurs in the React component tree, so it doesn't bubble up to the global error handlers that Sentry is listening on. Instead, NextJS handles the error (through it's own React Error Boundary), and renders the built in Error component from next/error.

To get around this, you can create your own pages/_error.js page like we do in the official Sentry NextJS example: https://github.com/vercel/next.js/blob/canary/examples/with-sentry/pages/_error.js.

Alternatively, you can wrap your components with Sentry's React Error Boundary: https://docs.sentry.io/platforms/javascript/guides/react/components/errorboundary/.

We are working on a) improving our documentation around this and b) seeing if we can get better behaviour out of the box without you having to add an error boundary or configuring pages/_errors.js, will update this issue once we've made progress on that.

[AbhiPrasad]

Related issue on documentation: #3901

[zacharypodbela]

Thank you for the follow up @AbhiPrasad! I was able to catch the error with both ErrorBoundary and pages/_errors.js. Thank you so much.