Nativescript: Error destroy activity when I close the app with the back button

[Jean45612]

Environment

Component nativescript has 6.7.4 version and is up to date.
tns-core-modules: 6.5.5
tns-android: 6.5.1 
tns-ios: 6.5.0

Describe the bug
Hello friends, I need your help, I am new to nativescript, and I am creating a native angular application, but when I close the application with the Back button, this error appears, I have looked for similar errors in this repository but I have not been able to solve them, please help me to solve it, it is very urgent, I would really appreciate it

System.err: An uncaught Exception occurred on "main" thread. System.err: Unable to destroy activity {org.nativescript.GAFStore/com.tns.NativeScriptActivity}: com.tns.NativeScriptException: Calling js method onDestroy failed System.err: Error: View not added to this instance. View: ProxyViewContainer(8) CurrentParent: Page(4) ExpectedParent: AppHostView(1) System.err: System.err: StackTrace: System.err: java.lang.RuntimeException: Unable to destroy activity {org.nativescript.GAFStore/com.tns.NativeScriptActivity}: com.tns.NativeScriptException: Calling js method onDestroy failed System.err: Error: View not added to this instance. View: ProxyViewContainer(8) CurrentParent: Page(4) ExpectedParent: AppHostView(1) System.err: at android.app.ActivityThread.performDestroyActivity(ActivityThread.java:4720) System.err: at android.app.ActivityThread.handleDestroyActivity(ActivityThread.java:4743) System.err: at android.app.servertransaction.DestroyActivityItem.execute(DestroyActivityItem.java:39) System.err: at android.app.servertransaction.TransactionExecutor.executeLifecycleState(TransactionExecutor.java:145) System.err: at android.app.servertransaction.TransactionExecutor.execute(TransactionExecutor.java:70) System.err: at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1960) System.err: at android.os.Handler.dispatchMessage(Handler.java:106) System.err: at android.os.Looper.loop(Looper.java:214) System.err: at android.app.ActivityThread.main(ActivityThread.java:7094) System.err: at java.lang.reflect.Method.invoke(Native Method) System.err: at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:494) System.err: at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:975) System.err: Caused by: com.tns.NativeScriptException: Calling js method onDestroy failed System.err: Error: View not added to this instance. View: ProxyViewContainer(8) CurrentParent: Page(4) ExpectedParent: AppHostView(1) System.err: at com.tns.Runtime.callJSMethodNative(Native Method) System.err: at com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1286) System.err: at com.tns.Runtime.callJSMethodImpl(Runtime.java:1173) System.err: at com.tns.Runtime.callJSMethod(Runtime.java:1160) System.err: at com.tns.Runtime.callJSMethod(Runtime.java:1138) System.err: at com.tns.Runtime.callJSMethod(Runtime.java:1134) System.err: at com.tns.NativeScriptActivity.onDestroy(NativeScriptActivity.java:39) System.err: at android.app.Activity.performDestroy(Activity.java:7697) System.err: at android.app.Instrumentation.callActivityOnDestroy(Instrumentation.java:1310) System.err: at android.app.ActivityThread.performDestroyActivity(ActivityThread.java:4705) System.err: ... 11 more

To Reproduce
tns-run-android

then launch the mobile app on the device and finally go back with the back button, and you will see this error come out

Package.json

{
  "nativescript": {
    "id": "org.nativescript.GAFStore",
    "tns-ios": {
      "version": "6.5.0"
    },
    "tns-android": {
      "version": "6.5.1"
    }
  },
  "description": "NativeScript Application",
  "license": "SEE LICENSE IN <your-license-filename>",
  "repository": "<fill-your-repository-here>",
  "scripts": {
    "ngcc": "ngcc --properties es2015 module main --first-only",
    "postinstall": "npm run ngcc"
  },
  "dependencies": {
    "@angular/animations": "~9.1.0",
    "@angular/common": "~9.1.0",
    "@angular/compiler": "~9.1.0",
    "@angular/core": "~9.1.0",
    "@angular/forms": "~9.1.0",
    "@angular/platform-browser": "~9.1.0",
    "@angular/platform-browser-dynamic": "~9.1.0",
    "@angular/router": "~9.1.0",
    "@nativescript/angular": "~9.0.0",
    "@nativescript/theme": "~2.3.0",
    "nativescript-drop-down": "^5.0.5",
    "nativescript-mapbox": "^5.0.1",
    "nativescript-toast": "^2.0.0",
    "reflect-metadata": "~0.1.12",
    "rxjs": "^6.5.0",
    "tns-core-modules": "~6.5.0",
    "zone.js": "~0.10.3"
  },
  "devDependencies": {
    "@angular/compiler-cli": "~9.1.0",
    "@ngtools/webpack": "~9.1.0",
    "@types/file-saver": "^2.0.1",
    "@types/jasmine": "^3.5.10",
    "nativescript-dev-webpack": "~1.5.0",
    "tns-platform-declarations": "^6.5.8",
    "typescript": "~3.8.3"
  },
  "gitHead": "3153594d609d66fab71745c881d617ac1328ea1b",
  "readme": "NativeScript Application"
}

app.module.ts

import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
import { NativeScriptModule, NativeScriptHttpClientModule, NativeScriptFormsModule, registerElement } from "@nativescript/angular";
import { AppRoutingModule } from "./app-routing.module";
import { AppComponent } from "./app.component";
import { LoginComponent } from './components/login/login.component';
import { HeaderComponent } from './components/partials/header/header.component';
import { FooterComponent } from './components/partials/footer/footer.component';
import { IndexComponent } from './components/index/index.component';
import { RegistrarComponent } from './components/registrar/registrar.component';
import { DashboardComponent } from './components/dashboard/dashboard.component';
import { CategoriasComponent } from './components/categorias/categorias.component';


registerElement("DropDown", () => require("nativescript-drop-down/drop-down").DropDown);
registerElement("Mapbox", () => require("nativescript-mapbox").MapboxView);

@NgModule({
    bootstrap: [
        AppComponent
    ],
    imports: [
        NativeScriptModule,
        AppRoutingModule,
        NativeScriptHttpClientModule,
        NativeScriptFormsModule,
    ],
    declarations: [
        AppComponent,
        LoginComponent,
        HeaderComponent,
        FooterComponent,
        IndexComponent,
        RegistrarComponent,
        DashboardComponent,
        CategoriasComponent,
    ],
    providers: [],
    schemas: [
        NO_ERRORS_SCHEMA
    ]
})
/*
Pass your application module to the bootstrapModule function located in main.ts to start your app
*/
export class AppModule { }

app.routing.module.ts

import { NgModule } from "@angular/core";
import { Routes } from "@angular/router";
import { NativeScriptRouterModule } from "@nativescript/angular";

import { LoginComponent } from "./components/login/login.component";
import { IndexComponent } from "./components/index/index.component";
import { RegistrarComponent } from "./components/registrar/registrar.component";
import { DashboardComponent } from "./components/dashboard/dashboard.component";
import { CategoriasComponent } from "./components/categorias/categorias.component";

const routes: Routes = [
    { path: "", redirectTo: "/index", pathMatch: "full" },
    { path: "index", component: IndexComponent },
    { path: "login", component: LoginComponent },
    { path: "registrar", component: RegistrarComponent },
    { path: "dashboard", component: DashboardComponent },
    { path: "categorias", component: CategoriasComponent }
];

@NgModule({
    imports: [NativeScriptRouterModule.forRoot(routes)],
    exports: [NativeScriptRouterModule]
})
export class AppRoutingModule { }

android manifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="__PACKAGE__"
    android:versionCode="1"
    android:versionName="1.0">

    <supports-screens
        android:smallScreens="true"
        android:normalScreens="true"
        android:largeScreens="true"
        android:xlargeScreens="true"/>

    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
    <uses-permission android:name="android.permission.INTERNET"/>

    <application
        android:name="com.tns.NativeScriptApplication"
        android:allowBackup="true"
        android:icon="@drawable/icon"
        android:label="@string/app_name"
        android:theme="@style/AppTheme">

        <activity
            android:name="com.tns.NativeScriptActivity"
            android:label="@string/title_activity_kimera"
            android:configChanges="keyboard|keyboardHidden|orientation|screenSize|smallestScreenSize|screenLayout|locale|uiMode"
            android:theme="@style/LaunchScreenTheme">

            <meta-data android:name="SET_THEME_ON_LAUNCH" android:resource="@style/AppTheme" />

            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name="com.tns.ErrorReportActivity"/>
    </application>
</manifest>

please help me, I would really appreciate it

[NathanWalker]

@Jean45612 Hi - I'd like you try something if you will.
Try removing this in your package.json:

"tns-core-modules": "~6.5.0",   // completely remove this

then download this custom .tgz of core modules: https://drive.google.com/file/d/17LHDMqyTLplYhLpq8oe1RRD-CjiK8D2I/view?usp=sharing

You can then drop it in root of your project and reference it like this:

"@nativescript/core": "file:nativescript-core-custom.tgz"

Also drop this in your devDependencies:

"terser-webpack-plugin": "~2.2.0"

Also replace your webpack.config.js with this:

https://gist.github.com/NathanWalker/b8ed7b749fde3069e88dbd7d56f5c509

Then clean with npx rimraf hooks node_modules platforms package-lock.json && npm i

Lemme know if that helps at all?

[Jean45612]

@NathanWalker Hello friend, I will try

[Jean45612]

@NathanWalker I got this and it no longer compiled

PS C:\xampp\htdocs\GAFStore> npx rimraf hooks node_modules platforms package-lock.json
npx: instaló 12 en 6.52s
PS C:\xampp\htdocs\GAFStore> npm i
npm WARN deprecated [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated [email protected]: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated [email protected]: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated [email protected]: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated [email protected]: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.

> [email protected] postinstall C:\xampp\htdocs\GAFStore\node_modules\ejs
> node ./postinstall.js

Thank you for installing EJS: built with the Jake JavaScript build tool (https://jakejs.com/)


> @nativescript/[email protected] postinstall C:\xampp\htdocs\GAFStore\node_modules\@nativescript\core
> node cli-hooks/postinstall.js


> [email protected] postinstall C:\xampp\htdocs\GAFStore\node_modules\nativescript-dev-webpack
> node postinstall.js

The current project contains a webpack.config.js file located at C:\xampp\htdocs\GAFStore\webpack.config.js that differs from the one in the new version of the nativescript-dev-webpack plugin located at C:\xampp\htdocs\GAFStore\node_modules\nativescript-dev-webpack\templates\webpack.angular.js. Some of the plugin features may not work as expected until you manually update the webpack.config.js file or automatically update it using "./node_modules/.bin/update-ns-webpack --configs" command.
The current project contains a tsconfig.tns.json file located at C:\xampp\htdocs\GAFStore\tsconfig.tns.json that differs from the one in the new version of the nativescript-dev-webpack plugin located at C:\xampp\htdocs\GAFStore\node_modules\nativescript-dev-webpack\templates\tsconfig.tns.json. Some of the plugin features may not work as expected until you manually update the tsconfig.tns.json file or automatically update it using "./node_modules/.bin/update-ns-webpack --configs" command.
Dev dependency: @angular/compiler-cli already added. Leaving version: ~9.1.0
Dev dependency: @ngtools/webpack already added. Leaving version: ~9.1.0
Some dependencies have already been added. If you want to force update them, please run "node_modules/.bin/update-ns-webpack".


> undefined postinstall C:\xampp\htdocs\GAFStore
> npm run ngcc


> @ ngcc C:\xampp\htdocs\GAFStore
> ngcc --properties es2015 module main --first-only

Compiling @angular/core : es2015 as esm2015
Compiling @angular/animations : es2015 as esm2015
Compiling @angular/compiler/testing : es2015 as esm2015
Compiling @angular/common : es2015 as esm2015
Compiling @angular/animations/browser : es2015 as esm2015
Compiling @angular/core/testing : es2015 as esm2015
Compiling @angular/platform-browser : es2015 as esm2015
Compiling @angular/common/http : es2015 as esm2015
Compiling @angular/router : es2015 as esm2015
Compiling @angular/forms : es2015 as esm2015
Compiling @angular/platform-browser-dynamic : es2015 as esm2015
Compiling @angular/platform-browser/animations : es2015 as esm2015
Compiling @angular/animations/browser/testing : es2015 as esm2015
Compiling @angular/common/testing : es2015 as esm2015
Compiling @angular/platform-browser/testing : es2015 as esm2015
Compiling @angular/common/http/testing : es2015 as esm2015
Compiling @nativescript/angular : main as commonjs
Compiling @angular/router/testing : es2015 as esm2015
Compiling @angular/platform-browser-dynamic/testing : es2015 as esm2015
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@~2.1.2 (node_modules\chokidar\node_modules\fsevents):
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.2.7 (node_modules\fork-ts-checker-webpack-plugin\node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN notsup Unsupported engine for [email protected]: wanted: {"node":"<8.10.0"} (current: {"node":"12.14.0","npm":"6.14.4"})
npm WARN notsup Not compatible with your version of node/npm: [email protected]
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.2.7 (node_modules\watchpack-chokidar2\node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN [email protected] requires a peer of tns-core-modules@>= 5 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of tns-core-modules@>=2.x|| >= 3.x || >=4.x || >=5.x but none is installed. You must install peer dependencies yourself.

added 772 packages from 470 contributors in 151.653s

10 packages are looking for funding
  run `npm fund` for details

PS C:\xampp\htdocs\GAFStore> tns run android --no-hmr
Searching for devices...
Copying template files...
Platform android successfully added. v6.5.1
Preparing project...
Compiling @angular/animations : module as esm5
Compiling @angular/core : module as esm5
Compiling @angular/animations/browser : module as esm5
Compiling @angular/animations/browser/testing : module as esm5
Compiling @angular/common : module as esm5
Compiling @angular/common/http : module as esm5
Compiling @angular/common/http/testing : module as esm5
Compiling @angular/core/testing : module as esm5
Compiling @angular/platform-browser : module as esm5
Compiling @angular/platform-browser-dynamic : module as esm5
Compiling @angular/platform-browser/testing : module as esm5
Compiling @angular/compiler/testing : module as esm5
Compiling @angular/platform-browser-dynamic/testing : module as esm5
Compiling @angular/common/testing : module as esm5
Compiling @angular/router : module as esm5
Compiling @angular/router/testing : module as esm5
Compiling @angular/platform-browser/animations : module as esm5
Compiling @angular/forms : module as esm5
File change detected. Starting incremental webpack compilation...

webpack is watching the files…

Hash: 98896920cb16044a72c2
Version: webpack 4.27.1
Time: 9109ms
Built at: 2020-06-24 1:03:52
              Asset       Size   Chunks             Chunk Names
          bundle.js   7.59 KiB   bundle  [emitted]  bundle
       package.json  112 bytes           [emitted]
         runtime.js   13.9 KiB  runtime  [emitted]  runtime
tns-java-classes.js    0 bytes           [emitted]
          vendor.js   5.26 MiB   vendor  [emitted]  vendor
Entrypoint bundle = runtime.js vendor.js bundle.js
[./app.css] 1.49 KiB {bundle} [built]
[./main.ts] 1.16 KiB {bundle} [built]
[./package.json] 107 bytes {bundle} [optional] [built]
    + 322 hidden modules

ERROR in src/app/components/dashboard/dashboard.component.ts:2:24 - error TS2307: Cannot find module 'tns-core-modules/utils/utils'.

2 import * as utils from "tns-core-modules/utils/utils";
                         ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
src/app/components/index/index.component.ts:2:22 - error TS2307: Cannot find module 'tns-core-modules/ui/page'.

2 import { Page } from "tns-core-modules/ui/page";
                       ~~~~~~~~~~~~~~~~~~~~~~~~~~

Webpack compilation complete. Watching for file changes.
Webpack build done!
Project successfully prepared (android)
Building project...
Gradle build...
         + setting applicationId
         + applying user-defined configuration from C:\xampp\htdocs\GAFStore\App_Resources\Android\app.gradle
         + using android X library androidx.legacy:legacy-support-v4:1.0.0
         + adding nativescript runtime package dependency: nativescript-optimized-with-inspector
         + adding aar plugin dependency: C:\xampp\htdocs\GAFStore\node_modules\nativescript-advanced-permissions\platforms\android\nativescript_advanced_permissions.aar

Error executing Static Binding Generator: Class not found org.nativescript.widgets.image.Worker.OnImageLoadedListener
Detailed log here: C:\xampp\htdocs\GAFStore\platforms\android\build-tools\runSbg.log

Unable to apply changes on device: c62cd03a. Error is: Command gradlew.bat failed with exit code 1.

[NathanWalker]

Excellent thanks! Ok update this:

import * as utils from "tns-core-modules/utils/utils";

to this:

import * as utils from '@nativescript/core/utils/utils';

And this:

import { Page } from "tns-core-modules/ui/page";

to this:

import { Page } from "@nativescript/core";

[NathanWalker]

If you still have trouble I'd be happy to help - easiest way is for me to submit a PR to your project and if it's private repo you can invite NathanWalker to it temporarily and can help get you straightened out and then can remove me 👍

[Jean45612]

@NathanWalker ok friend, in a moment I upload it, thank you very much

[NathanWalker]

👍 hitting bed here on west coast but can take peek tomorrow, just drop a way for me to access.

[Jean45612]

@NathanWalker ok, I already added you to the repository, the name of the repository is GAFStore thank you very much

[NathanWalker]

@Jean45612 that's great news, I was going to ask if you had tried that. Does that suit your needs and your case? If so you might close the issue at your convenience, thanks for trying the above btw. I would go that direction with using @nativescript/core as {N} 7.0 will go entirely in that direction so would be future proofing while at it.

[Jean45612]

@NathanWalker hi friend, I solved it using this
application.android.on(application.AndroidApplication.activityBackPressedEvent, (args: any) => { args.cancel = true; exit(); });

exit is a function of a nativescript plugin

[Jean45612]

@ Jean45612 esa es una gran noticia, iba a preguntarte si lo habías intentado. ¿Se adapta eso a tus necesidades y a tu caso? Si es así, puede cerrar el problema a su conveniencia, gracias por intentar lo anterior por cierto. Yo iría en esa dirección con el uso de @nativescript/core{N} 7.0 iría completamente en esa dirección, por lo que sería una prueba futura mientras lo hago.

yes, adapts to my needs, thank you very match