User feedback "Failed to read image data from uri:" error

[rodolfoBee]

What React Native libraries do you use?

Expo Application Services (EAS)

Are you using sentry.io or on-premise?

sentry.io (SaS)

@sentry/react-native SDK Version

6.14.0

How does your development environment look like?

⬇  Place the `npx react-native@latest info` output here. ⬇ 
System:
  OS: macOS 15.4.1
  CPU: (11) arm64 Apple M3 Pro
  Memory: 1.09 GB / 36.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 22.11.0
    path: /usr/local/bin/node
  Yarn:
    version: 1.22.22
    path: /usr/local/bin/yarn
  npm:
    version: 10.9.0
    path: /usr/local/bin/npm
  Watchman: Not Found
Managers:
  CocoaPods:
    version: 1.16.2
    path: /opt/homebrew/opt/ruby/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: Not Found
IDEs:
  Android Studio: 2024.2 AI-242.23339.11.2421.12550806
  Xcode:
    version: 16.3/16E140
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 21.0.6
    path: /usr/bin/javac
  Ruby:
    version: 3.4.2
    path: /opt/homebrew/opt/ruby/bin/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 18.0.0
    wanted: ^18.0.0
  react:
    installed: 19.0.0
    wanted: 19.0.0
  react-native:
    installed: 0.79.2
    wanted: 0.79.2
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: Not found
  newArchEnabled: Not found
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not found

Sentry.init()

  "@sentry/react-native": "^6.14.0",
   "expo-image-picker": "^16.1.4",

import * as ImagePicker from "expo-image-picker";
import * as Sentry from '@sentry/react-native';

Sentry.init({
  dsn: DSN,

  sendDefaultPii: true,
  enableNative: true,
  
  debug:true,
  integrations: [
    Sentry.mobileReplayIntegration(),
    Sentry.feedbackIntegration({
        enableScreenshot: true,
        enableTakeScreenshot: true,
        imagePicker: ImagePicker,
    })
    ],
});

Steps to Reproduce

1. Add the feedback integration with imagePicker as in the init above
2. Run the app
3. Try to add screenshot to userfeedback widget.

Expected Result

The screenshot is added to the feedback.

Actual Result

Screenshot is not added with error:

 ERROR  Sentry Logger [error]: Failed to read image data from uri: file:///Users/[REDACTED]/Library/Developer/CoreSimulator/Devices/AC43B572-024F-45C0-9594-070A19FE1660/data/Containers/Data/Application/04E98D9E-79CC-4152-B0D8-9CFD58F31C42/Library/Caches/ExponentExperienceData/@anonymous/leapp-42f6bc6a-bd50-40ac-b472-486d66f6418a/ImagePicker/25CF38E2-975C-46B6-B1BF-EC88D89DB287.jpg

Error happens when testing the app on android and ios simulators. Seems like an issue with the simulators accessing data in the device. Screenshot from error on android emulator:

No errros when testing on web browser. Production environment is not set to confirm it happens on production build on real device.

[krystofwoldrich]

Thank you for the message, we'll investigate it.

[antonis]

Thank you for reporting @rodolfoBee 🙇

I was able to reproduce the issue on a fresh app with Expo Go.

npx create-expo-app@latest
npx @sentry/wizard@latest -i reactNative
npx expo install expo-image-picker

Added a button in the UI to show the widget

import * as Sentry from '@sentry/react-native';

<Button title='Feedback' onPress={ () => { Sentry.showFeedbackWidget() }}/>

Running the app at this point gives the reported error since the implementation depends on native features not available in the Expo Go sandbox.

The issue should be fixed by pre-building the app which installs any native dependencies.

npx expo prebuild

Screenshots

Error	After prebuild

Let us know if that helped with the issue 🙏

[krystofwoldrich]

If there are blockers due to which the adding of the image can't work in Expo Go, let's add an alert or console log with the information that this needs to run in the native application build.