feat(expo): Add built-in Expo Support (#3399)

.eslintrc.js

@@ -12,7 +12,15 @@ module.exports = {
   settings: {
     version: 'detect', // React version. "detect" automatically picks the version you have installed.
   },
-  ignorePatterns: ['test/react-native/versions/**/*', 'coverage/**/*', 'test/typescript/**/*', 'metro.d.ts'],
+  ignorePatterns: [
+    'test/react-native/versions/**/*',
+    'coverage/**/*',
+    'test/typescript/**/*',
+    'metro.d.ts',
+    'samples/**/*',
+    'plugin/build/**/*',
+    'expo.d.ts',
+  ],
   overrides: [
     {
       // Typescript Files
@@ -37,7 +45,7 @@ module.exports = {
       // Scripts
       files: ['scripts/*'],
       parserOptions: {
-        ecmaVersion: 2015,
+        ecmaVersion: 2018,
       },
       rules: {
         'no-console': 'off',

.github/workflows/buildandtest.yml

@@ -107,6 +107,11 @@ jobs:
         with:
           name: ts3.8
           path: ts3.8
+      - name: Archive Expo Plugin
+        uses: actions/upload-artifact@v3
+        with:
+          name: expo-plugin
+          path: plugin/build
       - name: Pack
         run: yarn pack
       - name: Archive Artifacts
@@ -155,6 +160,37 @@ jobs:
         working-directory: test/typescript/ts3.8
         run: yarn type-check
 
+  job_circular_dep_check:
+    name: Circular Dependency Check
+    runs-on: ubuntu-latest
+    needs: [job_build]
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 18
+      - name: Cache Dependencies
+        uses: actions/cache@v3
+        id: cache
+        with:
+          path: node_modules
+          key: ${{ runner.os }}-${{ github.sha }}
+      - name: Install Dependencies
+        if: ${{ steps.cache.outputs['cache-hit'] != 'true' }}
+        run: yarn install
+      - name: Download dist
+        uses: actions/download-artifact@v3
+        with:
+          name: dist
+          path: dist
+      - name: Download Expo Plugin
+        uses: actions/download-artifact@v3
+        with:
+          name: expo-plugin
+          path: plugin/build
+      - name: Run madge
+        run: yarn circularDepCheck
+
   job_bundle:
     name: Bundle
     runs-on: ubuntu-latest

.npmignore

@@ -18,7 +18,14 @@
 !scripts/sentry-xcode.sh
 !scripts/sentry-xcode-debug-files.sh
 !scripts/sentry_utils.rb
+!scripts/expo-upload-sourcemaps.js
 
 # Metro
 !/metro.js
 !/metro.d.ts
+
+# Expo
+!/expo.js
+!/expo.d.ts
+!/app.plugin.js
+!/plugin/build/**/*

.vscode/settings.json

@@ -2,9 +2,7 @@
   "editor.formatOnType": true,
   "editor.formatOnPaste": false,
   "editor.formatOnSave": true,
-  "editor.rulers": [
-    120
-  ],
+  "editor.rulers": [120],
   "editor.tabSize": 2,
   "files.autoSave": "onWindowChange",
   "files.trimTrailingWhitespace": true,

CHANGELOG.md

@@ -2,17 +2,145 @@
 
 ## Unreleased
 
-### Fixes
+This release ships with a beta version of our new built-in Expo SDK 50 support,
+which replaces the deprecated `sentry-expo` package. To learn more,
+see [the Expo guide](https://docs.sentry.io/platforms/react-native/manual-setup/expo/).
+
+### Features
+
+- New `@sentry/react-native/expo` Expo config plugin ([#3429](https://github.com/getsentry/sentry-react-native/pull/3429))
+
+  ```js
+  const { withSentry } = require('@sentry/react-native/expo');
+
+  const config = {...};
+
+  module.exports = withSentry(config, {
+    url: 'https://www.sentry.io/',
+    authToken: 'example-token', // Or use SENTRY_AUTH_TOKEN env
+    project: 'project-slug', // Or use SENTRY_PROJECT env
+    organization: 'org-slug', // Or use SENTRY_ORG env
+  });
+  ```
+
+  - And `Sentry.init` in `App.js`
+
+  ```js
+  import * as Sentry from '@sentry/react-native';
+
+  Sentry.init({
+    dsn: '__DSN__',
+  });
+  ```
+
+- New `getSentryExpoConfig` for simple Metro configuration ([#3454](https://github.com/getsentry/sentry-react-native/pull/3454), [#3501](https://github.com/getsentry/sentry-react-native/pull/3501), [#3514](https://github.com/getsentry/sentry-react-native/pull/3514))
+  - This function is a drop in replacement for `getDefaultConfig` from `expo/metro-config`
+
+  ```js
+  // const { getDefaultConfig } = require("expo/metro-config");
+  const { getSentryExpoConfig } = require("@sentry/react-native/metro");
+
+  // const config = getDefaultConfig(__dirname);
+  const config = getSentryExpoConfig(config, {});
+  ```
 
+- New `npx sentry-expo-upload-sourcemaps` for simple EAS Update (`npx expo export`) source maps upload ([#3491](https://github.com/getsentry/sentry-react-native/pull/3491), [#3510](https://github.com/getsentry/sentry-react-native/pull/3510), [#3515](https://github.com/getsentry/sentry-react-native/pull/3515), [#3507](https://github.com/getsentry/sentry-react-native/pull/3507))
+
+  ```bash
+  SENTRY_PROJECT=project-slug \
+  SENTRY_ORG=org-slug \
+  SENTRY_AUTH_TOKEN=super-secret-token \
+  npx sentry-expo-upload-sourcemaps dist
+  ```
+
+### Others
+
+- Update `sentry-xcode.sh` scripts with Node modules resolution ([#3450](https://github.com/getsentry/sentry-react-native/pull/3450))
+  - RN SDK and Sentry CLI are dynamically resolved if override is not supplied
+- Resolve Default Integrations based on current platform ([#3465](https://github.com/getsentry/sentry-react-native/pull/3465))
+  - Native Integrations are only added if Native Module is available
+  - Web Integrations only for React Native Web builds
+- Remove Native Modules warning from platform where the absence is expected ([#3466](https://github.com/getsentry/sentry-react-native/pull/3466))
+- Add Expo Context information using Expo Native Modules ([#3466](https://github.com/getsentry/sentry-react-native/pull/3466))
 - Errors from InternalBytecode.js are no longer marked as in_app ([#3518](https://github.com/getsentry/sentry-react-native/pull/3518))
 
+## 5.16.0-alpha.4
+
+### Fixes
+
+- Make `getSentryExpoConfig` options parameter optional ([#3514](https://github.com/getsentry/sentry-react-native/pull/3514))
+- Use `@sentry/react-native/expo` as plugin name in `expo-upload-sourcemaps.js` ([#3515](https://github.com/getsentry/sentry-react-native/pull/3515))
+
+## 5.16.0-alpha.3
+
+This release is compatible with `[email protected]` and newer.
+
+### Features
+
+- `withSentryExpoSerializers` changes to `getSentryExpoConfig` ([#3501](https://github.com/getsentry/sentry-react-native/pull/3501))
+  - `getSentryExpoConfig` accepts the same parameters as `getDefaultConfig` from `expo/metro-config` and returns Metro configuration
+  - This also works for EAS Updates (and expo export). Debug ID is generated by `expo/metro-config` and used by Sentry.
+
+  ```js
+  const { getSentryExpoConfig } = require("@sentry/react-native/metro");
+  const config = getSentryExpoConfig(config, {});
+  ```
+
+- Add `npx sentry-expo-upload-sourcemaps` for simple EAS Update (expo export) source maps upload to Sentry ([#3491](https://github.com/getsentry/sentry-react-native/pull/3491), [#3510](https://github.com/getsentry/sentry-react-native/pull/3510))
+
+  ```bash
+  SENTRY_PROJECT=project-slug \
+  SENTRY_ORG=org-slug \
+  SENTRY_AUTH_TOKEN=super-secret-token \
+  npx sentry-expo-upload-sourcemaps dist
+  ```
+
+- Sentry CLI binary path in `scripts/expo-upload-sourcemaps.js` is resolved dynamically ([#3507](https://github.com/getsentry/sentry-react-native/pull/3507))
+  - Or can be overwritten by `SENTRY_CLI_EXECUTABLE` env
+
+- Resolve Default Integrations based on current platform ([#3465](https://github.com/getsentry/sentry-react-native/pull/3465))
+  - Native Integrations are only added if Native Module is available
+  - Web Integrations only for React Native Web builds
+- Remove Native Modules warning from platform where the absence is expected ([#3466](https://github.com/getsentry/sentry-react-native/pull/3466))
+- Add Expo Context information using Expo Native Modules ([#3466](https://github.com/getsentry/sentry-react-native/pull/3466))
+
+### Fixes
+
+- Includes fixes from version 5.15.2
+
 ## 5.15.2
 
 ### Fixes
 
 - Stop sending navigation route params for auto-generated transactions, as they may contain PII or other sensitive data ([#3487](https://github.com/getsentry/sentry-react-native/pull/3487))
   - Further details and other strategies to mitigate this issue can be found on our [trouble shooting guide page](https://docs.sentry.io/platforms/react-native/troubleshooting/#routing-transaction-data-contains-sensitive-information)
 
+## 5.16.0-alpha.2
+
+### Features
+
+- Add `withSentryExpoSerializers` for easy configurable `metro.config.js` ([#3454](https://github.com/getsentry/sentry-react-native/pull/3454))
+
+  This Serializer doesn't support EAS Updates (and expo export) commands yet. Debug IDs needed for source maps resolution in Sentry
+  are generated only during native builds.
+
+  ```js
+  const { getDefaultConfig } = require('expo/metro-config');
+  const { withSentryExpoSerializers } = require("@sentry/react-native/metro");
+
+  const config = getDefaultConfig(__dirname);
+  module.exports = withSentryExpoSerializers(config);
+  ```
+
+  Note that this will remove any existing `customSerializer`. Guide for advanced setups [can be found here](https://docs.sentry.io/platforms/react-native/manual-setup/metro).
+
+### Fixes
+
+- Expo SDK minimum version is 49 ([#3453](https://github.com/getsentry/sentry-react-native/pull/3453))
+- Remove RN Internal imports for RN Web builds ([#3462](https://github.com/getsentry/sentry-react-native/pull/3462))
+- Remove circular dependencies inside of the SDK ([#3464](https://github.com/getsentry/sentry-react-native/pull/3464))
+- Includes fixes from version 5.15.1
+
 ## 5.15.1
 
 ### Fixes
@@ -25,6 +153,48 @@
   - [changelog](https://github.com/getsentry/sentry-cli/blob/master/CHANGELOG.md#2230)
   - [diff](https://github.com/getsentry/sentry-cli/compare/2.21.3...2.23.0)
 
+## 5.16.0-alpha.1
+
+### Features
+
+- Add `@sentry/react-native/expo` Expo config plugin ([#3429](https://github.com/getsentry/sentry-react-native/pull/3429))
+
+  This Release introduces the first alpha version of our new SDK for Expo.
+  At this time, the SDK is considered experimental and things might break and change in future versions.
+
+  The core of the SDK is Expo plugin which you can easily add to your App config:
+
+  ```js
+  const { withSentry } = require('@sentry/react-native/expo');
+
+  const config = {...};
+
+  module.exports = withSentry(config, {
+    url: 'https://www.sentry.io/',
+    authToken: 'example-token', // Or use SENTRY_AUTH_TOKEN env
+    project: 'project-slug', // Or use SENTRY_PROJECT env
+    organization: 'org-slug', // Or use SENTRY_ORG env
+  });
+  ```
+
+  - And `Sentry.init` in `App.js`
+
+  ```js
+  import * as Sentry from '@sentry/react-native';
+
+  Sentry.init({
+    dsn: '__DSN__',
+  });
+  ```
+
+- Update `sentry-xcode.sh` scripts with Node modules resolution ([#3450](https://github.com/getsentry/sentry-react-native/pull/3450))
+  - RN SDK and Sentry CLI are dynamically resolved if override is not supplied
+
+### Fixes
+
+- Transform shipped JSX for both react-native and web ([#3428](https://github.com/getsentry/sentry-react-native/pull/3428))
+  - Removes builds errors when using react-native-web with Webpack
+
 ## 5.15.0
 
 ### Features

app.plugin.js

@@ -0,0 +1 @@
+module.exports = require('./expo');

expo.d.ts

@@ -0,0 +1 @@
+export * from './plugin/build';

expo.js

@@ -0,0 +1 @@
+module.exports = require('./plugin/build');

package.json

@@ -2,7 +2,7 @@
   "name": "@sentry/react-native",
   "homepage": "https://github.com/getsentry/sentry-react-native",
   "repository": "https://github.com/getsentry/sentry-react-native",
-  "version": "5.15.2",
+  "version": "5.16.0-alpha.4",
   "description": "Official Sentry SDK for react-native",
   "typings": "dist/js/index.d.ts",
   "types": "dist/js/index.d.ts",
@@ -18,26 +18,33 @@
   },
   "main": "dist/js/index.js",
   "scripts": {
-    "build": "yarn build:sdk && yarn downlevel && yarn build:tools",
+    "build": "yarn build:sdk && yarn downlevel && yarn build:tools && yarn build:plugin",
     "build:sdk": "tsc -p tsconfig.build.json",
     "build:sdk:watch": "tsc -p tsconfig.build.json -w --preserveWatchOutput",
     "build:tools": "tsc -p tsconfig.build.tools.json",
+    "build:tools:watch": "tsc -p tsconfig.build.tools.json -w --preserveWatchOutput",
+    "build:plugin": "EXPO_NONINTERACTIVE=true expo-module build plugin",
     "downlevel": "downlevel-dts dist ts3.8/dist --to=3.8",
-    "clean": "rimraf dist coverage",
+    "clean": "rimraf dist coverage && yarn clean:plugin",
+    "clean:plugin": "expo-module clean plugin",
+    "circularDepCheck": "madge --circular dist/js/index.js && madge --circular metro.js && madge --circular expo.js",
     "test": "yarn test:sdk && yarn test:tools",
     "test:sdk": "jest",
     "test:tools": "jest --config jest.config.tools.js",
     "fix": "yarn fix:eslint && yarn fix:prettier",
     "fix:eslint": "eslint --config .eslintrc.js --fix .",
-    "fix:prettier": "prettier --write \"{src,test,scripts}/**/**.ts\"",
+    "fix:prettier": "prettier --write \"{src,test,scripts,plugin/src}/**/**.ts\"",
     "lint": "yarn lint:eslint && yarn lint:prettier",
     "lint:eslint": "eslint --config .eslintrc.js .",
-    "lint:prettier": "prettier --check \"{src,test,scripts}/**/**.ts\"",
+    "lint:prettier": "prettier --check \"{src,test,scripts,plugin/src}/**/**.ts\"",
     "test:watch": "jest --watch",
     "run-ios": "cd samples/react-native && yarn react-native run-ios",
     "run-android": "cd samples/react-native && yarn react-native run-android",
     "yalc:add:sentry-javascript": "yalc add @sentry/browser @sentry/core @sentry/hub @sentry/integrations @sentry/react @sentry/types @sentry/utils"
   },
+  "bin": {
+    "sentry-expo-upload-sourcemaps": "scripts/expo-upload-sourcemaps.js"
+  },
   "keywords": [
     "react-native",
     "sentry",
@@ -54,6 +61,7 @@
     "When bumping make sure to update the version of react, i.e:  https://github.com/facebook/react-native/blob/v0.56.0/package.json"
   ],
   "peerDependencies": {
+    "expo": ">=49.0.0",
     "react": ">=17.0.0",
     "react-native": ">=0.65.0"
   },
@@ -68,6 +76,8 @@
     "@sentry/utils": "7.81.1"
   },
   "devDependencies": {
+    "@babel/core": "^7.23.5",
+    "@expo/metro-config": "0.16.0",
     "@sentry-internal/eslint-config-sdk": "7.81.1",
     "@sentry-internal/eslint-plugin-sdk": "7.81.1",
     "@sentry-internal/typescript": "7.80.0",
@@ -82,8 +92,11 @@
     "eslint": "^7.6.0",
     "eslint-plugin-react": "^7.20.6",
     "eslint-plugin-react-native": "^3.8.1",
+    "expo": "50.0.0-preview.8",
+    "expo-module-scripts": "^3.1.0",
     "jest": "^29.6.2",
     "jest-environment-jsdom": "^29.6.2",
+    "madge": "^6.1.0",
     "metro": "0.76",
     "prettier": "^2.0.5",
     "react": "18.2.0",
@@ -110,5 +123,10 @@
     "android": {
       "javaPackageName": "io.sentry.react"
     }
+  },
+  "peerDependenciesMeta": {
+    "expo": {
+      "optional": true
+    }
   }
 }

plugin/src/index.ts

@@ -0,0 +1,5 @@
+import { withSentry } from './withSentry';
+
+export { withSentry };
+
+export default withSentry;