nativescript-community / ui-material-components

Monorepo that contains all of the NativeScript Material Design plugins.
https://nativescript-community.github.io/ui-material-components/
Apache License 2.0
219 stars 80 forks source link

Crash when transitioning away from a page with ui-material-tabs #327

Closed cjohn001 closed 3 years ago

cjohn001 commented 3 years ago

Which platform(s) does your issue occur on?

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

"devDependencies": { "@angular/compiler-cli": "~12.2.2", "@graphql-codegen/cli": "^1.20.1", "@graphql-codegen/fragment-matcher": "^2.0.1", "@graphql-codegen/introspection": "^1.18.1", "@graphql-codegen/typescript": "^1.21.1", "@graphql-codegen/typescript-apollo-angular": "~2.3.1", "@graphql-codegen/typescript-operations": "^1.17.15", "@nativescript/android": "8.0.0", "@nativescript/ios": "JSC", "@nativescript/types": "~8.0.1", "@nativescript/webpack": "^5.0.0-rc.4", "@ngtools/webpack": "~12.2.0", "@types/d3-ease": "^2.0.0", "@types/intl": "^1.2.0", "@types/node": "^13.13.19", "@types/uuid": "^8.3.0", "codelyzer": "^6.0.1", "keycloak-request-token": "^0.1.0", "sass": "^1.37.5", "ts-node": "^9.1.1", "tslint": "^6.1.3", "typescript": "~4.2.0" },

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

Unfortunately, the bug seems to be not easy to reproduce. It seems to be a runtime issue which not always appears. The problem: I have a page with the material tabs control including 4 tab pages. Everything is working fine. When I try to navigate away to a new page I randomly see the following error message without a stack trace.

NativeScript discarding uncaught JS exception!

The JSC runtime does not brake but just seems to ignore the issue. With the new v8 runtime the app crashes instead.

The just described behavior appears with "5.3.19" of the plugin. I downgraded to "5.3.15" where I see the same bug. But here I got an additional stacktrace which is given below:

CONSOLE LOG file: node_modules/@angular/core/fesm2015/core.js:28039:0 Angular is running in development mode. Call enableProdMode() to enable production mode. NativeScript discarding uncaught JS exception! NativeScript discarding uncaught JS exception! Fatal JavaScript exception - application has been terminated. Native stack trace: 1 0x10840d62e NativeScript::reportFatalErrorBeforeShutdown(JSC::ExecState, JSC::Exception, bool) 2 0x10845f524 -[TNSRuntime executeModule:referredBy:] 3 0x107645093 main 4 0x7fff2025abbd start JavaScript stack trace: UIApplicationMain(file: node_modules/@nativescript/core/application/index.ios.js:336:0 at run(file: node_modules/@nativescript/core/application/index.ios.js:336:0 at runNativeScriptAngularApp(file: node_modules/@nativescript/angular/fesm2015/nativescript-angular.js:564:19 at ./src/main.ts(file: src/src/main.ts:23:25 at webpack_require(file: src/webpack/bootstrap:19:0 at webpack_exec(file:///app/bundle.js:36557:58) at file:///app/bundle.js:36558:127 at file: src/webpack/runtime/startup entrypoint:6:0 at file:///app/bundle.js:36558:48 at anonymous(file:///app/bundle.js:36563:3) at evaluate([native code]) at moduleEvaluation([native code]) at [native code] at asyncFunctionResume([native code]) at [native code] at promiseReactionJob([native code]) JavaScript error: file: node_modules/@nativescript/core/application/index.ios.js:336:0 JS ERROR Error: Failed to allocate data stores for 140362783383168 rows in section 0. Consider using fewer rows

@farfromrefug : I know it is very unlikely that you will find the issue with the given details. I am wondering, if Nativescript has some kind of tracing functionality which I could activate to get more information like a stacktrace for the most recent plugin version. It seems that there is some uninitialzed variable involved (rows?).

farfromrefug commented 3 years ago

@cjohn001 i would say the error is with a listview inside your tabs. For some reason it tries to add 140362783383168 items to the listview.

cjohn001 commented 3 years ago

Well, I am only using nativescript-community/ui-collectionview on the page. I have also ui-collectionview items on other pages without a ui-material-tabs component and their they work perfectly fine. Therefore, I expected it to be ui-material-tabs, or it is some inference between those plugins. Do you think the issue should better be moved to ui-coolectionview? And can you do this?

I am using the most recent version and tried the older version as well, as I suspected it to be the source of the problem as well "@nativescript-community/ui-collectionview": "4.0.43", "@nativescript-community/ui-collectionview": "4.0.42",

farfromrefug commented 3 years ago

@cjohn001 honestly not sure who is responsible for triggering the issue but your error message clearly talks of uicollectionview. Can you create a repoducable example ?( really sorry to keep on asking it but that is the only real way to investigate this)

cjohn001 commented 3 years ago

@farfromrefug: Well, I understand. With the description I gave it is clear to me that it is very difficult to reason. I will try to replicate the issue. My major hope was that you might be able to give me a hint how I could enable some kind of tracing to get more detailed info when thinks break. But probably there is no additional option I am not aware of :)

cjohn001 commented 3 years ago

@farfromrefug: I got some help in the forum in order to debug the issue further. It is not related to the collection view. There exists an option in nativescript.config.ts which you can set to false in order to obtain a stacktrace.

discardUncaughtJsExceptions: false

This gives me the following problem when navigating away from the page with the materialtabs:

I think this is the problem: file: node_modules/@nativescript-community/ui-material-tabs/tabs.ios.js:148:0 JS ERROR TypeError: null is not an object (evaluating 'this.tabBar.frame')

The full stack trace:

Fatal JavaScript exception - application has been terminated. Native stack trace: 1 0x10558162e NativeScript::reportFatalErrorBeforeShutdown(JSC::ExecState, JSC::Exception, bool) 2 0x1055c23a8 NativeScript::FFICallback::ffiClosureCallback(ffi_cif, void, void, void) 3 0x105fbdc90 ffi_closure_unix64_inner 4 0x105fbe6b2 ffi_closure_unix64 5 0x7fff27a055b8 -[CALayer layoutSublayers] 6 0x7fff27a0be3f CA::Layer::layout_if_needed(CA::Transaction) 7 0x7fff27a17c53 CA::Layer::layout_and_display_if_needed(CA::Transaction) 8 0x7fff27951f26 CA::Context::commit_transaction(CA::Transaction, double, double*) 9 0x7fff279893b9 CA::Transaction::commit() 10 0x7fff246c00b7 _UIApplicationFlushRunLoopCATransactionIfTooLate 11 0x7fff24772b88 processEventQueue 12 0x7fff247684cc eventQueueSourceCallback 13 0x7fff20390ede CFRUNLOOP_IS_CALLING_OUT_TO_A_SOURCE0_PERFORM_FUNCTION 14 0x7fff20390dd6 CFRunLoopDoSource0 15 0x7fff20390300 CFRunLoopDoSources0 16 0x7fff2038a9f7 CFRunLoopRun 17 0x7fff2038a1a7 CFRunLoopRunSpecific 18 0x7fff2b874d85 GSEventRunModal 19 0x7fff246c14df -[UIApplication _run] 20 0x7fff246c639c UIApplicationMain 21 0x105fbe4f5 ffi_call_unix64 22 0x113f763a0 JavaScript stack trace: file: node_modules/@nativescript-community/ui-material-tabs/tabs.ios.js:148:0 at UIApplicationMain([native code]) at run(file: node_modules/@nativescript/core/application/index.ios.js:336:0 at runNativeScriptAngularApp(file: node_modules/@nativescript/angular/fesm2015/nativescript-angular.js:564:19 at ./src/main.ts(file: src/src/main.ts:23:25 at webpack_require(file: src/webpack/bootstrap:19:0 at webpack_exec__(file:///app/bundle.js:36878:58) at file:///app/bundle.js:36879:127 at file: src/webpack/runtime/startup entrypoint:6:0 at file:///app/bundle.js:36879:48 at anonymous(file:///app/bundle.js:36884:3) at evaluate([native code]) at moduleEvaluation([native code]) at [native code] at asyncFunctionResume([native code]) at [native code] at promiseReactionJob([native code]) JavaScript error: file: node_modules/@nativescript-community/ui-material-tabs/tabs.ios.js:148:0 JS ERROR TypeError: null is not an object (evaluating 'this.tabBar.frame') *** Fatal JavaScript exception - application has been terminated. ** Native stack trace: 1 0x10558162e NativeScript::reportFatalErrorBeforeShutdown(JSC::ExecState, JSC::Exception, bool) 2 0x1055d3524 -[TNSRuntime executeModule:referredBy:] 3 0x1047b9093 main 4 0x7fff2025abbd start 5 0x1 JavaScript stack trace: UIApplicationMain(file: node_modules/@nativescript/core/application/index.ios.js:336:0 at run(file: node_modules/@nativescript/core/application/index.ios.js:336:0 at runNativeScriptAngularApp(file: node_modules/@nativescript/angular/fesm2015/nativescript-angular.js:564:19 at ./src/main.ts(file: src/src/main.ts:23:25 at webpack_require(file: src/webpack/bootstrap:19:0 at webpack_exec(file:///app/bundle.js:36878:58) at file:///app/bundle.js:36879:127 at file: src/webpack/runtime/startup entrypoint:6:0 at file:///app/bundle.js:36879:48 at anonymous(file:///app/bundle.js:36884:3) at evaluate([native code]) at moduleEvaluation([native code]) at [native code] at asyncFunctionResume([native code]) at [native code] at promiseReactionJob([native code]) JavaScript error: file: node_modules/@nativescript/core/application/index.ios.js:336:0 JS ERROR Error (CoreFoundation) Terminating app due to uncaught exception 'NativeScript encountered a fatal error: Error at UIApplicationMain(file: node_modules/@nativescript/core/application/index.ios.js:336:0 at run(file: node_modules/@nativescript/core/application/index.ios.js:336:0 at runNativeScriptAngularApp(file: node_modules/@nativescript/angular/fesm2015/nativescript-angular.js:564:19 at ./src/main.ts(file: src/src/main.ts:23:25 at webpack_require(file: src/webpack/bootstrap:19:0 at webpack_exec(file:///app/bundle.js:36878:58) at file:///app/bundle.js:36879:127 at file: src/webpack/runtime/startup entrypoint:6:0 at file:///app/bundle.js:36879:48 at anonymous(file:///app/bundle.js:36884:3) at evaluate([native code]) at moduleEvaluation([native code]) at [native code] at asyncFunctionResume([native code]) at [native code] at promiseReactionJob([native code]) ', reason: '(null)' ** First throw call stack: ( 0 CoreFoundation 0x00007fff20422fba exceptionPreprocess + 242 1 libobjc.A.dylib 0x00007fff20193ff5 objc_exception_throw + 48 2 NativeScript 0x0000000105581b6f _ZN12NativeScri<…> NativeScript caught signal 6. Native Stack: 1 0x1055d2171 sig_handler(int) 2 0x7fff60335d7d _sigtramp 3 0x1 4 0x7fff200fbcb5 abort 5 0x7fff20254692 abort_message 6 0x7fff20245dfd demangling_unexpected_handler() 7 0x7fff20179ace _objc_terminate() 8 0x7fff20253aa7 std::terminate(void ()()) 9 0x7fff20256174 __cxa_get_exception_ptr 10 0x7fff2025613b __cxxabiv1::exception_cleanup_func(_Unwind_Reason_Code, _Unwind_Exception) 11 0x7fff20194119 objc_exception_throw 12 0x105581b6f NativeScript::reportFatalErrorBeforeShutdown(JSC::ExecState, JSC::Exception*, bool) 13 0x1055d3524 -[TNSRuntime executeModule:referredBy:] 14 0x1047b9093 main 15 0x7fff2025abbd start 16 0x1 JS Stack:

And the attached image shows the relevant code:

Bildschirmfoto 2021-08-27 um 23 16 19

I unfortunately do not understanding what is happening there. Like I mentioned, the issue appears when navigating away from the page. In the debugger I could observe that

this.tabBar = null

when the app crashes. But more interesting is, that most of the time (which I would expect should be the normal behavior) on leaving the page, this code block is not executed at all. I am wondering why a layout cycle is called than in certain situations when the page is left. I assume this is the real problem. Maybe we can simply add an additional test on line 145

if(owner.testStript && this.tabBar) ?

farfromrefug commented 3 years ago

@cjohn001 thanks i know understand the issue. The view controller try to layout its subviews after the tabbar have been released. It should be easy to fix. I wonder if this is another issue though as it is not the same error message. Will fix tonight or tomorrow.

cjohn001 commented 3 years ago

@farfromrefug: The error with the tabbar is the one which I observed in the latest version of the plugin -ui-material-tabs": "5.3.19" As I could only see the single line error message: NativeScript discarding uncaught JS exception!

I downgraded to "5.3.15". From which the stacktrace with the rows was obtained from. I will further have an eye on the topic if I see the issue from the old plugin again. I indeed have another issue with the UICollectionView. But it is not related to the issue here, therefore I will provide an extra issue in its repository later the day. Need to prepare some stuff first in order to be able to show the problem.

farfromrefug commented 3 years ago

@cjohn001 just released 5.3.20 which should fix it!

cjohn001 commented 3 years ago

I can confirm the bug is fixed. Thank you very much!