Metrics for React Native SDK

Author: alwx

packages/core/android/libs/replay-stubs.jar

@@ -46,6 +46,7 @@ export {
   setCurrentClient,
   addEventProcessor,
   lastEventId,
+  metrics,
 } from '@sentry/core';
 
 export {

packages/core/src/js/index.ts

@@ -281,6 +281,7 @@ export const NATIVE: SentryNativeWrapper = {
       beforeSend,
       beforeBreadcrumb,
       beforeSendTransaction,
+      beforeSendMetric,
       integrations,
       ignoreErrors,
       logsOrigin,

packages/core/src/js/wrapper.ts

@@ -194,6 +194,24 @@ describe('Tests Native Wrapper', () => {
       expect(NATIVE.enableNative).toBe(true);
     });
 
+    test('filter beforeSendMetric when initializing Native SDK', async () => {
+      await NATIVE.initNativeSdk({
+        dsn: 'test',
+        enableNative: true,
+        autoInitializeNativeSdk: true,
+        beforeSendMetric: jest.fn(),
+        devServerUrl: undefined,
+        defaultSidecarUrl: undefined,
+        mobileReplayOptions: undefined,
+      });
+
+      expect(RNSentry.initNativeSdk).toHaveBeenCalled();
+      // @ts-expect-error mock value
+      const initParameter = RNSentry.initNativeSdk.mock.calls[0][0];
+      expect(initParameter).not.toHaveProperty('beforeSendMetric');
+      expect(NATIVE.enableNative).toBe(true);
+    });
+
     test('filter integrations when initializing Native SDK', async () => {
       await NATIVE.initNativeSdk({
         dsn: 'test',

packages/core/test/wrapper.test.ts

@@ -39,6 +39,22 @@ export default function TabOneScreen() {
             }}
           />
         </View>
+        <View style={styles.buttonWrapper}>
+          <Button
+            title="Metrics count: Increase"
+            onPress={() => {
+              Sentry.metrics.count('sentry_rn_test_metric', 1);
+            }}
+          />
+        </View>
+        <View style={styles.buttonWrapper}>
+          <Button
+            title="Metrics count: Increase by 100"
+            onPress={() => {
+              Sentry.metrics.count('sentry_rn_test_metric', 100);
+            }}
+          />
+        </View>
         <View style={styles.buttonWrapper}>
           <Button
             title="Capture exception"
@@ -202,7 +218,7 @@ export default function TabOneScreen() {
               Sentry.logger.warn('expo warn log');
               Sentry.logger.error('expo error log');
 
-              Sentry.logger.info('expo info log with data', { database: 'admin', number: 123, obj: { password: 'admin'} });
+              Sentry.logger.info('expo info log with data', { database: 'admin', number: 123, obj: { password: 'admin' } });
             }}
           />
         </View>

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

@@ -28,7 +28,7 @@ const navigationIntegration = Sentry.reactNavigationIntegration({
 
 Sentry.init({
   // Replace the example DSN below with your own DSN:
-  dsn: SENTRY_INTERNAL_DSN,
+  dsn: 'https://c96d5b6136315b7a6cef6230a38b4842@o4509786567475200.ingest.de.sentry.io/4510182962298960',
   debug: true,
   environment: 'dev',
   enableLogs: true,
@@ -40,6 +40,11 @@ Sentry.init({
     console.log('Transaction beforeSend:', event.event_id);
     return event;
   },
+  beforeSendMetric: (metric: Sentry.Metric) => {
+    console.log('Metric beforeSend:', metric.name, metric.value);
+    return metric;
+  },
+  enableMetrics: false,
   // This will be called with a boolean `didCallNativeInit` when the native SDK has been contacted.
   onReady: ({ didCallNativeInit }) => {
     console.log('onReady called with didCallNativeInit:', didCallNativeInit);

samples/expo/app/_layout.tsx

@@ -20,7 +20,7 @@
     "eas-build-development-android": "eas build --profile development --platform android"
   },
   "dependencies": {
-    "@sentry/react-native": "7.6.0",
+    "@sentry/react-native": "workspace:^",
     "@types/react": "~19.0.10",
     "expo": "^53.0.0",
     "expo-constants": "~17.1.5",

samples/expo/package.json

@@ -54,6 +54,10 @@ Sentry.init({
     logWithoutTracing('Transaction beforeSend:', event.event_id);
     return event;
   },
+  beforeSendMetric(metric: Sentry.Metric) {
+    logWithoutTracing('Metric beforeSend:', metric.name, metric.value);
+    return metric;
+  },
   // This will be called with a boolean `didCallNativeInit` when the native SDK has been contacted.
   onReady: ({ didCallNativeInit }) => {
     logWithoutTracing(

samples/react-native-macos/src/App.tsx

@@ -57,6 +57,10 @@ Sentry.init({
     logWithoutTracing('Transaction beforeSend:', event.event_id);
     return event;
   },
+  beforeSendMetric(metric: Sentry.Metric) {
+    logWithoutTracing('Metric beforeSend:', metric.name, metric.value);
+    return metric;
+  },
   // This will be called with a boolean `didCallNativeInit` when the native SDK has been contacted.
   onReady: ({ didCallNativeInit }) => {
     logWithoutTracing(

samples/react-native/src/App.tsx

@@ -9766,7 +9766,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@sentry/[email protected], @sentry/react-native@workspace:packages/core":
+"@sentry/[email protected], @sentry/react-native@workspace:^, @sentry/react-native@workspace:packages/core":
   version: 0.0.0-use.local
   resolution: "@sentry/react-native@workspace:packages/core"
   dependencies:
@@ -27606,7 +27606,7 @@ __metadata:
     "@babel/core": ^7.26.0
     "@babel/preset-env": ^7.26.0
     "@sentry/babel-plugin-component-annotate": 4.6.0
-    "@sentry/react-native": 7.6.0
+    "@sentry/react-native": "workspace:^"
     "@types/node": 20.10.4
     "@types/react": ~19.0.10
     expo: ^53.0.0