System.err: An uncaught Exception occurred on "main" thread.

[baermathias]

Environment
✔ Component nativescript has 6.5.0 version and is up to date.
✔ Component tns-core-modules has 6.5.1 version and is up to date.
✔ Component tns-android has 6.5.0 version and is up to date.
✔ Component tns-ios has 6.5.0 version and is up to date.

Describe the bug

I run several times into the same issue and the problem is, that as soon as this issue occurs, even after undo all the code changes and restart the app the error is still there! Here is the complete error message:

System.err: An uncaught Exception occurred on "main" thread.
System.err: Unable to instantiate activity ComponentInfo{org.nativescript.testbuguncoughterror/com.tns.NativeScriptActivity}: com.tns.NativeScriptException: Failed to create JavaScript extend wrapper for class 'com/tns/NativeScriptActivity'
System.err:
System.err: StackTrace:
System.err: java.lang.RuntimeException: Unable to instantiate activity ComponentInfo{org.nativescript.testbuguncoughterror/com.tns.NativeScriptActivity}: com.tns.NativeScriptException: Failed to create JavaScript extend wrapper for class 'com/tns/NativeScriptActivity'
System.err:     at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:3194)     
System.err:     at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:3409)      
System.err:     at android.app.servertransaction.LaunchActivityItem.execute(LaunchActivityItem.java:83)
System.err:     at android.app.servertransaction.TransactionExecutor.executeCallbacks(TransactionExecutor.java:135)
System.err:     at android.app.servertransaction.TransactionExecutor.execute(TransactionExecutor.java:95)
System.err:     at android.app.ActivityThread$H.handleMessage(ActivityThread.java:2016)
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: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)
System.err: Caused by: com.tns.NativeScriptException: Failed to create JavaScript extend wrapper for class 'com/tns/NativeScriptActivity'
System.err:     at com.tns.Runtime.createJSInstanceNative(Native Method)
System.err:     at com.tns.Runtime.createJSInstance(Runtime.java:820)
System.err:     at com.tns.Runtime.initInstance(Runtime.java:793)
System.err:     at com.tns.NativeScriptActivity.<init>(NativeScriptActivity.java:13)
System.err:     at java.lang.Class.newInstance(Native Method)
System.err:     at android.app.AppComponentFactory.instantiateActivity(AppComponentFactory.java:95)
System.err:     at androidx.core.app.CoreComponentFactory.instantiateActivity(CoreComponentFactory.java:43)
System.err:     at android.app.Instrumentation.newActivity(Instrumentation.java:1243)
System.err:     at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:3182)     
System.err:     ... 11 more
Successfully synced application org.nativescript.testbuguncoughterror on device emulator-5554.

To Reproduce

Here are the steps to create this error. The order is very important, especially of step 3-6 :

1. Create a new project tns create projectname (select: Vue.js & SideDrawer)
2. Go into the newly created folder and start the app with tns run android
3. Move components/App.vue into project root and adjust the import inside app.js to import App from "./App";
4. Create a new folder inside project root app/views
5. Move one of the component files e.g. Browse.vue into the newly created folder
6. Open DrawerContent.vue with VSCode, click CTRL+H to find and replace every line of code which contains Browse with e.g. Projects. Save the file, so that a change is detected!
7. Now rename views/Browse.vue into views/Projects.vue

Expected behavior
Run the projects without errors

Sample project

https://github.com/baermathias/bug-reproduction-nativescript

Additional context

1. Sometimes step 7 is not necessary
2. Sometimes the problem does not appear if step 3 is not done
3. Also it might be that the error doesn't appear if you manage to edit Browse.vue before step 6 and rename SelectedPageService.getInstance().updateSelectedPage("Browse"); --> SelectedPageService.getInstance().updateSelectedPage("Projects");

[baermathias]

@NickIliev was the error reproducible? Do you still need more info and a better error msg?

[baermathias]

Since I don't know whether Progress members are still active on this issue tracker, I tag an nstudio member @NathanWalker

[rigor789]

@baermathias I tested your project, and I found the issue. By moving the App.vue to the root of the project, you are essentially creating 2 modules that are both named app from webpacks perspective. Your app.js is basically overridden by App.vue in a way - so the static binding generator no longer finds the application module from NativeScript and the activity is not generated.

To fix it, I just renamed App.vue to App2.vue and update the import and it runs fine (in DrawerContent, I had to fix the import path for the Projects.vue).

This isn't a nice solution - because adding a 2 after the name is ugly... Instead you could rename app.js to entry.js or main.js and update the package json accordingly, and everything should work fine.

---

And as a side note, I plan to rebuild the drawer template - there are better ways to track the current page than updating a service manually - which can easily break if you have navigations that don't use clearHistory: the native back button will simply not update the current page etc.

[baermathias]

I understand, thanks a lot @rigor789 !
Would it make sense to have this kind of structure and file naming by default? So it is more similar to Vue?

app/
    main.js
    App.vue
    components/
    pages/

Not that it would be necessary, just a thought...

[cardevs]

I have same issue with Angular Nativescript. I can't resolve.