Nativescript: NG2 tabView runtime errors / crashes with 'typeface' of null

[ButterMeWaffle]

Hello guys,

So i have been using the tab view in my new NS NG2 app and I have been running into issues I cant find resolves too. I currently have 2 pages that have tab views on them, each time i go to these pages i get a long list of errors like this.

W/ExifInterface(21871):         at com.tns.Runtime.callJSMethodNative(Native Met
hod)
W/ExifInterface(21871):         at com.tns.Runtime.dispatchCallJSMethodNative(Ru
ntime.java:1022)
W/ExifInterface(21871):         at com.tns.Runtime.callJSMethodImpl(Runtime.java
:907)
W/ExifInterface(21871):         at com.tns.Runtime.callJSMethod(Runtime.java:895
)
W/ExifInterface(21871):         at com.tns.Runtime.callJSMethod(Runtime.java:879
)
W/ExifInterface(21871):         at com.tns.Runtime.callJSMethod(Runtime.java:871
)
W/ExifInterface(21871):         at com.tns.Runtime.callJSMethodNative(Native Met
hod)
W/ExifInterface(21871):         at com.tns.Runtime.dispatchCallJSMethodNative(Ru
ntime.java:1022)
W/ExifInterface(21871):         at com.tns.Runtime.callJSMethodImpl(Runtime.java
:907)
W/ExifInterface(21871):         at com.tns.Runtime.callJSMethod(Runtime.java:895
)
W/ExifInterface(21871):         at com.tns.Runtime.callJSMethod(Runtime.java:879
)
W/ExifInterface(21871):         at com.tns.Runtime.callJSMethod(Runtime.java:871
)
W/ExifInterface(21871):         at com.tns.Runtime.callJSMethodNative(Native Met
hod)
W/ExifInterface(21871):         at com.tns.Runtime.dispatchCallJSMethodNative(Ru
ntime.java:1022)
W/ExifInterface(21871):         at com.tns.Runtime.callJSMethodImpl(Runtime.java
:907)
W/ExifInterface(21871):         at com.tns.Runtime.callJSMethod(Runtime.java:895
)
W/ExifInterface(21871):         at com.tns.Runtime.callJSMethod(Runtime.java:879
)
W/ExifInterface(21871):         at com.tns.Runtime.callJSMethod(Runtime.java:871
)

now if i navigate from one page then back to the tabs view page, i get cannot read 'typeface' of null.

I first thought it had to be something to do with the content of each tab so I made a blank page and used the demo tabView code to test this. This produced the same exact errors (http://docs.nativescript.org/angular/cookbook/tab-view-ng.html had to change the call for component from angular2 to @angular)

Did you verify this is a real problem by searching [Stack Overflow]

I was unable to find this issue anywhere else (some similar but not this exact one)

Which platform(s) does your issue occur on?

iAndroid (havent testing IOS yet)

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

• CLI: 2.4.0
• Cross-platform modules: 2.4.0
• Runtime(s): android - 2.4.1 / IOS - 2.4.0
• Plugin(s):

"nativescript-drop-down": "^1.3.3",
    "nativescript-loading-indicator": "^2.0.1",
    "nativescript-permissions": "^1.2.1",
    "nativescript-plugin-firebase": "3.8.4",
    "nativescript-telerik-ui": "1.4.1",
    "nativescript-toasty": "^1.1.0",

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

create a pge usign the code provided from the first example of this page http://docs.nativescript.org/angular/cookbook/tab-view-ng.html

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

just the code from the example. To save space on this post I will not repost it here

[sis0k0]

Hello @SamuelGRwebfab. I was unable to reproduce the problem. Could you please upload your project to some public repo?

[ButterMeWaffle]

@sis0k0 Sadly I am not able to upload my entire project, Is there any other information I can get you that may help?

[sis0k0]

@SamuelGRwebfab yup, if you could share a simple app with the problem, that would be great!

[ButterMeWaffle]

@sis0k0 sorry that took so long, here is an example with the tabView issue, run tns livesync android --watch and you will see the errors i was talking about when the page loads https://github.com/SamuelGRwebfab/NS-tabView-bug

[tsonevn]

Hi @SamuelGRwebfab,
Thank you for your interest in NativeScript and for your sample project.

I reviewed your project and everything seems to work as expected. Could you try to delete hook, node_modules and platforms folders from the project and to verify, whether you will have the sample problem, while building the app.

Let me know, whether this helps, or if I could assist you further.

[ButterMeWaffle]

hello @tsonevn

When you ran this project on an android device, did you receive no errors? I tried the above suggestion and I am still getting the same errors. On my actual project this is causing a constant crash when navigating between the two main pages of my app.

Do you have any other suggestion as to how I can fix this? It seems to me like this is caused by the basic tabView being called into the app.

note that the demo app still runs, but still throws the errors which cause a crash on navigation.

[sis0k0]

Hi @SamuelGRwebfab,

We were unable to reproduce the error both with your sample project and with a more complicated one. Can you share some information about the Android device you are using?

[ButterMeWaffle]

@sis0k0

I am using my old LG G3 running android 5.0.1 as well as my LG G5 running 7.0

Both phones give me the same errors in the console.

I just now ran it again and it produced the same errors as before on both phones.

Is it possible that it is my computer that is causing this issue?

[NickIliev]

@SamuelGRwebfab

I have recreated the documentation example in this sample app and it works as expected.
Perhaps you can clone my project and test it on your side.

[ButterMeWaffle]

@NickIliev

as you said this project is not having the same issues as the one i posted. I will try to use this to track down the issue. I will post the solution here (if i find it)

Thanks!

[ButterMeWaffle]

investigation log.

(using your project)
The errors do not appear on my lg g5, but they will on my lg g3. (on my project errors will appear with both)

my sample project will throw errors on both the lg g3 and the g5.

some dependencies are different however matching your versions to my project does not solve the issue.

using your app component code my demo app will SOMETIMES throw these errors, sometimes it wont.

after messing with some of the code, this issue may not be cause by the tab view, as i previously thought.

I decided to make a .apk for my app and install it that ways (instead of tns livesync android --watch)

Navigating through the pages with tabs in them does not cause a crash, This might be a livesync only issue?

tested this on multiple devices

Since the issue is not present when run outside of livesync, I will not be putting any more time towards fixing this. Thanks to everyone that helped me out. I hope this log helps someone else out in the future.

I am closing this issue

[EddyVerbruggen]

If you don't mind me reopening this issue (with a reproduction path and proposed fix): simply clone this repo, navigate to the tab labeled 'second' and press the 'scan upc' button.

This will crash the app upon a scan result or using the cancel (back) button - with the same error message as reported here. Without the TabView everything works fine.

As you noticed it only occurred with LiveSync enabled, but with {N} 2.5.0 that's default so that's why this becomes a bit more urgent IMO.

The problem may originate from somewhere else, so this fix may not be the best, but at least I was able to get rid of it by adding if (!nativeValue) return; here.

Thanks,
Eddy

[GrEg00z]

Hello

I use nativescript with angular and I get exactly the same bug as this isssue referenced, but I reproduce it by an other way :

• go to a page in the app that use tabview component
• pause the app (go the android menu or other app)
• resume the app
• app crash like this isssue referenced

For informations, I only use the TabView component of Nativescript in a simple page, not barcodescanner plugin or others.
And also, livesync or not, the app crash constantly on resuming on a page which includes a tabview

Please give us some news about this bug because it will be critical for my app

[SBD580]

Have the same issue, exactly the same as @GrEg00z described

[SBD580]

If anyone else not using the native tabbar, this is a possible workaround:

let style = require("ui/styling/style");
style.registerHandler(style.fontInternalProperty, new style.StylePropertyChangedHandler(()=>{},()=>{},()=>{}), 'TabView');

(this can also be adjusted to still work with the native tabbar)

[kt215]

I had the same issue (with NS 2.5.0).

I was using FontAwesomeas font for TabView, and the error went away when I set style="font-family: Roboto" on the outer StackLayout.

The error started to appear when I added ngModelbinding on the TabView.

[ButterMeWaffle]

@kt215
That is very interesting, I seem to get this issue when using the tabview in any way. I have even made a demo app with one page using a blank tabview, same issue.

I did give your solution a try with no luck.

[kt215]

@SamuelGRwebfab My TabView is inside a RadSideDrawer like this:

<RadSideDrawer>
    <StackLayout tkDrawerContent>
        <side-drawer></side-drawer>
    </StackLayout>
    <StackLayout tkMainContent style="font-family: Roboto">
    <!-- TabView here... -->
    </StackLayout>
</RadSideDrawer>

[tsonevn]

Hi @SamuelGRwebfab,

Could you send us the demo app, where the problem could be reproduced?
It would also help if you could provide also info about the device or emulator, you are using for testing.

Regards,
@tsonevn

[GrEg00z]

@tsonevn

You don't need a demo app to reproduce the bug.
Just use a tabview in any page of an app, go to this page, make in pause the app, and resume the app.
The bug will appears

I use Nativescript Angular, with device Nexus 5X on android 7.1.1

[ButterMeWaffle]

hello @tsonevn

I had previously posted it in here but here you go. https://github.com/SamuelGRwebfab/NS-tabView-bug

As @GrEg00z said, you can reproduce it by simply adding tab view to any page and either minimizing the app and rerunning it, or by navigating to any page and then back to the tabview page. In the past this bug was only happening when using livesync, but now that livesync is always used it is always present during development. There have been very few times when i have been developing and this bug did NOT occur, however these times are few and far between. I have reproduced this bug on the following devices. LG G3, LG G4, LG G5, Galaxy S6, Galaxy S6 edge+ and the Samsung S7 (yes i still have all of my fingers after that one).

If you need any more details let me know!

[ButterMeWaffle]

After doing some more testing. I have found that this bug will only be reproducible on certain builds.

For example, 3 builds ago every time i would nav to a tabview, it would crash. However on my current build I can navigate without any issue *maybe a bit of lag in between)

Hope this helps with the investigation.

[tsonevn]

Hi all,
This issue has been also fixed in the upcoming release 3.0, however, it is a major version release coming with some breaking changes so we are still working on it. More about the upcoming release could be found here.

[vchimev]

UPDATE: This fix has been released in [email protected].

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.