Catching and logging JavaScript errors

How are you catching and logging JavaScript errors? At work we use Sentry.io and it works fairly well for some of our frontend React work. But I’m curious if there is a solution for Ionic. I saw that Firebase Crashlytics is native only it appeared. Open to suggestions as I’m getting some random errors from time to time so I’m sure other users are too!

We use Sentry.io for our Ionic app

How exactly do you setup Sentry so it catches all the errors?

We use the Browser plugin

I would love to have some sort of tooling to replay what the user did (and as such log user gestures). I guess, I need to keep on dreaming :slight_smile:

There is! https://www.testfairy.com/ :wink:

1 Like

Cool. Will look it up. Need web SDK

I see Sentry has a Capacitor version too (seems focused on Angular only though):

The more I look into this though, it seems you would want Sentry for iOS (doesn’t seem to be available now) and Sentry of Android (via Sentry/Capacitor) but you’d also need Sentry/browser too, no? I’m a little confused how to implement this.

The thing you linked looks very WIP to me, and as such:

Looks done as of 0.3.0.

Looks under discussion in issue #63.

Good observations. Still unclear how to implement when my project is Ionic/Vue and not Ionic/Angular. Seems to be some very Angular specific code in there.

Where? Seems Typescript to me.

Theres a guide for VueJS I believe, if you google you can find it.

@NgModule({
  providers: [
    {
      provide: ErrorHandler,
      useValue: createErrorHandler(),
    },
  ],
})

Never seen @NgModule in any TypeScript I’ve written for Ionic/Vue or Ionic/React.

The install even suggests:

@sentry/angular

That seems pretty Angular specific to me too. I can keep going as the Cordova version had many Angular references too. Lmk!

I see the VueJS version (Vue | Sentry Documentation) but wouldn’t that just catch my web-based errors? What about native app errors? I was hoping for a better explanation of how to capture both scenarios.

Dont see no angular here

(Just kidding)

Apparently I looked at different files

It would seem the Browser version that @richardshergold pointed out might work. Just not sure how to implement it on an Ionic/Vue project.

It would catch per platform as well as long as you set it up as it states in the docs. There are several blogs that some wrote a tutorial on this.
https://www.google.com/search?q=how+to+set+up+sentry+in+vuejs&rlz=1C5CHFA_enUS944US944&oq=how+to+set+up+sentry+in+vuejs&aqs=chrome..69i57.6201j0j1&sourceid=chrome&ie=UTF-8