Nativescript-ui-feedback: RadCalendar Android: this.nativeView.setForceDarkAllowed is not a function

[GlenCroft]

The latest version of RadCalendar is giving an error when running and Android API version 29

TypeError: this._nativeView.setForceDarkAllowed is not a function

Which platform(s) does your issue occur on?

Android

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

• Progress NativeScript UI plugin version: 6.0.0
• CLI: 6.1.2
• Cross-platform modules: 6.2.0
• Runtime(s): tns-android: 6.1.2

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

1. Start the application
2. Access a page with a RadCalendar

[tsonevn]

HI @GlenCroft,
I checked your case with our sample app nativescript-ui-samples, while using the latest version of NativeScirpt (v 6.2) and nativescript-ui-calendar (v 6.0) and was unable to recreate this problem. I've noticed that you are using an old version of tns-android and {N} CLI. Try to upgrade to the latest version of the CLI and Android Runtime and check if you will be able to recreate the problem. You can check the upgrade instructions here for further help.

[enition]

I'm having the same issue

• NativeScript UI Calendar plugin version: 6.0.0
• CLI: 6.2.1
• Cross-platform modules: 6.2.0
• Runtime(s): tns-android: 6.2.0

App loads okay but fails with the following error on any page containing a RadCalendar component:

ERROR Error: Uncaught (in promise): TypeError: this._nativeView.setForceDarkAllowed is not a function
JS: TypeError: this._nativeView.setForceDarkAllowed is not a function
JS:     at RadCalendar.push.../node_modules/nativescript-ui-calendar/ui-calendar.js.RadCalendar.initNativeView (file:///node_modules/nativescript-ui-calendar/ui-calendar.js:1858:0)
JS:     at RadCalendar.push.../node_modules/@nativescript/core/ui/core/view-base/view-base.js.ViewBase.setNativeView (file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:548:0)
JS:     at RadCalendar.push.../node_modules/@nativescript/core/ui/core/view-base/view-base.js.ViewBase._setupUI (file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:527:0)
JS:     at file:///node_modules/@nativescript/core/ui/core/view-base/view-base.js:534:0

[NickSch1]

Same issue here, I've tried these versions:

• nativescript-ui-calender: 6.0.0 & 6.0.1-next-2019-11-22-125611-02
• CLI: 6.2.2
• tns-core-modules: 6.2.0 & 6.2.1
• tns-android: 6.2.0 & 6.2.1
• nativescript-angular: 8.20.0

App works fine, the only thing is the RadCalendar isn't displayed and the following error gets printed:

JS: ERROR TypeError: this._nativeView.setForceDarkAllowed is not a function
JS: ERROR CONTEXT {
JS:   "view": {
JS:     "def": {
JS:       "nodeFlags": 688013329,
JS:       "rootNodeFlags": 671088641,
JS:       "nodeMatchedQueries": 2,
JS:       "flags": 0,
JS:       "nodes": [
JS:         {
JS:           "nodeIndex": 0,
JS:           "parent": null,
JS:           "renderParent": null,
JS:           "bindingIndex": 0,
JS:           "outputIndex": 0,
JS:           "checkIndex": -1,
JS:           "flags": 671088640,
JS:           "childFlags": 0,
JS:           "directChildFlags": 0,
JS:           "childMatchedQueries": 0,
JS:           "ngContentIndex": -1,
JS:           "matchedQueries": {},
JS:           "matchedQueryIds": 0,
JS:           "references": {},
JS:           "childCount": 0,
JS:           "bindings": [],
JS:           "bindingFlags": 0,
JS:           "outputs": [],
JS:           "element": null,
JS:           "provider": null,
JS:           "text": null,
JS:           "query": {
JS:             "id": 1,
JS:             "filterId": 2,
JS:             "bindings": [
JS:               {
JS:                 "propName": "calendar",
JS:                 "bindingType": 0
JS:               }
JS:             ]
JS:           },
JS:           "...

[lini]

Try building your app with the latest Android SDK Platform 29 instead of 28. The setForceDarkAllowed method is part of Android 10. This might be the reason it fails at runtime when you run it on an Android 10 device.

[NickSch1]

Thanks for the reply. This does seem to fix the issue.

[enition]

Try building your app with the latest Android SDK Platform 29 instead of 28. The setForceDarkAllowed method is part of Android 10. This might be the reason it fails at runtime when you run it on an Android 10 device.

Nope, building with SDK 28 was the only way to get around the error.

There's a condition in nativescript-ui-calendar/ui-calendar.android.js that checks for SDK versions >= 29 and if true it calls setForceDarkAllowed which throws the error.

if (getSdkApiLevel() && getSdkApiLevel() >= 29) {
    this._nativeView.setForceDarkAllowed(false);
}

[lini]

The condition in the calendar code is checked at runtime - i.e. whether the app is running on a device with Android 10 (API level 29) like a Google Pixel 4. I am suggesting that you build your app using SDK Platform 29. For example if you have Android Studio installed, go to the Tools > SDK Manager menu and select/install Android 10.0 (Q). After that, the NativeScript CLI should detect that you have the latest SDK version and will use it to build your app.

If you do not wish to build with SDK 29, then you can simply revert the calendar and any other NativeScript UI components you have to the previous major version - e.g. use [email protected] instead of 6.0.0. The difference between version 5 and 6 is the inclusion of dark mode support for iOS and Android. This is a breaking change for some apps, as you already saw, which is why we released it as a major version.

[GlenCroft]

@lini Thanks for the explanation, building with SDK Platform 29 works.