React Compiler rewrites Sentry component annotations to _temp names when annotateReactComponents is enabled

[loiclouvet]

What React Native libraries do you use?

Expo (mobile only)

Are you using sentry.io or on-premise?

sentry.io (SaS)

@sentry/react-native SDK Version

7.2.0

How does your development environment look like?

⬇  Place the `npx react-native@latest info` output here. ⬇
Fetching system and libraries information...
System:
  OS: macOS 15.7.3
  CPU: (8) arm64 Apple M1
  Memory: 259.31 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 20.19.6
    path: ~/.nvm/versions/node/v20.19.6/bin/node
  Yarn:
    version: 1.22.22
    path: /opt/homebrew/bin/yarn
  npm:
    version: 10.8.2
    path: ~/.nvm/versions/node/v20.19.6/bin/npm
  Watchman:
    version: 2025.03.10.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.16.2
    path: /opt/homebrew/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.4
      - iOS 18.4
      - macOS 15.4
      - tvOS 18.4
      - visionOS 2.4
      - watchOS 11.4
  Android SDK:
    API Levels:
      - "23"
      - "25"
      - "27"
      - "28"
      - "29"
      - "30"
      - "31"
      - "32"
      - "33"
      - "34"
      - "35"
      - "36"
    Build Tools:
      - 30.0.3
      - 33.0.0
      - 33.0.1
      - 34.0.0
      - 35.0.0
      - 36.0.0
    System Images:
      - android-30 | Google APIs ARM 64 v8a
      - android-34 | Google APIs ARM 64 v8a
    Android NDK: Not Found
IDEs:
  Android Studio: 2023.1 AI-231.9392.1.2311.11076708
  Xcode:
    version: 16.3/16E140
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.9
    path: /usr/bin/javac
  Ruby:
    version: 3.4.2
    path: /Users/loiclouvet/.rbenv/shims/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 19.1.1
    wanted: 19.1.1
  react:
    installed: 19.1.0
    wanted: 19.1.0
  react-native:
    installed: 0.81.5
    wanted: 0.81.5
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: true
  newArchEnabled: true

Sentry.init()

Sentry.init({
  dsn: 'https://...@sentry.io/...'
  // other options
});

const config = getSentryExpoConfig(__dirname, {
  annotateReactComponents: true,
})

Steps to Reproduce

1. Enable react-compiler
2. Build app locally using npx expo start
3. Check to see if the JS bundle generated by Metro has annotations by text searching for the data-sentry-component key in the bundle.

Expected Result

Having data-sentry-component with component names as values.

Actual Result

data-sentry-component="_temp"

[linear]

RN-507

[lucas-zimerman]

Hi and thank you for opening this issue!
Are you using babel? if so is react compiler running after Sentry?

If possible, could you share your babel.config.js?