Sentry-react-native: Importing Sentry causes error regarding `fetch`.

[AndrewSouthpaw]

Adding import Sentry from 'sentry-expo' to my App.js causes my app to crash:

Unhandled JS Exception: Requiring module "fetch", which threw an exception. 
TypeError: undefined is not an object (evaluating 'self.fetch').

Same problem happens if I simply import react-native-sentry.

Digging around, I've seen issues crop up in react-native here and fetch here and isomorphic-fetch here. AFAICT, isomorphic-fetch is the root of the problem, it's not maintained and didn't support React Native, and now people are moving to other packages (cross-fetch, fetch-everywhere, fetch-ponyfill, etc.) as a replacement.

Are other people running into this problem? Right now, following the Expo docs, I'm unable to get Sentry to work for React Native. 😞

Versions:

node: v8.4.0
npm: 5.6.0

"expo": "^27.0.2",
"react-native": "https://github.com/expo/react-native/archive/sdk-27.0.0.tar.gz",
"sentry-expo": "^1.9.0"

[HazAT]

Hey,

So not really sure what's going on, I can't reproduce this issue.
If I do a

create-react-native-app AwesomeProject
cd AwesomeProject
yarn add sentry-expo
npm start

As stated here:
https://facebook.github.io/react-native/docs/getting-started.html
https://docs.expo.io/versions/latest/guides/using-sentry#install-and-configure-sentry
it works without an error.

So I need a repro case in order the be able to help you :/

[brentvatne]

I also tried to repro this and was unable to, I think there is some interaction with another library being used in the project

[AndrewSouthpaw]

Blah. Thanks for looking into it, we'll dig around more on our end and see what's messing it up. 🙁

[AndrewSouthpaw]

FYI we resolved the issue by changing our .babelrc file. It used to contain a bunch of stuff:

presets: ['es2015', 'react', 'stage-2', 'flow', 'babel-preset-expo']

We changed it to

presets: ['babel-preset-expo']

and the problem resolved itself.

[Quadriphobs1]

I still experience thus if you try to use it alongside jest... Jest would not be able to run because of fetch api... Is there a test for this project already using jest

[spezzino]

Still happening with this config

"expo": "^29.0.0",
"sentry-expo": "^1.10.0"

Result:

Unhandled JS Exception: Requiring module "fetch", which threw an exception. 
TypeError: undefined is not an object (evaluating 'self.fetch').

.babelrc

{
  "presets": [
    "babel-preset-expo"
  ],
  "env": {
    "development": {
      "plugins": [
        "transform-react-jsx-source"
      ]
    }
  }
}

[spezzino]

Solved by explicitly adding this version to package.json

"whatwg-fetch": "2.0.4"

[akvsh-r]

This is likely an issue with the npm & builder cache. You must be having another dependency depending on whatwg-fetch.

Which you can easily check with npm ls whatwg-fetch.

Remove the dependency which is using whatwg-fetch reinstall it. Also clear the builder cache. If you're using expo expo start -c

You'll find some solution stating to do: global.self = global. Which is not really a solution.

[maxammann]

In my case this was caused by using the legacy babel plugin "transform-es2015-modules-commonjs".

[obibring]

@maxammann, I'm seeing the same issue with transform-es2015-modules-commonjs, but unfortunately, I need the plugin installed. Any idea what a workaround might be?

[maxammann]

There is an updated Version of that Plugin :) https://www.npmjs.com/package/@babel/plugin-transform-modules-commonjs

Also reset the cache of the packager.