Android app crash when navigate back if i use FlashList: Unhandled SoftException com.facebook.react.bridge.AssertionException: Expected to run on UI thread!

[duongnguyen17]

Description

My Android app crash when i navigate back from a screen use flash list. Android studio log error: Unhandled SoftException com.facebook.react.bridge.AssertionException: Expected to run on UI thread! at com.facebook.react.bridge.SoftAssertions.assertCondition(SoftAssertions.kt:37) at com.facebook.react.bridge.UiThreadUtil.assertOnUiThread(UiThreadUtil.java:46) at com.facebook.react.views.view.ReactViewGroup.handleAddView(ReactViewGroup.java:570) at com.facebook.react.views.view.ReactViewGroup.addView(ReactViewGroup.java:607) at android.view.ViewGroup.addView(ViewGroup.java:5025) at android.view.ViewGroup.addView(ViewGroup.java:4997) at com.swmansion.rnscreens.Screen.startTransitionRecursive(Screen.kt:412) at com.swmansion.rnscreens.Screen.startTransitionRecursive(Screen.kt:415) at com.swmansion.rnscreens.Screen.startTransitionRecursive(Screen.kt:415) at com.swmansion.rnscreens.Screen.startTransitionRecursive(Screen.kt:415) at com.swmansion.rnscreens.Screen.startTransitionRecursive(Screen.kt:415) at com.swmansion.rnscreens.Screen.startTransitionRecursive(Screen.kt:415) at com.swmansion.rnscreens.Screen.startTransitionRecursive(Screen.kt:415) at com.swmansion.rnscreens.Screen.startTransitionRecursive(Screen.kt:415) at com.swmansion.rnscreens.Screen.startTransitionRecursive(Screen.kt:415) at com.swmansion.rnscreens.Screen.startTransitionRecursive(Screen.kt:415) at com.swmansion.rnscreens.Screen.startTransitionRecursive(Screen.kt:415) at com.swmansion.rnscreens.Screen.startRemovalTransition(Screen.kt:380) at com.swmansion.rnscreens.NativeProxy.notifyScreenRemoved(NativeProxy.kt:48) at com.facebook.jni.NativeRunnable.run(Native Method) at android.os.Handler.handleCallback(Handler.java:959) at android.os.Handler.dispatchMessage(Handler.java:100) at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(MessageQueueThreadHandler.java:27) at android.os.Looper.loopOnce(Looper.java:232) at android.os.Looper.loop(Looper.java:317) at com.facebook.react.bridge.queue.MessageQueueThreadImpl.lambda$startNewBackgroundThread$2(MessageQueueThreadImpl.java:217) at com.facebook.react.bridge.queue.MessageQueueThreadImpl$$ExternalSyntheticLambda1.run(D8$$SyntheticClass:0) at java.lang.Thread.run(Thread.java:1012)

flashlist.webm

Steps to reproduce

1. Press "Go to Details" button
2. At Detail screen, navigate back

Snack or a link to a repository

https://github.com/duongnguyen17/pager-vew-demo

Screens version

4.2.0

React Native version

0.76.2

Platforms

Android

JavaScript runtime

Hermes

Workflow

None

Architecture

Fabric (New Architecture)

Build type

Debug mode

Device

Android emulator

Device model

No response

Acknowledgements

Yes

[kkafar]

Is that a crash or only soft exception is logged?

[shankarRxo]

Facing same issue Unhandled SoftException com.facebook.react.bridge.AssertionException: Expected to run on UI thread!

[duongnguyen17]

Is that a crash or only soft exception is logged? That is a crash

[kkafar]

Okay, I've opened the fix in #2532 - if anyone would confirm that it fixes the issue I would be grateful

[kkafar]

Once I get confirmation I'll be able to release this

[shankarRxo]

Okay, I've opened the fix in #2532 - if anyone would confirm that it fixes the issue I would be grateful

Facing another issue

[kkafar]

@shankarRxo namely? :D

[DrZoidberg09]

Almost the same happens on iOS. It does not completely crash, but the FlashList screen is distorted and you cannot press anything anymore.

See here:

https://github.com/callstack/react-native-pager-view/issues/917

Not sure if it comes from pager view, screens or both.

[akylbek-hostaways]

@kkafar I also have similar issue, but I'm using FlatList. Stack trace from sentry:

android.widget.AdapterView in addView at line 489
com.swmansion.rnscreens.Screen in l at line 87
com.swmansion.rnscreens.Screen in l at line 95
11
com.swmansion.rnscreens.Screen in k at line 8
com.swmansion.rnscreens.ScreenStackViewManager in prepareOutTransition at line 3
com.swmansion.rnscreens.ScreenStackViewManager in removeViewAt at line 4
com.swmansion.rnscreens.ScreenStackViewManager in removeViewAt at line 2
com.facebook.react.uimanager.NativeViewHierarchyManager in manageChildren at line 149
com.swmansion.reanimated.layoutReanimation.ReanimatedNativeHierarchyManager in manageChildren at line 8
com.facebook.react.uimanager.UIViewOperationQueue$ManageChildrenOperation in execute at line 15
com.facebook.react.uimanager.UIViewOperationQueue$1 in run at line 145
com.facebook.react.uimanager.UIViewOperationQueue in flushPendingBatches at line 54
com.facebook.react.uimanager.UIViewOperationQueue in w at line 1
com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback in doFrameGuarded at line 32
com.facebook.react.uimanager.GuardedFrameCallback in doFrame at line 1
com.facebook.react.modules.core.ReactChoreographer$1 in doFrame at line 47
android.view.Choreographer$CallbackRecord in run at line 1404
android.view.Choreographer$CallbackRecord in run at line 1415
android.view.Choreographer in doCallbacks at line 1015
android.view.Choreographer in doFrame at line 941
android.view.Choreographer$FrameDisplayEventReceiver in run at line 1389
android.os.Handler in handleCallback at line 959
android.os.Handler in dispatchMessage at line 100
android.os.Looper in loopOnce at line 232
android.os.Looper in loop at line 317
android.app.ActivityThread in main at line 8592
java.lang.reflect.Method in invoke
com.android.internal.os.RuntimeInit$MethodAndArgsCaller in run at line 580
com.android.internal.os.ZygoteInit in main at line 878

"react-native-screens": "^4.2.0", "react-native": "^0.75.4", newArchEnabled=false

[duongnguyen17]

Okay, I've opened the fix in #2532 - if anyone would confirm that it fixes the issue I would be grateful

The issue has been fixed but i got an other issue make my android app crash:

FATAL EXCEPTION: main Process: com.awesomeproject, PID: 10025 java.lang.IllegalStateException: CellRendererComponent outer view should always be CellContainer. Learn more here: https://shopify.github.io/flash-list/docs/usage#cellrenderercomponent. at com.shopify.reactnative.flash_list.AutoLayoutView.fixLayout(AutoLayoutView.kt:66) at com.shopify.reactnative.flash_list.AutoLayoutView.dispatchDraw(AutoLayoutView.kt:32) at android.view.View.updateDisplayListIfDirty(View.java:23683) at android.view.View.draw(View.java:24573) at android.view.ViewGroup.drawChild(ViewGroup.java:4537) at com.facebook.react.views.view.ReactViewGroup.drawChild(ReactViewGroup.java:1029) at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4298) at com.facebook.react.views.view.ReactViewGroup.dispatchDraw(ReactViewGroup.java:980) at android.view.View.updateDisplayListIfDirty(View.java:23683) at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4521) at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4494) at android.view.View.updateDisplayListIfDirty(View.java:23646) at android.view.View.draw(View.java:24573) at android.view.ViewGroup.drawChild(ViewGroup.java:4537) at com.facebook.react.views.view.ReactViewGroup.drawChild(ReactViewGroup.java:1029) at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4298) at com.facebook.react.views.view.ReactViewGroup.dispatchDraw(ReactViewGroup.java:980) at android.view.View.updateDisplayListIfDirty(View.java:23683) at android.view.View.draw(View.java:24573) at android.view.ViewGroup.drawChild(ViewGroup.java:4537) at com.facebook.react.views.view.ReactViewGroup.drawChild(ReactViewGroup.java:1029) at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4298) at com.facebook.react.views.view.ReactViewGroup.dispatchDraw(ReactViewGroup.java:980) at android.view.View.draw(View.java:24845) at com.facebook.react.views.view.ReactViewGroup.draw(ReactViewGroup.java:970) at android.view.View.updateDisplayListIfDirty(View.java:23692) at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4521) at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4494) at android.view.View.updateDisplayListIfDirty(View.java:23646) at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4521) at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4494) at android.view.View.updateDisplayListIfDirty(View.java:23646) at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4521) at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4494) at android.view.View.updateDisplayListIfDirty(View.java:23646) at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4521) at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4494) at android.view.View.updateDisplayListIfDirty(View.java:23646) at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4521) at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4494) at android.view.View.updateDisplayListIfDirty(View.java:23646) at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4521) at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4494) at android.view.View.updateDisplayListIfDirty(View.java:23646) at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4521) at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4494) at android.view.View.updateDisplayListIfDirty(View.java:23646) at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4521) at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4494) at android.view.View.updateDisplayListIfDirty(View.java:23646) at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4521) at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4494) at android.view.View.updateDisplayListIfDirty(View.java:23646) at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4521)

Should I report this bug to FlashList?

[akylbek-hostaways]

@kkafar I also have similar issue, but I'm using FlatList. Stack trace from sentry:

android.widget.AdapterView in addView at line 489
com.swmansion.rnscreens.Screen in l at line 87
com.swmansion.rnscreens.Screen in l at line 95
11
com.swmansion.rnscreens.Screen in k at line 8
com.swmansion.rnscreens.ScreenStackViewManager in prepareOutTransition at line 3
com.swmansion.rnscreens.ScreenStackViewManager in removeViewAt at line 4
com.swmansion.rnscreens.ScreenStackViewManager in removeViewAt at line 2
com.facebook.react.uimanager.NativeViewHierarchyManager in manageChildren at line 149
com.swmansion.reanimated.layoutReanimation.ReanimatedNativeHierarchyManager in manageChildren at line 8
com.facebook.react.uimanager.UIViewOperationQueue$ManageChildrenOperation in execute at line 15
com.facebook.react.uimanager.UIViewOperationQueue$1 in run at line 145
com.facebook.react.uimanager.UIViewOperationQueue in flushPendingBatches at line 54
com.facebook.react.uimanager.UIViewOperationQueue in w at line 1
com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback in doFrameGuarded at line 32
com.facebook.react.uimanager.GuardedFrameCallback in doFrame at line 1
com.facebook.react.modules.core.ReactChoreographer$1 in doFrame at line 47
android.view.Choreographer$CallbackRecord in run at line 1404
android.view.Choreographer$CallbackRecord in run at line 1415
android.view.Choreographer in doCallbacks at line 1015
android.view.Choreographer in doFrame at line 941
android.view.Choreographer$FrameDisplayEventReceiver in run at line 1389
android.os.Handler in handleCallback at line 959
android.os.Handler in dispatchMessage at line 100
android.os.Looper in loopOnce at line 232
android.os.Looper in loop at line 317
android.app.ActivityThread in main at line 8592
java.lang.reflect.Method in invoke
com.android.internal.os.RuntimeInit$MethodAndArgsCaller in run at line 580
com.android.internal.os.ZygoteInit in main at line 878

"react-native-screens": "^4.2.0", "react-native": "^0.75.4", newArchEnabled=false

Update: I tried to using FlashList, and I don't have this issue with your fix

[kkafar]

@duongnguyen17 This might be still related to react-native-screens, namely it might be caused by the workaround. But I won't be able to fix this here, we need the changes to land in react-native core.

The best thing I can suggest for you right now is to build react native from source and apply this patch: https://github.com/facebook/react-native/pull/47634 and comment out this code in react-native-screens: https://github.com/software-mansion/react-native-screens/blob/6aaf56b1e17d8062c1f2ad79522225a2429c8d50/android/src/main/java/com/swmansion/rnscreens/Screen.kt#L413-L429 :/

[akylbek-hostaways]

@kkafar Could my problem with FlatList be related to react-native bug?

[duongnguyen17]

@duongnguyen17 This might be still related to react-native-screens, namely it might be caused by the workaround. But I won't be able to fix this here, we need the changes to land in react-native core.

The best thing I can suggest for you right now is to build react native from source and apply this patch: facebook/react-native#47634 and comment out this code in react-native-screens:

https://github.com/software-mansion/react-native-screens/blob/6aaf56b1e17d8062c1f2ad79522225a2429c8d50/android/src/main/java/com/swmansion/rnscreens/Screen.kt#L413-L429

:/

@kkafar Thank you very much for your help 😁 it work!

[kkafar]

@akylbek-hostaways I believe this is the same case. Your code crashes because of our workaround in react-native-screens. We have to add this workaround, because there is other inherent issue in react-native - it does not handle cases where some views might be a part of Android Transition. We're working on it currently, but it might take even few weeks.

The best way to go @akylbek-hostaways right now is with my suggestion above ([link])(https://github.com/software-mansion/react-native-screens/issues/2530#issuecomment-2491547117)

[kkafar]

@duongnguyen17 glad to hear that. We'll try to sort these things up, so that patches are not required to make things work

[duongnguyen17]

@kkafar but if i comment the code you mentioned, i can't fix the issue with the react-native-pager-view so i think i will wait for the next version. hihi 😁

[duongnguyen17]

@kkafar you are my hope 😇

[shankarRxo]

@shankarRxo namely? :D

java.lang.IllegalStateException: CellRendererComponent outer view should always be CellContainer. Learn more here: https://shopify.github.io/flash-list/docs/usage#cellrenderercomponent.

related to flashList