search

getsentry / sentry-react-native

Official Sentry SDK for React Native
https://sentry.io
MIT License
1.57k stars 337 forks source link

No errors reported since upgrading to 3.0.1 from 2.6.2 #1773

Closed darrylyoung closed 3 years ago

darrylyoung commented 3 years ago

Environment

How do you use Sentry?

Which SDK and version?

Steps to Reproduce

  1. Upgrade @sentry/react-native from 2.6.2 to 3.0.1
  2. Use the app as usual
  3. Notice that after a week or so, no issues have been reported (even after manually triggering an error)

Expected Result

I'd expect to see any errors in Sentry but there's been nothing reported since just before upgrading to 3.0.1.

Actual Result

No errors in Sentry.

Extra information

My app started as a managed Expo app and a while ago I ejected to the bare workflow. Since then, I've been using @sentry/react-native and sentry-expo as shown here in Expo's docs.

Setup

sentry.ts

import { Platform } from 'react-native'

const SENTRY_DSN_IOS = '...'
const SENTRY_DSN_ANDROID = '...'

export const sentryConfig = {
  dsn: Platform.OS === 'ios' ? SENTRY_DSN_IOS : SENTRY_DSN_ANDROID,
  enableInExpoDevelopment: true,
  enableAutoSessionTracking: true,
  debug: __DEV__ ? true : false,
  environment: __DEV__ ? 'development' : 'production',
}

App.tsx

import * as Sentry from 'sentry-expo'
import { sentryConfig } from './config/sentry'

// ...

Sentry.init(sentryConfig)

// ...

Sentry.Native.captureException(error) // Example error after unsuccessful API call, etc.

This setup has been working for quite some time, despite issues with source maps mentioned in #1350.

What am I missing? Was I supposed to do some extra configuration when updating to 3.0.1? If there's any further information that I could send that may help, just let me know.

Thanks for your time! Have a nice day.

jennmueng commented 3 years ago

@darrylyoung If you're using sentry-expo I think you should rely on their versions rather than upgrading through this @sentry/react-native sdk as there could be changes that have not been accounted for in the sdk for expo. Anyways, can you show us the javascript logs with debug: true passed to the Sentry init call?

cc @cruzach

darrylyoung commented 3 years ago

Hi, @jennmueng. Thanks for the reply.

Anyways, can you show us the javascript logs with debug: true passed to the Sentry init call?

Sure, here's what I see:

 LOG  Sentry Logger [Log]: Integration installed: Release
 LOG  Sentry Logger [Log]: Integration installed: InboundFilters
 LOG  Sentry Logger [Log]: Integration installed: FunctionToString
 LOG  Sentry Logger [Log]: Integration installed: Breadcrumbs
 LOG  Sentry Logger [Log]: Integration installed: LinkedErrors
 LOG  Sentry Logger [Log]: Integration installed: UserAgent
 LOG  Sentry Logger [Log]: Integration installed: DebugSymbolicator
 LOG  Sentry Logger [Log]: Integration installed: DeviceContext
 LOG  Sentry Logger [Log]: Integration installed: ReactNativeErrorHandlers
 LOG  Sentry Logger [Log]: Integration installed: ExpoBareIntegration
 LOG  Sentry Logger [Log]: Integration installed: RewriteFrames
darrylyoung commented 3 years ago

Here's a little more information:

I noticed, in Expo's Using Sentry page, that it first mentions to use import * as Sentry from 'sentry-expo'; but then, when on the bare workflow, run the wizard to get import * as Sentry from '@sentry/react-native'; automatically added. Then, however, it says you should remove that and "keep the sentry-expo import and original Sentry.init call!"

jennmueng commented 3 years ago

@darrylyoung Hmm, did you make sure to run pod install after updating to the latest version? Also, can you pass a beforeSend option into your Sentry.init call and log to see if the event comes through after an error is captured?

darrylyoung commented 3 years ago

Hi, @jennmueng. Thanks for the message. Yes, I'd already tried pod install as well as clearing literally everything related to React Native. I wasn't aware of beforeSend so I just tried with this so I hope it's enough for what you need:

Sentry.init({
  beforeSend: (event, hint) => {
    if (hint) {
      console.log({ hint })
    }

    console.log('Before: ', event)

    return event
  },
  ...sentryConfig,
})

When manually throwing an error with throw new Error('My first Sentry error!'), I now see the following:

 LOG  Sentry Logger [Log]: Failed to get device context from native: TypeError: undefined is not a function
 LOG  {"hint": {"event_id": "d608700791ea48d19aa777289fc7eaca", "originalException": [Error: My first Sentry error!]}}
 LOG  Before:  {"breadcrumbs": [{"category": "console", "data": [Object], "level": "log", "message": "Running \"main\" with {\"rootTag\":21,\"initialProps\":{}}", "timestamp": 1631730989.289}, {"category": "console", "data": [Object], "level": "error", "message": "Error: My first Sentry error!

Any idea what the device context issue is? Nothing shows up in Sentry after this, by the way.

Just to be sure, am I using the imports the right way? Maybe we make sure that's right first. The Expo docs (for bare workflow) say to run yarn add @sentry/react-native (which'll now install 3.1.0) and says to keep the sentry-expo import (after running the wizard).

Thanks again! It's much appreciated.

darrylyoung commented 3 years ago

Hi, @jennmueng / @cruzach.

I just tried changing the Sentry import, despite this being wrong according to Expo documentation, and I actually saw an error in Sentry (the first since upgrading to 3.x). Note that I just tried this in App.tsx where I initialise Sentry and haven't changed imports elsewhere.

Before

import * as Sentry from 'sentry-expo'

After:

import * as Sentry from '@sentry/react-native'

I immediately see the following in my editor where I've used Sentry via Sentry.Native.*:

Property 'Native' does not exist on type 'typeof import(".../client/node_modules/@sentry/react-native/dist/js/index")'.ts(2339)

Again, this seems wrong based on Expo's documentation as it also mentions using Sentry.Native and I'd been using that without issue for quite some time before upgrading from 2.x to 3.x.

I guess I could change all imports but I'd love to know if that's actually the right thing to do. Again, my use case is that I started an app in Expo's managed workflow and then ejected to the bare workflow. All error reporting was fine before the recent upgrade. Could it be related to that, being on React Native 0.65.1, or even the fact that I have Hermes enabled? I'd love to get this figured out soon as I'm planning on releasing this project in the next couple of weeks.

Update: Also, could it be related to the following warning I've also recently started seeing? I created an issue for that here.

WARN  Constants.manifest is null because the embedded app.config could not be read. Ensure that you have installed the expo-constants build scripts if you need to read from Constants.manifest.
jennmueng commented 3 years ago

@darrylyoung From what I see here:

 LOG  Sentry Logger [Log]: Failed to get device context from native: TypeError: undefined is not a function

This suggests to me that you are still missing the native module. I would make sure that the pod install actually installed the native module. Another way to check this out is if calling Sentry.nativeCrash() actually crashes the app or not. If it doesn't and just logs a error on the Javascript console, then you're missing the native module.

Also, sentry-expo's .Native is essentially just passing along what we export from @sentry/react-native, so if you use our SDK directly and not expo's, you can skip the .Native. prefix.

darrylyoung commented 3 years ago

Hi, @jennmueng.

I tried using Sentry.nativeCrash but as I'm using the Expo import, it was Sentry.Native.nativeCrash(). This worked in that it crashed the app back to the Home Screen on the iOS Simulator. Nothing in Sentry, though. Is there any other way to check if the native module was installed correctly or is that crash enough to show that it was?

As before, I just switched to the import * as Sentry from '@sentry/react-native' import in my App.tsx (but not anywhere else) and immediately I saw any crashes/errors start showing up again in Sentry. I'm not sure what else to do. Does it even make sense to still use the Sentry import now that I'm running a bare workflow? I notice that in Sentry, new releases are still showing in the Releases section (with source maps automatically uploaded) when I build and publish to TestFlight so I'm guessing this is being done on the Expo side, right?

I get the feeling that it's something Expo-related that's causing the problem as I know there've been some issues on React Native 0.65.0.

brduck commented 3 years ago

Hi @darrylyoung I'm facing the same issue in a React Native 63.4 with Expo 42 Bare Workflow so I'm not sure if it's related to your React Native 65 version. I did as you suggested and changed my Sentry. init() from 

import * as Sentry from 'sentry-expo'

to

import * as Sentry from '@sentry/react-native'

And I'm sending all my issues using Sentry.Native from sentry-expo and it's showing up again in Sentry, But I'm not able to see my source maps, If I make a new release with expo publish, my errors are not attached to the new release even though my new release is on Sentry.

darrylyoung commented 3 years ago

HI, @BPatinho. I'm sorry to hear that you're also having trouble but I'm glad it's not just me as I've just spent the whole morning going back through package updates, testing along the way, and the only time I'm getting errors reported properly is when I'm back on Sentry 2.6.2 or if I'm (apparently incorrectly) importing from @sentry/react-native and not sentry-expo. It doesn't seem to matter if I'm on React Native 0.64.x or 0.65.x.

I looked around in the expo/sentry-expo repository and found this issue where somebody recently mentioned sentry-expo not being compatible with @sentry/react-native as it's stuck using @sentry/react-native version ^2.5.2.

Maybe I'm wrong, but it seems like there are some dots to be connected between Sentry and Expo here. Any thoughts, @jennmueng?

zyzo commented 3 years ago

Hi guys, I'm not using Expo at all, just react-native, and by upgrading from 2.1.0 to 3.0.1 I'm having the same issues. Error reporting just stopped working in production mode, but works fine in dev mode.

I was able to identify the problem, it's down to codepush & sentry wrapper order.

Before (doesn't work) : 

import * as Sentry from '@sentry/react-native';
import codePush from 'react-native-code-push';

[...]
export default Sentry.wrap(codePush(options)(App);

After (working) : 

import * as Sentry from '@sentry/react-native';
import codePush from 'react-native-code-push';

[...]
export default codePush(options)(Sentry.wrap(App));

Not sure why though 😔

darrylyoung commented 3 years ago

Hi, @jennmueng.

Since sentry-expo was just updated to use "@sentry/react-native": "^3.1.1", I'm now seeing errors again in Sentry. Note that I'm still using the sentry-expo import as I was prior to the issue starting when the version mismatch happened. Thank you so much for your continued support — it's very much appreciated.

jennmueng commented 3 years ago

Closing this as sentry-expo was updated.

aesqe commented 2 years ago

Hi guys, I'm not using Expo at all, just react-native, and by upgrading from 2.1.0 to 3.0.1 I'm having the same issues. Error reporting just stopped working in production mode, but works fine in dev mode.

I was able to identify the problem, it's down to codepush & sentry wrapper order.

Before (doesn't work) :

import * as Sentry from '@sentry/react-native';
import codePush from 'react-native-code-push';

[...]
export default Sentry.wrap(codePush(options)(App);

After (working) :

import * as Sentry from '@sentry/react-native';
import codePush from 'react-native-code-push';

[...]
export default codePush(options)(Sentry.wrap(App));

Not sure why though 😔

Thank you so much for this @zyzo! I'm not sure if this is mentioned somewhere in the documentation, but it really should be.