Merge branch 'main' into v8

Author: antonis

.github/workflows/sample-application.yml

@@ -14,6 +14,7 @@ concurrency:
 env:
   SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
   MAESTRO_VERSION: '2.0.10'
+  MAESTRO_DRIVER_STARTUP_TIMEOUT: 90000 # Increase timeout from default 30s to 90s for CI stability
   RN_SENTRY_POD_NAME: RNSentry
   IOS_APP_ARCHIVE_PATH: sentry-react-native-sample.app.zip
   ANDROID_APP_ARCHIVE_PATH: sentry-react-native-sample.apk.zip

CHANGELOG.md

@@ -11,6 +11,7 @@
 ### Fixes
 
 - Fix for missing `replay_id` from metrics ([#5483](https://github.com/getsentry/sentry-react-native/pull/5483))
+- Skip span ID check when standalone mode is enabled ([#5493](https://github.com/getsentry/sentry-react-native/pull/5493))
 
 ### Dependencies
 

packages/core/src/js/tracing/integrations/appStart.ts

@@ -320,21 +320,26 @@ export const appStartIntegration = ({
       return;
     }
 
-    if (!firstStartedActiveRootSpanId) {
-      debug.warn('[AppStart] No first started active root span id recorded. Can not attach app start.');
-      return;
-    }
-
     if (!event.contexts?.trace) {
       debug.warn('[AppStart] Transaction event is missing trace context. Can not attach app start.');
       return;
     }
 
-    if (firstStartedActiveRootSpanId !== event.contexts.trace.span_id) {
-      debug.warn(
-        '[AppStart] First started active root span id does not match the transaction event span id. Can not attached app start.',
-      );
-      return;
+    // When standalone is true, we create our own transaction and don't need to verify
+    // it matches the first navigation transaction. When standalone is false, we need to
+    // ensure we're attaching app start to the first transaction (not a later one).
+    if (!standalone) {
+      if (!firstStartedActiveRootSpanId) {
+        debug.warn('[AppStart] No first started active root span id recorded. Can not attach app start.');
+        return;
+      }
+
+      if (firstStartedActiveRootSpanId !== event.contexts.trace.span_id) {
+        debug.warn(
+          '[AppStart] First started active root span id does not match the transaction event span id. Can not attached app start.',
+        );
+        return;
+      }
     }
 
     const appStart = await NATIVE.fetchNativeAppStart();

packages/core/test/tracing/integrations/appStart.test.ts

@@ -6,6 +6,7 @@ import {
   SEMANTIC_ATTRIBUTE_SENTRY_OP,
   SEMANTIC_ATTRIBUTE_SENTRY_ORIGIN,
   setCurrentClient,
+  startInactiveSpan,
   timestampInSeconds,
 } from '@sentry/core';
 import {
@@ -385,6 +386,69 @@ describe('App Start Integration', () => {
       expect(actualEvent).toStrictEqual(undefined);
       expect(NATIVE.fetchNativeAppStart).toHaveBeenCalledTimes(1);
     });
+
+    it('Attaches app start to standalone transaction even when navigation transaction starts first', async () => {
+      // This test simulates the Android scenario where React Navigation auto-instrumentation
+      // starts a navigation transaction before the standalone app start transaction is created.
+      // The fix ensures that when standalone: true, the span ID check is skipped so app start
+      // can be attached to the standalone transaction even if a navigation transaction started first.
+      getCurrentScope().clear();
+      getIsolationScope().clear();
+      getGlobalScope().clear();
+
+      mockAppStart({ cold: true });
+
+      const integration = appStartIntegration({
+        standalone: true,
+      });
+      const client = new TestClient({
+        ...getDefaultTestClientOptions(),
+        enableAppStartTracking: true,
+        tracesSampleRate: 1.0,
+      });
+      setCurrentClient(client);
+      integration.setup(client);
+
+      // Simulate a navigation transaction starting first (like React Navigation auto-instrumentation)
+      // This will set firstStartedActiveRootSpanId to the navigation span's ID
+      const navigationSpan = startInactiveSpan({
+        name: 'calendar/home',
+        op: 'navigation',
+        forceTransaction: true,
+      });
+      const navigationSpanId = navigationSpan?.spanContext().spanId;
+      if (navigationSpan) {
+        navigationSpan.end();
+      }
+
+      // Now capture standalone app start - it should still work even though navigation span started first
+      // The standalone transaction will have a different span ID, but the fix skips the check
+      await integration.captureStandaloneAppStart();
+
+      const actualEvent = client.event as TransactionEvent | undefined;
+      expect(actualEvent).toBeDefined();
+      expect(actualEvent?.spans).toBeDefined();
+      expect(actualEvent?.spans?.length).toBeGreaterThan(0);
+
+      // Verify that app start was attached successfully
+      const appStartSpan = actualEvent!.spans!.find(({ description }) => description === 'Cold Start');
+      expect(appStartSpan).toBeDefined();
+      expect(appStartSpan).toEqual(
+        expect.objectContaining<Partial<SpanJSON>>({
+          description: 'Cold Start',
+          op: APP_START_COLD_OP,
+        }),
+      );
+
+      // Verify the standalone transaction has a different span ID than the navigation transaction
+      // This confirms that the span ID check was skipped (otherwise app start wouldn't be attached)
+      expect(actualEvent?.contexts?.trace?.span_id).toBeDefined();
+      if (navigationSpanId) {
+        expect(actualEvent?.contexts?.trace?.span_id).not.toBe(navigationSpanId);
+      }
+
+      expect(actualEvent?.measurements?.[APP_START_COLD_MEASUREMENT]).toBeDefined();
+    });
   });
 
   describe('App Start Attached to the First Root Span', () => {

samples/expo/.eslintrc.js

@@ -0,0 +1,33 @@
+module.exports = {
+  root: true,
+  extends: ['expo', '@react-native'],
+  parser: '@typescript-eslint/parser',
+  plugins: ['@typescript-eslint'],
+  settings: {
+    'import/resolver': {
+      typescript: {
+        project: ['tsconfig.json'],
+      },
+      node: {
+        extensions: ['.js', '.jsx', '.ts', '.tsx'],
+      },
+    },
+  },
+  overrides: [
+    {
+      files: ['*.ts', '*.tsx'],
+      rules: {
+        '@typescript-eslint/no-shadow': ['error'],
+        'no-shadow': 'off',
+        'no-undef': 'off',
+        quotes: [2, 'single', { avoidEscape: true }],
+        // Disable deprecated rules removed in @typescript-eslint v8
+        '@typescript-eslint/func-call-spacing': 'off',
+        '@typescript-eslint/ban-types': 'off',
+        // Disable import/no-unresolved for workspace packages that may not be built yet
+        'import/no-unresolved': ['error', { ignore: ['^@sentry/'] }],
+      },
+    },
+  ],
+  ignorePatterns: ['/node_modules', '/ios', '/android', '/.expo'],
+};

samples/expo/.prettierignore

@@ -0,0 +1,6 @@
+node_modules/
+ios/
+android/
+.expo/
+*.md
+

samples/expo/.prettierrc.js

@@ -0,0 +1,7 @@
+module.exports = {
+  arrowParens: 'avoid',
+  bracketSameLine: true,
+  bracketSpacing: true,
+  singleQuote: true,
+  trailingComma: 'all',
+};

samples/expo/app.json

@@ -14,9 +14,7 @@
       "resizeMode": "contain",
       "backgroundColor": "#ffffff"
     },
-    "assetBundlePatterns": [
-      "**/*"
-    ],
+    "assetBundlePatterns": ["**/*"],
     "ios": {
       "supportsTablet": true,
       "bundleIdentifier": "io.sentry.expo.sample",
@@ -90,4 +88,4 @@
       "url": "https://u.expo.dev/00000000-0000-0000-0000-000000000000"
     }
   }
-}
+}

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

@@ -12,12 +12,40 @@ function TabBarIcon(props: {
   name: React.ComponentProps<typeof FontAwesome>['name'];
   color: string;
 }) {
+  // eslint-disable-next-line react-native/no-inline-styles
   return <FontAwesome size={28} style={{ marginBottom: -3 }} {...props} />;
 }
 
+function CodeIcon({ color }: { color: string }) {
+  return <TabBarIcon name="code" color={color} />;
+}
+
+function InfoButton({ colorScheme }: { colorScheme: 'light' | 'dark' | null }) {
+  return (
+    <Link href="/modal" asChild>
+      <Pressable>
+        {({ pressed }) => (
+          <FontAwesome
+            name="info-circle"
+            size={25}
+            color={Colors[colorScheme ?? 'light'].text}
+            // eslint-disable-next-line react-native/no-inline-styles
+            style={{ marginRight: 15, opacity: pressed ? 0.5 : 1 }}
+          />
+        )}
+      </Pressable>
+    </Link>
+  );
+}
+
 export default function TabLayout() {
   const colorScheme = useColorScheme();
 
+  const renderInfoButton = React.useCallback(
+    () => <InfoButton colorScheme={colorScheme} />,
+    [colorScheme],
+  );
+
   return (
     <Tabs
       screenOptions={{
@@ -30,28 +58,15 @@ export default function TabLayout() {
         name="index"
         options={{
           title: 'Tab One',
-          tabBarIcon: ({ color }) => <TabBarIcon name="code" color={color} />,
-          headerRight: () => (
-            <Link href="/modal" asChild>
-              <Pressable>
-                {({ pressed }) => (
-                  <FontAwesome
-                    name="info-circle"
-                    size={25}
-                    color={Colors[colorScheme ?? 'light'].text}
-                    style={{ marginRight: 15, opacity: pressed ? 0.5 : 1 }}
-                  />
-                )}
-              </Pressable>
-            </Link>
-          ),
+          tabBarIcon: CodeIcon,
+          headerRight: renderInfoButton,
         }}
       />
       <Tabs.Screen
         name="two"
         options={{
           title: 'Tab Two',
-          tabBarIcon: ({ color }) => <TabBarIcon name="code" color={color} />,
+          tabBarIcon: CodeIcon,
         }}
       />
     </Tabs>

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

@@ -79,7 +79,9 @@ export default function TabOneScreen() {
             title="Native Crash"
             onPress={() => {
               if (isRunningInExpoGo()) {
-                console.warn('Not supported in Expo Go. Build the application to test this feature.');
+                console.warn(
+                  'Not supported in Expo Go. Build the application to test this feature.',
+                );
                 return;
               }
               Sentry.nativeCrash();
@@ -138,7 +140,9 @@ export default function TabOneScreen() {
           <Button
             title="Send count metric with attributes"
             onPress={() => {
-              Sentry.metrics.count('count_metric', 1, { attributes: { from_test_app: true } });
+              Sentry.metrics.count('count_metric', 1, {
+                attributes: { from_test_app: true },
+              });
             }}
           />
         </View>
@@ -184,7 +188,9 @@ export default function TabOneScreen() {
                 string: 'string',
                 bigint: BigInt(123),
               });
-              Sentry.captureMessage('Message with different types of tags globally');
+              Sentry.captureMessage(
+                'Message with different types of tags globally',
+              );
               Sentry.setTags({
                 number: undefined,
                 boolean: undefined,
@@ -226,7 +232,11 @@ 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>