feat(examples): Use helper function in with-sentry example _error.js
#37866
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
lobsterkatie
added a commit
to getsentry/sentry-javascript
that referenced
this pull request
Jun 21, 2022
In order to have Sentry capture certain kinds of errors in nextjs, users need to add a custom `_error.js` file to their projects. We do this automatically when users go through the wizard setup, but [the file we've been adding](https://github.com/getsentry/sentry-wizard/blob/v1.2.17/scripts/NextJs/configs/_error.js) is just a clone of the one in vercel's `with-sentry` nextjs example app, and is simultaneously quite verbose and pretty bare-bones in terms of what it does. (This is not a knock on the folks who wrote it, who don't have the context we do, but the fact remains that it could stand to be improved.) This does so, by creating a utility function, `captureUnderscoreErrorException`, for users to use in place of the manual edge-case handling and `captureException` calls in the original. In addition to cleaning things up, this allows us to modify behavior, fix bugs, and add features without users having to update their code. (Existing users will have to update to use the function, of course, but after that they should never have to touch it again. And for new users, it'll be a set-it-and-forget-it.) With this change, the `_error.js` we add with the wizard becomes just ```js import * as Sentry from '@sentry/nextjs'; import NextErrorComponent from 'next/error'; const CustomErrorComponent = props => { Sentry.captureUnderscoreErrorException(props); return <NextErrorComponent statusCode={props.statusCode} />; }; CustomErrorComponent.getInitialProps = async contextData => { await Sentry.captureUnderscoreErrorException(contextData); return NextErrorComponent.getInitialProps(contextData); }; export default CustomErrorComponent; ``` (The real copy has helpful comments, but they've been removed here for the sake of brevity.) And speaking of adding features... why not start now? This new function improves on the existing code by: - filtering out all 400-type errors, not just 404s, - annotating errors with a `mechanism` value, - adding request data to the event when available, and - capturing a message when falsy errors are thrown. (See the PR for screenshots of the difference adding this data makes.) The file injected by the wizard is updated in getsentry/sentry-wizard#170, and the file used in the `with-sentry` example app is updated in vercel/next.js#37866.
lobsterkatie
force-pushed
the
kmclb-use-helper-function-in-with-sentry-_error
branch
from
d5f9bc9
to
764e84d
Compare
1 task
lobsterkatie
requested review from
timneutkens,
ijjk,
shuding,
leerob,
steven-tey and
balazsorban44
as code owners
lobsterkatie
force-pushed
the
kmclb-use-helper-function-in-with-sentry-_error
branch
from
043f7b7
to
1a9421c
Compare
AbhiPrasad
reviewed
Jul 8, 2022
lobsterkatie
force-pushed
the
kmclb-use-helper-function-in-with-sentry-_error
branch
2 times, most recently
from
1a9e36b
to
c3dd35e
Compare
lobsterkatie
force-pushed
the
kmclb-use-helper-function-in-with-sentry-_error
branch
from
c3dd35e
to
71bc429
Compare
|
@ijjk this should be ready to go now! |
ijjk
reviewed
Jul 15, 2022
2 tasks
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This updates the
with-sentryexample to use the new helper functioncaptureUnderscoreErrorExceptionin its_error.jspage. This new function both adds more data to sentry events and allows the code to be cleaned up quite a bit.Fixes #37870.
pnpm lint