sentry-javascript: Remix SDK invariant is not captured as Issue

Is there an existing issue for this?

I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
I have reviewed the documentation https://docs.sentry.io/
I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Sentry Saas (sentry.io)

Which package are you using?

@sentry/remix

SDK Version

7.5.0

Framework Version

7.5.0

Link to Sentry event

https://sentry.io/organizations/netzerorg/performance/trace/7a8e8c962aa242aabb565917ff0c891c/

Steps to Reproduce

import invariant from "tiny-invariant";

export const loader: LoaderFunction = async ({ params }) => {
  const user = params["*"];
  invariant(user, "user is required");
  const user= await getUser({ user: user});
  return json({
    user,
  });
};

Now, navigate to a route where the user does not exist.

Expected Result

Invariant is triggered and thrown and an issue is created in sentry dashboard

Actual Result

Invariant is triggered and thrown, however sentry only receives a transaction and doesn’t flag it as an issue.

About this issue

Original URL
State: closed
Created 2 years ago
Comments: 29 (12 by maintainers)

Commits related to this issue

fix(remix): Wrap `handleDocumentRequest` functions. (#5387) We're currently wrapping `action` and `loader` functions of Remix routes for tracing and error capturing. When testing the case in #5362... — committed to getsentry/sentry-javascript by onurtemizkan 2 years ago

Most upvoted comments

Super quick update, after further research it seems that https://github.com/getsentry/sentry-javascript/issues/5401#issuecomment-1179791517 is definitely what the ReferenceError: name is not defined error is about.

After patching locally not only did the name error go away, the invariant triggers in sentry correctly!

My changes:

    try {
      const span = activeTransaction.startChild({
        op: 'remix.server.documentRequest',
        description: activeTransaction.name,
        tags: {
          method: request.method,
          url: request.url,
        },
      });

      res = await origDocumentRequestFunction.call(this, request, responseStatusCode, responseHeaders, context);

      span.finish();
    } catch (err) {
--      captureRemixServerException(err, name);
++      captureRemixServerException(err, 'loader');
      throw err;
    }

I’m going to try test this out on the deployed version and update this comment accordingly. Fingers crossed!

Update:

After applying the above change to the deployed version the ReferenceError: name is not defined error does not show and the invariant gets sent correctly as an issue so it’s the same result as local!

However the issue mentioned earlier Object.captureException still remains.

moishinetzer on Jul 10, 2022

@AbhiPrasad yes, received! Just saw it now thanks for the bump!!

moishinetzer on Jul 28, 2022

Fix released with 7.7.0! 🚀

AbhiPrasad on Jul 15, 2022

Just tested out the latest commit and it seems that all problems mentioned in this issue beginning to end have been resolved!

I’ll test out the release when it comes out and assuming all’s fine I’ll close the issue.

Thanks so much @AbhiPrasad @onurtemizkan for all your hard work on this. And ridiculously fast respond time! 👏

moishinetzer on Jul 11, 2022

I still can’t reproduce the RangeError: Maximum call stack size exceeded locally. Could it be coming from a serverless deployment?

Yeah it’s probably a serverless issue IMO. Let’s try applying the patch in https://github.com/getsentry/sentry-javascript/issues/5362#issuecomment-1176800746?

AbhiPrasad on Jul 7, 2022

@onurtemizkan Thanks so much for your help!

To confirm, I only started seeing this RangeError issue after it was deployed, so that very well may be the case.

In which case is there any contact where I can email you the link to the deployed site?

It’s currently hosted on fly.io free tier using the default indie-stack hosting preconfiguration.

moishinetzer on Jul 7, 2022

@moishinetzer, thanks for the repro case.

About the invariant issue: I have tested your project, and found the invariant which is failing for business is not from a loader, but from the SSR component. Screenshot 2022-07-07 at 14 15 23

We are already capturing any errors, including invariants from loader/action functions. But this seems to be another case to be handled inside wrapRequestHandler. I’ll open a PR to fix it.

@AbhiPrasad, @lforst: I still can’t reproduce the RangeError: Maximum call stack size exceeded locally. Could it be coming from a serverless deployment?

onurtemizkan on Jul 7, 2022

Sure. I’ll test this out in a few hours and update you then. In the meantime I’ve added both of you to my private repo if you want to investigate further. Thanks for your help!

moishinetzer on Jul 7, 2022

Hey thanks for writing in. @onurtemizkan mind taking a look when you get some time to help triage this?

AbhiPrasad on Jul 5, 2022