Snapshot build: Trying to link invalid 'this' to a Java object

[NickIliev]

From @sud80 on January 30, 2018 9:9

Tell us about the problem

When I build my app with out snapshot view, all seems good. But once I enable snapshot view I am getting the following error:

01-29 15:43:34.609  5652  5652 W System.err: java.lang.RuntimeException: Unable to start activity ComponentInfo{com.myorg.myapp/com.tns.NativeScriptActivity}: com.tns.NativeScriptException:
01-29 15:43:34.609  5652  5652 W System.err: Calling js method onStart failed
01-29 15:43:34.609  5652  5652 W System.err: Error: Trying to link invalid 'this' to a Java object
01-29 15:43:34.609  5652  5652 W System.err: File: "<embedded>, line: 36, column: 1203853
01-29 15:43:34.609  5652  5652 W System.err: StackTrace:
01-29 15:43:34.609  5652  5652 W System.err: 	Frame: function:'AnimationListnerImpl', file:'<embedded>', line: 36, column: 1203854

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

There were few similar ones but couldn't find anything reported directly with tns-core-modules and snapshot.

Which platform(s) does your issue occur on?

Android

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

• CLI: 3.4.1
• Cross-platform modules: 3.4.0
• Runtime(s): tns-android 3.4.1
• Plugin(s):

    "nativescript-angular": "~5.2.0",
    "nativescript-appversion": "~1.4.1",
    "nativescript-background-http": "~3.1.0",
    "nativescript-camera": "~3.2.1",
    "nativescript-cardview": "~2.0.5",
    "nativescript-couchbaselite": "~1.0.11",
    "nativescript-dom": "~2.0.0",
    "nativescript-drop-down": "3.2.0",
    "nativescript-facebook-login": "~1.0.1",
    "nativescript-geolocation": "~4.2.3",
    "nativescript-gif": "~3.1.1",
    "nativescript-i18n": "~0.2.4",
    "nativescript-imagepicker": "~4.0.1",
    "nativescript-intl": "~3.0.0",
    "nativescript-iqkeyboardmanager": "~1.1.0",
    "nativescript-master-technology": "~1.1.1",
    "nativescript-permissions": "~1.2.3",
    "nativescript-plugin-firebase": "4.2.1",
    "nativescript-pulltorefresh": "~2.0.3",
    "nativescript-social-share": "~1.5.0",
    "nativescript-swiss-army-knife": "~3.0.0",
    "nativescript-theme-core": "~1.0.4",
    "nativescript-timedatepicker": "~1.2.1",
    "nativescript-toast": "~1.4.6",
    "nativescript-web-image-cache": "~4.2.2",
   "nativescript-webview-interface": "~1.4.2"

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

tns build android --bundle --release --env.uglify --env.aot --env.snapshot ...
Above command works and generates the build. But when I add --env.snapshot, the mentioned error happens.

Copied from original issue: NativeScript/NativeScript#5354

[NickIliev]

@sud80 are you by chance using HttpClient in your application - seems related to this known issue

[sud80]

@NickIliev I have looked at the other issue mentioned. But seems to be exactly not this scenario. I don't use HttpClient. Also in this case it happens only when snapshot is enabled. Otherwise it all works fine.

[sud80]

Including full stack trace:

01-30 07:29:29.787  1746  1746 E AndroidRuntime: StackTrace:
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	Frame: function:'AnimationListnerImpl', file:'<embedded>', line: 36, column: 1209372
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	Frame: function:'T', file:'<embedded>', line: 36, column: 1210354
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	Frame: function:'H', file:'<embedded>', line: 36, column: 1214493
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	Frame: function:'G', file:'<embedded>', line: 36, column: 1214869
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	Frame: function:'w', file:'<embedded>', line: 36, column: 1206557
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	Frame: function:'t._navigateCore', file:'<embedded>', line: 36, column: 339396
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	Frame: function:'r.performNavigation', file:'<embedded>', line: 36, column: 791352
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	Frame: function:'r._processNextNavigationEntry', file:'<embedded>', line: 36, column: 791201
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	Frame: function:'t._processNextNavigationEntry', file:'<embedded>', line: 36, column: 337865
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	Frame: function:'r.onLoaded', file:'<embedded>', line: 36, column: 788060
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	Frame: function:'e.onStart', file:'<embedded>', line: 36, column: 347997
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	Frame: function:'NativeScriptActivity.onStart', file:'<embedded>', line: 36, column: 1037747
01-30 07:29:29.787  1746  1746 E AndroidRuntime:
01-30 07:29:29.787  1746  1746 E AndroidRuntime:
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2416)
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2476)
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	at android.app.ActivityThread.-wrap11(ActivityThread.java)
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1344)
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	at android.os.Handler.dispatchMessage(Handler.java:102)
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	at android.os.Looper.loop(Looper.java:148)
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	at android.app.ActivityThread.main(ActivityThread.java:5417)
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	at java.lang.reflect.Method.invoke(Native Method)
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:726)
01-30 07:29:29.787  1746  1746 E AndroidRuntime: 	at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:616)
01-30 07:29:29.787  1746  1746 E AndroidRuntime: Caused by: com.tns.NativeScriptException:
01-30 07:29:29.787  1746  1746 E AndroidRuntime: Calling js method onStart failed

[mpochron]

Here same

[sivsushruth]

Is there any updates on this? Let me know if I can help in someway. Facing this issue as well.

[sivsushruth]

So, have been able to figure out fix and a reproducible scenario.
In case part of my code was doing something like

import { XX } from 'nativescript-angular';

then no matter if we set --env.aot or not, @angular/compiler was getting included in vendor/bundle
because nativescript-angular/platform was requiring @angular/compiler

As soon as code was fixed to use submodules directly like

import { XX } from 'nativescript-angular'/yyy;

issue was fixed.

Even before finding this fix,
We noticed that updating tsConfig to use importHelpers as true and doing npm install tslib without doing the above fix works.

In short when @angular/compiler was included in vendor or bundle js app was crashing
Fixes:

1. Remove import from app that leads to using the compiler as well. You can check webpack report/stats using --env.report to see dependency graph
   AND/OR
2. If you still need the angular compiler, you can install tslib and use importHelpers to true

Also general notice: target as es6 has better performance than target es5 in tsConfig

[LeonBorlinghaus]

Updating all libs with ncu fixed the issue for me:

 @angular/animations                ~5.0.0  →   ~5.2.8 
 @angular/common                    ~5.0.0  →   ~5.2.8 
 @angular/compiler                  ~5.0.0  →   ~5.2.8 
 @angular/core                      ~5.0.0  →   ~5.2.8 
 @angular/forms                     ~5.0.0  →   ~5.2.8 
 @angular/http                      ~5.0.0  →   ~5.2.8 
 @angular/platform-browser          ~5.0.0  →   ~5.2.8 
 @angular/platform-browser-dynamic  ~5.0.0  →   ~5.2.8 
 @angular/router                    ~5.0.0  →   ~5.2.8 
 nativescript-angular               ~5.0.0  →   ~5.2.0 
 @angular/compiler-cli              ~5.0.0  →   ~5.2.8 
 @ngtools/webpack                   ~1.8.2  →  ~1.10.2 
 copy-webpack-plugin                ~4.0.1  →   ~4.5.1 
 resolve-url-loader                 ~2.1.0  →   ~2.3.0 
 typescript                         ~2.4.2  →   ~2.7.2 
 webpack                            ~3.8.1  →   ~4.1.1 
 webpack-sources                    ~1.0.1  →   ~1.1.0 

The following dependencies are satisfied by their declared version range, but the installed versions are behind. You can install the latest versions without modifying your package file by using npm update. If you want to update the dependencies in your package file anyway, run ncu -a.

 nativescript-pulltorefresh   ^2.0.3  →    ^2.1.0 
 nativescript-ui-listview     ^3.5.0  →    ^3.5.1 
 reflect-metadata             ~0.1.8  →   ~0.1.12 
 rxjs                         ~5.5.2  →    ~5.5.7 
 zone.js                      ~0.8.2  →   ~0.8.20 
 css-loader                  ~0.28.7  →  ~0.28.10 
 nativescript-dev-sass        ^1.3.5  →    ^1.4.0 
 nativescript-dev-webpack     ^0.9.0  →    ^0.9.2 
 sass-loader                  ~6.0.6  →    ~6.0.7 
 webpack-bundle-analyzer      ^2.8.2  →   ^2.11.1 

Run ncu with -u to upgrade package.json

I kept webpack on version 3.10.0 so do not update to version 4.x.x