Nativescript: [BottomNavigation] Calling js method onSelectedPositionChange failed

[nericode]

Tell us about the problem

JS: ERROR TypeError: Cannot read property 'length' of undefined
System.err: An uncaught Exception occurred on "main" thread.
System.err: Calling js method onSelectedPositionChange failed
System.err: TypeError: Cannot read property 'android' of undefined
System.err: 
System.err: StackTrace:
System.err: push.../node_modules/tns-core-modules/ui/bottom-navigation/bottom-navigation.js.BottomNavigation.setTabBarItemColor(file:///node_modules/tns-core-modules/ui/bottom-navigation/bottom-navigation.js:496:0)
System.err:     at (file:///node_modules/tns-core-modules/ui/tab-navigation-base/tab-strip-item/tab-strip-item.js:68:0)
System.err:     at push.../node_modules/tns-core-modules/data/observable/observable.js.Observable.notify(file:///node_modules/tns-core-modules/data/observable/observable.js:110:0)
System.err:     at (file:///node_modules/tns-core-modules/ui/core/properties/properties.js:852:0)
System.err:     at (file:///node_modules/tns-core-modules/ui/core/properties/properties.js:862:0)
System.err:     at push.../node_modules/tns-core-modules/ui/tab-navigation-base/tab-strip-item/tab-strip-item.js.TabStripItem.eachChild(file:///node_modules/tns-core-modules/ui/tab-navigation-base/tab-strip-item/tab-strip-item.js:120:0)
System.err:     at (file:///node_modules/tns-core-modules/ui/core/properties/properties.js:857:0)
System.err:     at push.../node_modules/tns-core-modules/ui/styling/style-scope.js.CssState.setPropertyValues(file:///node_modules/tns-core-modules/ui/styling/style-scope.js:472:0)
System.err:     at (file:///node_modules/tns-core-modules/ui/styling/style-scope.js:381:0)
System.err:     at push.../node_modules/tns-core-modules/ui/core/view-base/view-base.js.ViewBase._batchUpdate(file:///node_modules/tns-core-modules/ui/core/view-base/view-base.js:279:0)
System.err:     at push.../node_modules/tns-core-modules/ui/styling/style-scope.js.CssState.updateDynamicState(file:///node_modules/tns-core-modules/ui/styling/style-scope.js:379:0)
System.err:     at CssState._onDynamicStateChangeHandler(file:///node_modules/tns-core-modules/ui/styling/style-scope.js:328:57)
System.err:     at push.../node_modules/tns-core-modules/data/observable/observable.js.Observable.notify(file:///node_modules/tns-core-modules/data/observable/observable.js:110:0)
System.err:     at push.../node_modules/tns-core-modules/ui/core/view-base/view-base.js.ViewBase.notifyPseudoClassChanged(file:///node_modules/tns-core-modules/ui/core/view-base/view-base.js:319:0)
System.err:     at push.../node_modules/tns-core-modules/ui/core/view-base/view-base.js.ViewBase.deletePseudoClass(file:///node_modules/tns-core-modules/ui/core/view-base/view-base.js:345:0)
System.err:     at push.../node_modules/tns-core-modules/ui/core/view-base/view-base.js.ViewBase._goToVisualState(file:///node_modules/tns-core-modules/ui/core/view-base/view-base.js:595:0)
System.err:     at (file:///node_modules/tns-core-modules/ui/tab-navigation-base/tab-strip-item/tab-strip-item.js:151:0)
System.err:     at push.../node_modules/tns-core-modules/data/observable/observable.js.Observable.notify(file:///node_modules/tns-core-modules/data/observable/observable.js:110:0)
System.err:     at push.../node_modules/tns-core-modules/data/observable/observable.js.Observable._emit(file:///node_modules/tns-core-modules/data/observable/observable.js:127:0)
System.err:     at BottomNavigationBarImplementation.onSelectedPositionChange(file:///node_modules/tns-core-modules/ui/bottom-navigation/bottom-navigation.js:87: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.org.nativescript.widgets.BottomNavigationBar_vendor_123976_32_BottomNavigationBarImplementation.onSelectedPositionChange(BottomNavigationBar_vendor_123976_32_BottomNavigationBarImplementation.java:39)
System.err:     at org.nativescript.widgets.BottomNavigationBar.setSelectedPosition(BottomNavigationBar.java:274)
System.err:     at org.nativescript.widgets.BottomNavigationBar$TabClickListener.onClick(BottomNavigationBar.java:287)
System.err:     at android.view.View.performClick(View.java:6663)
System.err:     at android.view.View.performClickInternal(View.java:6635)
System.err:     at android.view.View.access$3100(View.java:794)
System.err:     at android.view.View$PerformClick.run(View.java:26199)
System.err:     at android.os.Handler.handleCallback(Handler.java:907)
System.err:     at android.os.Handler.dispatchMessage(Handler.java:105)
System.err:     at android.os.Looper.loop(Looper.java:216)
System.err:     at android.app.ActivityThread.main(ActivityThread.java:7625)
System.err:     at java.lang.reflect.Method.invoke(Native Method)
System.err:     at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:524)
System.err:     at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:987)

Which platform(s) does your issue occur on?

Android

Please provide the following version numbers that your issue occurs with:

[{
  "nativescript": {
    "id": "org.nativescript.mrsincoquiz",
    "tns-android": {
      "version": "6.2.0"
    },
    "tns-ios": {
      "version": "6.1.0"
    }
  },
  "description": "NativeScript Application",
  "license": "SEE LICENSE IN <your-license-filename>",
  "repository": "<fill-your-repository-here>",
  "scripts": {
    "lint": "tslint \"src/**/*.ts\""
  },
  "dependencies": {
    "@angular/animations": "~8.2.0",
    "@angular/common": "~8.2.0",
    "@angular/compiler": "~8.2.0",
    "@angular/core": "~8.2.0",
    "@angular/forms": "~8.2.0",
    "@angular/platform-browser": "~8.2.0",
    "@angular/platform-browser-dynamic": "~8.2.0",
    "@angular/router": "~8.2.0",
    "json-object-mapper": "^1.6.0",
    "nativescript-angular": "~8.2.0",
    "nativescript-localstorage": "^1.1.5",
    "nativescript-material-cardview": "^2.5.4",
    "nativescript-theme-core": "~1.0.6",
    "reflect-metadata": "~0.1.12",
    "rxjs": "^6.4.0",
    "tns-core-modules": "^6.1.2",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular/compiler-cli": "~8.2.0",
    "@ngtools/webpack": "~8.2.0",
    "codelyzer": "~4.5.0",
    "nativescript-dev-webpack": "~1.2.0",
    "node-sass": "^4.7.1",
    "tslint": "~5.19.0",
    "typescript": "~3.5.3"
  },
  "gitHead": "1964ea9e8ca1a0518e0d6370781eedcf6c23db42",
  "readme": "NativeScript Application"
}]

Please tell us how to recreate the issue in as much detail as possible.

When change tab position.

Is there code involved? If so, please share the minimal amount of code needed to recreate the problem.

Archivo.zip

[tsonevn]

Hi @NeriCodec,
Thank you for the provided project.
I reviewed it and the issue seems to be connected to the old version of the nativescript-theme-core. You can try updating to the latest theme(v 2.0.24) and check if the issue will be fixed on your side. Keep in mind that there is some difference in the usage of the new theme. Check out the read me file here. Regarding that, I will mark this as a bug and we will investigate it further.

[nericode]

Hi @tsonevn

I began to review more thoroughly what the error could be and solve the problem with the same version of nativescript-theme-core ~ ​​1.0.6 the only thing I did is declare a color to TabStripItem

TabStripItem {
    color: gray;
}