feat(core): Bump sentry-javascript to version 8

CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+### Fixes
+
+- CaptureMessage stack-trace is now symbolicated ([#3635](https://github.com/getsentry/sentry-react-native/pull/3635))
+
 ### Dependencies
 
 - Bump CLI from v2.30.4 to v2.31.2 ([#3719](https://github.com/getsentry/sentry-react-native/pull/3719))

package.json

@@ -40,7 +40,7 @@
     "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",
+    "yalc:add:sentry-javascript": "yalc add @sentry/browser @sentry/core @sentry/react @sentry/types @sentry/utils",
     "set-version-samples": "bash scripts/set-version-samples.sh"
   },
   "bin": {
@@ -67,22 +67,20 @@
     "react-native": ">=0.65.0"
   },
   "dependencies": {
-    "@sentry/browser": "7.113.0",
+    "@sentry/browser": "8.0.0-alpha.9",
     "@sentry/cli": "2.31.2",
-    "@sentry/core": "7.113.0",
-    "@sentry/hub": "7.113.0",
-    "@sentry/integrations": "7.113.0",
-    "@sentry/react": "7.113.0",
-    "@sentry/types": "7.113.0",
-    "@sentry/utils": "7.113.0"
+    "@sentry/core": "8.0.0-alpha.9",
+    "@sentry/react": "8.0.0-alpha.9",
+    "@sentry/types": "8.0.0-alpha.9",
+    "@sentry/utils": "8.0.0-alpha.9"
   },
   "devDependencies": {
     "@babel/core": "^7.23.5",
     "@expo/metro-config": "0.17.5",
     "@mswjs/interceptors": "^0.25.15",
-    "@sentry-internal/eslint-config-sdk": "7.113.0",
-    "@sentry-internal/eslint-plugin-sdk": "7.113.0",
-    "@sentry-internal/typescript": "7.113.0",
+    "@sentry-internal/eslint-config-sdk": "8.0.0-alpha.9",
+    "@sentry-internal/eslint-plugin-sdk": "8.0.0-alpha.9",
+    "@sentry-internal/typescript": "8.0.0-alpha.9",
     "@sentry/wizard": "3.16.3",
     "@types/jest": "^29.5.3",
     "@types/node": "^20.9.3",

samples/expo/app/(tabs)/index.tsx

@@ -31,7 +31,7 @@ export default function TabOneScreen() {
 
   return (
     <View style={styles.container}>
-      <Sentry.TimeToInitialDisplay record />
+      {/* <Sentry.TimeToInitialDisplay record /> */}
       <Text>Welcome to Sentry Expo Sample App!</Text>
       <Button
         title="Capture message"

samples/expo/app/_layout.tsx

@@ -5,7 +5,7 @@ import { SplashScreen, Stack, useNavigationContainerRef } from 'expo-router';
 import { useEffect } from 'react';
 
 import { useColorScheme } from '@/components/useColorScheme';
-import { HttpClient } from '@sentry/integrations';
+import { httpClientIntegration } from '@sentry/react';
 import { SENTRY_INTERNAL_DSN } from '../utils/dsn';
 import * as Sentry from '@sentry/react-native';
 import { isExpoGo } from '../utils/isExpoGo';
@@ -41,7 +41,7 @@ process.env.EXPO_SKIP_DURING_EXPORT !== 'true' && Sentry.init({
   },
   integrations(integrations) {
     integrations.push(
-      new HttpClient({
+      httpClientIntegration({
         // These options are effective only in JS.
         // This array can contain tuples of `[begin, end]` (both inclusive),
         // Single status codes, or a combinations of both.
@@ -51,7 +51,6 @@ process.env.EXPO_SKIP_DURING_EXPORT !== 'true' && Sentry.init({
         // default: [/.*/]
         failedRequestTargets: [/.*/],
       }),
-      Sentry.metrics.metricsAggregatorIntegration(),
       new Sentry.ReactNativeTracing({
         routingInstrumentation,
       }),

samples/expo/metro.config.js

@@ -15,8 +15,8 @@ config.watchFolders.push(path.resolve(__dirname, '../../node_modules/@sentry'));
 config.watchFolders.push(path.resolve(__dirname, '../../node_modules/@sentry-internal'));
 config.watchFolders.push(path.resolve(__dirname, '../../node_modules/tslib'));
 config.watchFolders.push(path.resolve(__dirname, '../../node_modules/hoist-non-react-statics'));
-config.watchFolders.push(path.resolve(__dirname, '../../node_modules/localforage'));
 config.watchFolders.push(path.resolve(__dirname, '../../node_modules/@react-native/js-polyfills'));
+config.watchFolders.push(path.resolve(__dirname, '../../node_modules/preact'));
 config.watchFolders.push(`${__dirname}/../../dist`);
 
 const exclusionList = [new RegExp(`${__dirname}/../../node_modules/react-native/.*`)];

samples/react-native/src/App.tsx

@@ -23,8 +23,9 @@ import { store } from './reduxApp';
 import { GestureHandlerRootView } from 'react-native-gesture-handler';
 import GesturesTracingScreen from './Screens/GesturesTracingScreen';
 import { Platform, StyleSheet } from 'react-native';
-import { HttpClient } from '@sentry/integrations';
+import { httpClientIntegration } from '@sentry/react';
 import Ionicons from 'react-native-vector-icons/Ionicons';
+import { ErrorEvent } from '@sentry/types';
 
 const isMobileOs = Platform.OS === 'android' || Platform.OS === 'ios';
 
@@ -39,7 +40,7 @@ Sentry.init({
   dsn: SENTRY_INTERNAL_DSN,
   debug: true,
   environment: 'dev',
-  beforeSend: (event: Sentry.Event) => {
+  beforeSend: (event: ErrorEvent) => {
     console.log('Event beforeSend:', event.event_id);
     return event;
   },
@@ -59,16 +60,16 @@ Sentry.init({
         routingInstrumentation: reactNavigationInstrumentation,
         enableUserInteractionTracing: true,
         ignoreEmptyBackNavigationTransactions: true,
-        beforeNavigate: (context: Sentry.ReactNavigationTransactionContext) => {
-          // Example of not sending a transaction for the screen with the name "Manual Tracker"
-          if (context.data.route.name === 'ManualTracker') {
-            context.sampled = false;
-          }
+        // beforeNavigate: (context: ) => {
+        //   // Example of not sending a transaction for the screen with the name "Manual Tracker"
+        //   // if (context.data.route.name === 'ManualTracker') {
+        //   //   context.sampled = false;
+        //   // }
 
-          return context;
-        },
+        //   return context;
+        // },
       }),
-      new HttpClient({
+      httpClientIntegration({
         // These options are effective only in JS.
         // This array can contain tuples of `[begin, end]` (both inclusive),
         // Single status codes, or a combinations of both.
@@ -78,7 +79,6 @@ Sentry.init({
         // default: [/.*/]
         failedRequestTargets: [/.*/],
       }),
-      Sentry.metrics.metricsAggregatorIntegration(),
     );
     return integrations.filter(i => i.name !== 'Dedupe');
   },
@@ -87,7 +87,6 @@ Sentry.init({
   sessionTrackingIntervalMillis: 5000,
   // This will capture ALL TRACES and likely use up all your quota
   enableTracing: true,
-  tracesSampleRate: 1.0,
   tracePropagationTargets: ['localhost', /^\//, /^https:\/\//, /^http:\/\//],
   attachStacktrace: true,
   // Attach screenshots to events.
@@ -101,7 +100,7 @@ Sentry.init({
   // release: '[email protected]+1',
   // dist: `1`,
   _experiments: {
-    profilesSampleRate: 1.0,
+    profilesSampleRate: 0,
   },
   enableSpotlight: true,
 });

samples/react-native/src/Screens/GesturesTracingScreen.tsx

@@ -1,7 +1,8 @@
 import React from 'react';
 import { StyleSheet, Text, View } from 'react-native';
 import { Gesture, GestureDetector } from 'react-native-gesture-handler';
-import { getCurrentHub, Scope, sentryTraceGesture } from '@sentry/react-native';
+import { sentryTraceGesture, startSpanManual } from '@sentry/react-native';
+import { Span } from '@sentry/types';
 
 const GesturesTracingScreen = () => {
   const gesture = Gesture.Pinch().onBegin(() => {
@@ -18,10 +19,9 @@ const GesturesTracingScreen = () => {
 };
 
 const startExampleSpan = () => {
-  getCurrentHub().withScope((scope: Scope) => {
-    const child = scope.getTransaction()?.startChild({ op: 'example' });
+  startSpanManual({ name: 'Example', op: 'example' }, (span: Span) => {
     setTimeout(() => {
-      child?.finish();
+      span.end();
     }, 1000);
   });
 };

scripts/update-javascript.sh

@@ -3,7 +3,7 @@ set -euo pipefail
 
 tagPrefix=''
 repo="https://github.com/getsentry/sentry-javascript.git"
-packages=('@sentry/browser' '@sentry/core' '@sentry/hub' '@sentry/integrations' '@sentry/react' '@sentry/types' '@sentry/utils' '@sentry-internal/typescript')
+packages=('@sentry/browser' '@sentry/core' '@sentry/react' '@sentry/types' '@sentry/utils' '@sentry-internal/typescript')
 packages+=('@sentry-internal/eslint-config-sdk' '@sentry-internal/eslint-plugin-sdk')
 
 . $(dirname "$0")/update-package-json.sh

src/js/client.ts

@@ -6,10 +6,9 @@ import type {
   Envelope,
   Event,
   EventHint,
-  Exception,
   Outcome,
   SeverityLevel,
-  Thread,
+  TransportMakeRequestResponse,
   UserFeedback,
 } from '@sentry/types';
 import { dateTimestampInSeconds, logger, SentryError } from '@sentry/utils';
@@ -18,7 +17,7 @@ import { Alert } from 'react-native';
 import { createIntegration } from './integrations/factory';
 import { defaultSdkInfo } from './integrations/sdkinfo';
 import type { ReactNativeClientOptions } from './options';
-import { ReactNativeTracing } from './tracing';
+import type { ReactNativeTracing } from './tracing';
 import { createUserFeedbackEnvelope, items } from './utils/envelope';
 import { ignoreRequireCycleLogs } from './utils/ignorerequirecyclelogs';
 import { mergeOutcomes } from './utils/outcome';
@@ -44,7 +43,6 @@ export class ReactNativeClient extends BaseClient<ReactNativeClientOptions> {
     super(options);
 
     this._outcomesBuffer = [];
-    this._initNativeSdk();
   }
 
   /**
@@ -58,22 +56,7 @@ export class ReactNativeClient extends BaseClient<ReactNativeClientOptions> {
    * @inheritDoc
    */
   public eventFromMessage(message: string, level?: SeverityLevel, hint?: EventHint): PromiseLike<Event> {
-    return eventFromMessage(this._options.stackParser, message, level, hint, this._options.attachStacktrace).then(
-      (event: Event) => {
-        // TMP! Remove this function once JS SDK uses threads for messages
-        if (!event.exception?.values || event.exception.values.length <= 0) {
-          return event;
-        }
-        const values = event.exception.values.map(
-          (exception: Exception): Thread => ({
-            stacktrace: exception.stacktrace,
-          }),
-        );
-        (event as { threads?: { values: Thread[] } }).threads = { values };
-        delete event.exception;
-        return event;
-      },
-    );
+    return eventFromMessage(this._options.stackParser, message, level, hint, this._options.attachStacktrace);
   }
 
   /**
@@ -103,29 +86,14 @@ export class ReactNativeClient extends BaseClient<ReactNativeClientOptions> {
       dsn: this.getDsn(),
       tunnel: undefined,
     });
-    this._sendEnvelope(envelope);
-  }
-
-  /**
-   * Sets up the integrations
-   */
-  public setupIntegrations(): void {
-    super.setupIntegrations();
-    const tracing = this.getIntegration(ReactNativeTracing);
-    const routingName = tracing?.options.routingInstrumentation?.name;
-    if (routingName) {
-      this.addIntegration(createIntegration(routingName));
-    }
-    const enableUserInteractionTracing = tracing?.options.enableUserInteractionTracing;
-    if (enableUserInteractionTracing) {
-      this.addIntegration(createIntegration('ReactNativeUserInteractionTracing'));
-    }
+    // eslint-disable-next-line @typescript-eslint/no-floating-promises
+    this.sendEnvelope(envelope);
   }
 
   /**
    * @inheritdoc
    */
-  protected _sendEnvelope(envelope: Envelope): void {
+  public sendEnvelope(envelope: Envelope): PromiseLike<TransportMakeRequestResponse> {
     const outcomes = this._clearOutcomes();
     this._outcomesBuffer = mergeOutcomes(this._outcomesBuffer, outcomes);
 
@@ -154,6 +122,32 @@ export class ReactNativeClient extends BaseClient<ReactNativeClientOptions> {
     if (shouldClearOutcomesBuffer) {
       this._outcomesBuffer = []; // if send fails synchronously the _outcomesBuffer will stay intact
     }
+
+    return Promise.resolve({});
+  }
+
+  /**
+   * @inheritDoc
+   */
+  public init(): void {
+    super.init();
+    this._initNativeSdk();
+  }
+
+  /**
+   * @inheritdoc
+   */
+  protected _setupIntegrations(): void {
+    super._setupIntegrations();
+    const tracing = this.getIntegrationByName<ReactNativeTracing>('ReactNativeTracing');
+    const routingName = tracing?.options?.routingInstrumentation?.name;
+    if (routingName) {
+      this.addIntegration(createIntegration(routingName));
+    }
+    const enableUserInteractionTracing = tracing?.options.enableUserInteractionTracing;
+    if (enableUserInteractionTracing) {
+      this.addIntegration(createIntegration('ReactNativeUserInteractionTracing'));
+    }
   }
 
   /**