react-native-safe-area-context
react-native-safe-area-context copied to clipboard
Crash on Android 14 (S24 Ultra) when setting edges prop on RNCSafeAreaView
Description
I've encountered a crash in my React Native application on Android when trying to set the edges
prop on RNCSafeAreaView
. The application crashes with the following exception:
Exception com.facebook.react.bridge.JSApplicationIllegalArgumentException: Error while updating property 'edges' of a view managed by: RNCSafeAreaView ... Caused by java.lang.ClassCastException: com.facebook.react.bridge.ReadableNativeMap cannot be cast to com.facebook.react.bridge.ReadableArray
This issue seems to be related to how the edges
prop is handled in the native Android implementation of RNCSafeAreaView
.
Steps to Reproduce
- Use
SafeAreaView
with theedges
prop set to an array of strings, e.g.,edges={['top', 'left', 'right']}
. - Run the app on an Android device or emulator.
Expected Behavior
The SafeAreaView
should correctly apply the safe area insets according to the specified edges without causing a crash.
Actual Behavior
The application crashes on Android with a JSApplicationIllegalArgumentException
related to the edges
prop.
Environment
- React Native version: 0.73.4
- React Native Safe Area Context version: 4.9.0
- Device: S24 Ultra (I cannot reproduce in my device - S23 Ultra)
Code Snippet
Here are the snippets from my code where I use SafeAreaView
:
<SafeAreaView
edges={['top', 'left', 'right']}
style={{ flex: 1 }}
>
...
Additional Context
I've followed the documentation for react-native-safe-area-context and the usage of SafeAreaView seems to be correct according to the examples provided. This crash is blocking further development and testing on Android devices.
Any assistance or guidance on how to resolve this issue would be greatly appreciated.
Are you able to get a better stack trace?
Here is the complete stacktrace at google play, check if can help.
Exception com.facebook.react.bridge.JSApplicationIllegalArgumentException: Error while updating property 'edges' of a view managed by: RNCSafeAreaView
at com.facebook.react.uimanager.ViewManagersPropertyCache$PropSetter.updateViewProp (ViewManagersPropertyCache.java:101)
at com.facebook.react.uimanager.ViewManagerPropertyUpdater$FallbackViewManagerSetter.setProperty (ViewManagerPropertyUpdater.java:136)
at com.facebook.react.uimanager.ViewManagerPropertyUpdater.updateProps (ViewManagerPropertyUpdater.java:56)
at com.facebook.react.uimanager.ViewManager.updateProperties (ViewManager.java:79)
at com.facebook.react.uimanager.ViewManager.createViewInstance (ViewManager.java:181)
at com.facebook.react.uimanager.ViewManager.createView (ViewManager.java:108)
at com.facebook.react.uimanager.NativeViewHierarchyManager.createView (NativeViewHierarchyManager.java:281)
at com.facebook.react.uimanager.UIViewOperationQueue$CreateViewOperation.execute (UIViewOperationQueue.java:194)
at com.facebook.react.uimanager.UIViewOperationQueue$1.run (UIViewOperationQueue.java:920)
at com.facebook.react.uimanager.UIViewOperationQueue.flushPendingBatches (UIViewOperationQueue.java:1037)
at com.facebook.react.uimanager.UIViewOperationQueue.-$$Nest$mflushPendingBatches
at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded (UIViewOperationQueue.java:1097)
at com.facebook.react.uimanager.GuardedFrameCallback.doFrame (GuardedFrameCallback.java:29)
at com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame (ReactChoreographer.java:175)
at com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame (ChoreographerCompat.java:85)
at android.view.Choreographer$CallbackRecord.run (Choreographer.java:1687)
at android.view.Choreographer$CallbackRecord.run (Choreographer.java:1698)
at android.view.Choreographer.doCallbacks (Choreographer.java:1153)
at android.view.Choreographer.doFrame (Choreographer.java:1069)
at android.view.Choreographer$FrameDisplayEventReceiver.run (Choreographer.java:1646)
at android.os.Handler.handleCallback (Handler.java:958)
at android.os.Handler.dispatchMessage (Handler.java:99)
at android.os.Looper.loopOnce (Looper.java:230)
at android.os.Looper.loop (Looper.java:319)
at android.app.ActivityThread.main (ActivityThread.java:8918)
at java.lang.reflect.Method.invoke
at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run (RuntimeInit.java:608)
at com.android.internal.os.ZygoteInit.main (ZygoteInit.java:1103)
Caused by java.lang.ClassCastException: com.facebook.react.bridge.ReadableNativeMap cannot be cast to com.facebook.react.bridge.ReadableArray
at com.facebook.react.uimanager.ViewManagersPropertyCache$ArrayPropSetter.getValueOrDefault (ViewManagersPropertyCache.java:267)
at com.facebook.react.uimanager.ViewManagersPropertyCache$PropSetter.updateViewProp (ViewManagersPropertyCache.java:86)
Are you able to reproduce it on a device?
No, because I don't have the s24 ultra, what I'm managing to get is a problem from a customer in production who is helping us with some tests.
I’ll leave this issue open - with the caveat it’s unlikely to get taken on by any current maintainers. If you find more information - or better, a fix - let us know!