Nativescript: Changing font-size / display-size in combination with BottomNavigation causes crash

[oslc15]

Environment
Provide version numbers for the following components (information can be retrieved by running tns info in your project folder or by inspecting the package.json of the project):

• CLI: 6.2.0
• Cross-platform modules:
  
  
  
  • tns-android: 6.2.0
  
  
• Android Runtime:
  
  
  
  • Devices with Android 8, 9, and 10.
  
  

Describe the bug

Changing accessibility font-size within the context of a BottomNavigation causes a runtime error.

System.err: An uncaught Exception occurred on "main" thread.
System.err: Calling js method onStart failed
System.err: Error: java.lang.IllegalArgumentException: No view found for id 0x2 (unknown) for fragment FragmentBase_vendor_15352_26_TabFragmentImplementation{54a9e51 #1 id=0x2 android:bottomnavigation:2:1}
System.err: 
System.err: StackTrace:
System.err: BottomNavigation.commitCurrentTransaction(file:///node_modules/@nativescript/core/ui/bottom-navigation/bottom-navigation.js:347:37)
System.err:     at BottomNavigation.changeTab(file:///node_modules/@nativescript/core/ui/bottom-navigation/bottom-navigation.js:361:13)
System.err:     at BottomNavigation.onLoaded(file:///node_modules/@nativescript/core/ui/bottom-navigation/bottom-navigation.js:289:13)
System.err:     at (file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:312:89)
System.err:     at ViewBase.callFunctionWithSuper(file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:305:8)
System.err:     at ViewBase.callLoaded(file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:312:13)
System.err:     at ViewBase.loadView(file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:440:17)
System.err:     at (file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:234:18)
System.err:     at ContentView.eachChildView(file:///node_modules/@nativescript/core/ui/content-view/content-view.js:70:12)
System.err:     at PageBase.eachChildView(file:///node_modules/@nativescript/core/ui/page/page-common.js:126:39)
System.err:     at ViewCommon.eachChild(file:///node_modules/@nativescript/core/ui/core/view/view-common.js:1010:13)
System.err:     at ViewBase.onLoaded(file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:233:13)
System.err:     at View.onLoaded(file:///node_modules/@nativescript/core/ui/core/view/view.js:247:34)
System.err:     at Page.onLoaded(file:///node_modules/@nativescript/core/ui/page/page.js:43:34)
System.err:     at (file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:312:89)
System.err:     at ViewBase.callFunctionWithSuper(file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:305:8)
System.err:     at ViewBase.callLoaded(file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:312:13)
System.err:     at ViewBase.loadView(file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:440:17)
System.err:     at (file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:234:18)
System.err:     at FrameBase.eachChildView(file:///node_modules/@nativescript/core/ui/frame/frame-common.js:422:12)
System.err:     at ViewCommon.eachChild(file:///node_modules/@nativescript/core/ui/core/view/view-common.js:1010:13)
System.err:     at ViewBase.onLoaded(file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:233:13)
System.err:     at View.onLoaded(file:///node_modules/@nativescript/core/ui/core/view/view.js:247:34)
System.err:     at FrameBase.onLoaded(file:///node_modules/@nativescript/core/ui/frame/frame-common.js:87:34)
System.err:     at (file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:312:89)
System.err:     at ViewBase.callFunctionWithSuper(file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:305:8)
System.err:     at ViewBase.callLoaded(file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:312:13)
System.err:     at ActivityCallbacksImplementation.onStart(file:///node_modules/@nativescript/core/ui/frame/frame.js:872:21)
System.err:     at NativeScriptActivity.onStart(file:///node_modules/@nativescript/core/ui/frame/activity.js:29:24)
System.err:     at com.tns.Runtime.callJSMethodNative(Native Method)
System.err:     at com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1286)
System.err:     at com.tns.Runtime.callJSMethodImpl(Runtime.java:1173)
System.err:     at com.tns.Runtime.callJSMethod(Runtime.java:1160)
System.err:     at com.tns.Runtime.callJSMethod(Runtime.java:1138)
System.err:     at com.tns.Runtime.callJSMethod(Runtime.java:1134)
System.err:     at com.tns.NativeScriptActivity.onStart(NativeScriptActivity.java:29)
System.err:     at android.app.Instrumentation.callActivityOnStart(Instrumentation.java:1514)
System.err:     at android.app.Activity.performStart(Activity.java:7838)
System.err:     at android.app.ActivityThread.handleStartActivity(ActivityThread.java:3398)
System.err:     at android.app.servertransaction.TransactionExecutor.performLifecycleSequence(TransactionExecutor.java:221)
System.err:     at android.app.servertransaction.TransactionExecutor.cycleToPath(TransactionExecutor.java:201)
System.err:     at android.app.servertransaction.TransactionExecutor.executeLifecycleState(TransactionExecutor.java:173)
System.err:     at android.app.servertransaction.TransactionExecutor.execute(TransactionExecutor.java:97)
System.err:     at android.app.ActivityThread$H.handleMessage(ActivityThread.java:2109)
System.err:     at android.os.Handler.dispatchMessage(Handler.java:107)
System.err:     at android.os.Looper.loop(Looper.java:214)
System.err:     at android.app.ActivityThread.main(ActivityThread.java:7682)
System.err:     at java.lang.reflect.Method.invoke(Native Method)
System.err:     at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:516)
System.err:     at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:950)
System.err: Caused by: java.lang.IllegalArgumentException: No view found for id 0x2 (unknown) for fragment FragmentBase_vendor_15352_26_TabFragmentImplementation{54a9e51 #1 id=0x2 android:bottomnavigation:2:1}
System.err:     at androidx.fragment.app.FragmentManagerImpl.moveToState(FragmentManager.java:1454)
System.err:     at androidx.fragment.app.FragmentManagerImpl.moveFragmentToExpectedState(FragmentManager.java:1784)
System.err:     at androidx.fragment.app.FragmentManagerImpl.moveToState(FragmentManager.java:1852)
System.err:     at androidx.fragment.app.BackStackRecord.executeOps(BackStackRecord.java:802)
System.err:     at androidx.fragment.app.FragmentManagerImpl.executeOps(FragmentManager.java:2625)
System.err:     at androidx.fragment.app.FragmentManagerImpl.executeOpsTogether(FragmentManager.java:2411)
System.err:     at androidx.fragment.app.FragmentManagerImpl.removeRedundantOperationsAndExecute(FragmentManager.java:2366)
System.err:     at androidx.fragment.app.FragmentManagerImpl.execSingleAction(FragmentManager.java:2243)
System.err:     at androidx.fragment.app.BackStackRecord.commitNowAllowingStateLoss(BackStackRecord.java:654)
System.err:     ... 21 more

To Reproduce

1. Download the sample-project zip.
2. Unzip and install dependencies
3. run: tns debug android
4. Tap press "tap to login" and get navigated to the actual tab-navigation.
5. Switch to any tab
6. Change font-size either from Settings or use adb command: adb shell settings put system font_scale 1.5
7. Go to desktop or another app and return
8. Observe crash

Expected behavior
Application should resize the text and not crash afterwards.

Sample project

my-app-name.zip

Additional context

The bug was first issued to @nota/nativescript-accessibility-ext plugin but the author @m-abs of the plugin found logs pointing towards NativeScript upstream
https://github.com/Notalib/nativescript-accessibility-ext/issues/40

[tsonevn]

Hi @oslc15,
I tested the provided project while following the described steps, but I was unable to recreate the crash. I checked the app on a Samsung device with Android 9 and NExus 5x with Android 8.1. On that matter, I noticed that you are using an old Android runtime version. Can you try updating it to the latest version (v 6.2) while following the steps below:

1. tns platform remove android
2. tns platform add [email protected]
   Then check if the problem still persists.

[oslc15]

@tsonevn My bad. i was using the [email protected] when recreating the issue, just a typing error in my description. The example project has the correct platform aswell.

Let me get back to you after testing with other devices. Thanks!

[m-abs]

@tsonevn
You might need to leave the app and return to it a couple of times before the crash is triggered.
For me it usually happens on the second return.

I've been able to reproduce it on two different OnePlus 7T Pro (one McLaren and one normal) running Android 10 (OxygenOS).

I couldn't reproduce it on an Android emulator running Android 9.0.

[m-abs]

I couldn't reproduce it in an Android 10 emulator either.

[m-abs]

I've more information.

You don't need to change the font-size to trigger this crash.

I can do it on my Oneplus 7T Pro McL every time while in debug mode.

1. I run the example app with: tns debug android
2. Tap to Login
3. Select the second tap.
4. Switch to another app or the home screen.
5. Switch back
6. Instant crash.

I tried adding a few debug statements to bottom-navigation.android.js.
The crash happens because return to the app triggers onLoaded() which calls changeTab(index) and finally calls commitCurrentTransaction().

Just after leaving onUnloaded() was called.

I haven't been able to get any further, I don't fully understand view livecycles on Android.

[m-abs]

Sorry to nag, but it even happens with the example from this NativeScript blog post: https://www.nativescript.org/blog/tabs-and-bottomnavigation-nativescripts-two-new-components

[m-abs]

I think, I've found the cause of the problem.

Be enabling tracing, we could see a curious difference between the Android 8 device and the Android 10 device.

On the Android 8 device we could see a Fade@adsad starting and ending when the app was suspended, but on the Android 10 device we could only see a Fade@csdwe starting but not ending.

When the app is suspended, Frame calls disposeCurrentFragment() that does this:

1. starts transaction
2. removes the fragment from the transaction.
3. transaction.commitNowAllowingStateLoss()

If I change that to:

1. starts transaction
2. transaction.commitNowAllowingStateLoss()
3. removes the fragment from the transaction.

The crash doesn't happen anymore.

I've created a PR switching the two lines of code that fixed the problem for me.

[vakrilov]

Hey @m-abs
I we have been investigating a related crash (reported in #8037). There is a PR in place that might fix this issue as well -> #8165. Are you willing to give it a try?

[m-abs]

Hey @vakrilov,

I assume you meant #8166 ;)

I've just tested it on the example project and it still crashed on my Oneplus 7T pro.

It doesn't if I flip these two lines in the disposeCurrentFragment()-function:

From:

         transaction.remove(fragment);
         transaction.commitNowAllowingStateLoss();

To:

         transaction.commitNowAllowingStateLoss();
         transaction.remove(fragment);

[vakrilov]

Hey @m-abs
Calling remove() after the committing the transaction is the same as not calling it at all, as the remove operation will never be committed.

[m-abs]

@vakrilov
I see that might explain, why it didn't crash. The transaction didn't do anything.

If I remove the call to disposeCurrentFragment() from onUnloaded() the crash also goes away.

https://github.com/NativeScript/NativeScript/blob/master/nativescript-core/ui/frame/frame.android.ts#L252-L259

[m-abs]

If I remove the call to disposeCurrentFragment() from onUnloaded() the crash also goes away.

This turned out to be a bad idea. It caused tab content to be half transparent when switching between the tabs.

[m-abs]

The crash is consistent on my Oneplus 7T pro with Android 10, but not on my emulator with Android 10.

I've noticed an interesting difference between the two.

Log from the emulator:
android-10-emulator.log

Log from the Oneplus 7T pro device:
android-10-device.log

On the emulator just after leaving the app end it is suspended, a transition is started (logged from: TransitionListenerImpl.onTransitionStart()) and ended (logged from: TransitionListenerImpl.onTransitionEnd()) immediately after being started.

But on the device, the transition is started, but not ended.

I suspect this has something to do with the app crashing on resume, but I don't understand why the transition doesn't end.

[NickSch1]

I'm experiencing crashes with the same stacktrace.
The crashes happen immediately when the app gets suspended. We're using the BottomNavigation component in a NativeScript Angular project.
They happen on my Android 10 Emulator but also on my Samsung S8 with Android 9.

When I find some time I'll try to look into it aswell but my experience with native android development is pretty limited.

Versions:

• CLI: 6.2.2
• tns-core-modules: 6.2.1
• tns-android: 6.2.1
• nativescript-angular: 8.20.0
• Android SDK API: 28 & 29 (tried building with both)

System.err: An uncaught Exception occurred on "main" thread.
System.err: Calling js method onViewAttachedToWindow failed
System.err: Error: java.lang.IllegalArgumentException: No view found for id 0x2 (unknown) for fragment FragmentBase_vendor_106278_32_TabFragmentImplementation{e45ff (7463a07d-55bf-4a7f-9922-2b6bac688c00) id=0x2 android:bottomnavigation:2:0}
System.err:
System.err: StackTrace:
System.err: push.../node_modules/@nativescript/core/ui/bottom-navigation/bottom-navigation.js.BottomNavigation.commitCurrentTransaction(file:///node_modules/@nativescript/core/ui/bottom-navigation/bottom-navigation.js:347:0)
System.err:     at push.../node_modules/@nativescript/core/ui/bottom-navigation/bottom-navigation.js.BottomNavigation.changeTab(file:///node_modules/@nativescript/core/ui/bottom-navigation/bottom-navigation.js:361:0)
System.err:     at push.../node_modules/@nativescript/core/ui/bottom-navigation/bottom-navigation.js.BottomNavigation._onAttachedToWindow(file:///node_modules/@nativescript/core/ui/bottom-navigation/bottom-navigation.js:297:0)
System.err:     at AttachListener.onViewAttachedToWindow(file:///node_modules/@nativescript/core/ui/bottom-navigation/bottom-navigation.js:143:0)
System.err:     at com.tns.Runtime.callJSMethodNative(Native Method)
System.err:     at com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1286)
System.err:     at com.tns.Runtime.callJSMethodImpl(Runtime.java:1173)
System.err:     at com.tns.Runtime.callJSMethod(Runtime.java:1160)
System.err:     at com.tns.Runtime.callJSMethod(Runtime.java:1138)
System.err:     at com.tns.Runtime.callJSMethod(Runtime.java:1134)
System.err:     at com.tns.gen.java.lang.Object_vendor_106371_32_AttachListener.onViewAttachedToWindow(Object_vendor_106371_32_AttachListener.java:18)
System.err:     at android.view.View.dispatchAttachedToWindow(View.java:19564)
System.err:     at android.view.ViewGroup.dispatchAttachedToWindow(ViewGroup.java:3430)
System.err:     at android.view.ViewGroup.dispatchAttachedToWindow(ViewGroup.java:3437)
System.err:     at android.view.ViewGroup.dispatchAttachedToWindow(ViewGroup.java:3437)
System.err:     at android.view.ViewGroup.addViewInner(ViewGroup.java:5149)
System.err:     at android.view.ViewGroup.addView(ViewGroup.java:4935)
System.err:     at android.view.ViewGroup.addView(ViewGroup.java:4875)
System.err:     at android.view.ViewGroup.addView(ViewGroup.java:4848)
System.err:     at android.view.ViewOverlay$OverlayViewGroup.add(ViewOverlay.java:208)
System.err:     at android.view.ViewGroupOverlay.add(ViewGroupOverlay.java:72)
System.err:     at androidx.transition.ViewGroupOverlayApi18.add(ViewGroupOverlayApi18.java:53)
System.err:     at androidx.transition.Visibility.onDisappear(Visibility.java:407)
System.err:     at androidx.transition.Visibility.createAnimator(Visibility.java:255)
System.err:     at androidx.transition.Transition.createAnimators(Transition.java:744)
System.err:     at androidx.transition.TransitionSet.createAnimators(TransitionSet.java:470)
System.err:     at androidx.transition.Transition.playTransition(Transition.java:1821)
System.err:     at androidx.transition.TransitionManager$MultiListener.onPreDraw(TransitionManager.java:300)
System.err:     at android.view.ViewTreeObserver.dispatchOnPreDraw(ViewTreeObserver.java:1088)
System.err:     at android.view.ViewRootImpl.performTraversals(ViewRootImpl.java:2745)
System.err:     at android.view.ViewRootImpl.doTraversal(ViewRootImpl.java:1721)
System.err:     at android.view.ViewRootImpl$TraversalRunnable.run(ViewRootImpl.java:7598)
System.err:     at android.view.Choreographer$CallbackRecord.run(Choreographer.java:966)
System.err:     at android.view.Choreographer.doCallbacks(Choreographer.java:790)
System.err:     at android.view.Choreographer.doFrame(Choreographer.java:725)
System.err:     at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:951)
System.err:     at android.os.Handler.handleCallback(Handler.java:883)
System.err:     at android.os.Handler.dispatchMessage(Handler.java:100)
System.err:     at android.os.Looper.loop(Looper.java:214)
System.err:     at android.app.ActivityThread.main(ActivityThread.java:7356)
System.err:     at java.lang.reflect.Method.invoke(Native Method)
System.err:     at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:492)
System.err:     at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:930)

[m-abs]

@vakrilov I think this issue should be closed.