diff --git a/npm/ng-packs/angular.json b/npm/ng-packs/angular.json
index a06c34c90e..f1c7d18a46 100644
--- a/npm/ng-packs/angular.json
+++ b/npm/ng-packs/angular.json
@@ -17,11 +17,9 @@
           }
         },
         "test": {
-          "builder": "@angular-devkit/build-angular:karma",
+          "builder": "@angular-builders/jest:run",
           "options": {
-            "main": "packages/core/src/test.ts",
-            "tsConfig": "packages/core/tsconfig.spec.json",
-            "karmaConfig": "packages/core/karma.conf.js"
+            "coverage": true
           }
         },
         "lint": {
@@ -48,11 +46,9 @@
           }
         },
         "test": {
-          "builder": "@angular-devkit/build-angular:karma",
+          "builder": "@angular-builders/jest:run",
           "options": {
-            "main": "packages/theme-shared/src/test.ts",
-            "tsConfig": "packages/theme-shared/tsconfig.spec.json",
-            "karmaConfig": "packages/theme-shared/karma.conf.js"
+            "coverage": true
           }
         },
         "lint": {
@@ -532,25 +528,9 @@
         "lint": {
           "builder": "@angular-devkit/build-angular:tslint",
           "options": {
-            "tsConfig": [
-              "apps/dev-app/tsconfig.app.json",
-              "apps/dev-app/tsconfig.spec.json",
-              "apps/dev-app/e2e/tsconfig.json"
-            ],
+            "tsConfig": ["apps/dev-app/tsconfig.app.json", "apps/dev-app/tsconfig.spec.json"],
             "exclude": ["**/node_modules/**"]
           }
-        },
-        "e2e": {
-          "builder": "@angular-devkit/build-angular:protractor",
-          "options": {
-            "protractorConfig": "apps/dev-app/e2e/protractor.conf.js",
-            "devServerTarget": "dev-app:serve"
-          },
-          "configurations": {
-            "production": {
-              "devServerTarget": "dev-app:serve:production"
-            }
-          }
         }
       }
     }
diff --git a/npm/ng-packs/apps/dev-app/e2e/protractor.conf.js b/npm/ng-packs/apps/dev-app/e2e/protractor.conf.js
deleted file mode 100644
index 5c23d8477d..0000000000
--- a/npm/ng-packs/apps/dev-app/e2e/protractor.conf.js
+++ /dev/null
@@ -1,30 +0,0 @@
-// @ts-check
-// Protractor configuration file, see link for more information
-// https://github.com/angular/protractor/blob/master/lib/config.ts
-
-const { SpecReporter } = require('jasmine-spec-reporter');
-
-/**
- * @type { import("protractor").Config }
- */
-exports.config = {
-  allScriptsTimeout: 11000,
-  specs: ['./src/**/*.e2e-spec.ts'],
-  capabilities: {
-    browserName: 'chrome',
-  },
-  directConnect: true,
-  baseUrl: 'http://localhost:4200/',
-  framework: 'jasmine',
-  jasmineNodeOpts: {
-    showColors: true,
-    defaultTimeoutInterval: 30000,
-    print: function() {},
-  },
-  onPrepare() {
-    require('ts-node').register({
-      project: require('path').join(__dirname, './tsconfig.json'),
-    });
-    jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
-  },
-};
diff --git a/npm/ng-packs/apps/dev-app/e2e/src/app.e2e-spec.ts b/npm/ng-packs/apps/dev-app/e2e/src/app.e2e-spec.ts
deleted file mode 100644
index 96edba0042..0000000000
--- a/npm/ng-packs/apps/dev-app/e2e/src/app.e2e-spec.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import { AppPage } from './app.po';
-import { browser, logging } from 'protractor';
-
-describe('workspace-project App', () => {
-  let page: AppPage;
-
-  beforeEach(() => {
-    page = new AppPage();
-  });
-
-  it('should display welcome message', () => {
-    page.navigateTo();
-    expect(page.getTitleText()).toEqual('dev-app app is running!');
-  });
-
-  afterEach(async () => {
-    // Assert that there are no errors emitted from the browser
-    const logs = await browser
-      .manage()
-      .logs()
-      .get(logging.Type.BROWSER);
-    expect(logs).not.toContain(
-      jasmine.objectContaining({
-        level: logging.Level.SEVERE,
-      } as logging.Entry),
-    );
-  });
-});
diff --git a/npm/ng-packs/apps/dev-app/e2e/src/app.po.ts b/npm/ng-packs/apps/dev-app/e2e/src/app.po.ts
deleted file mode 100644
index b8498c26f2..0000000000
--- a/npm/ng-packs/apps/dev-app/e2e/src/app.po.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import { browser, by, element } from 'protractor';
-
-export class AppPage {
-  navigateTo() {
-    return browser.get(browser.baseUrl) as Promise<any>;
-  }
-
-  getTitleText() {
-    return element(by.css('app-root .content span')).getText() as Promise<string>;
-  }
-}
diff --git a/npm/ng-packs/apps/dev-app/e2e/tsconfig.json b/npm/ng-packs/apps/dev-app/e2e/tsconfig.json
deleted file mode 100644
index 201351434e..0000000000
--- a/npm/ng-packs/apps/dev-app/e2e/tsconfig.json
+++ /dev/null
@@ -1,9 +0,0 @@
-{
-  "extends": "../../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../../out-tsc/e2e",
-    "module": "commonjs",
-    "target": "es5",
-    "types": ["jasmine", "jasminewd2", "node"]
-  }
-}
diff --git a/npm/ng-packs/apps/dev-app/karma.conf.js b/npm/ng-packs/apps/dev-app/karma.conf.js
deleted file mode 100644
index 54492af159..0000000000
--- a/npm/ng-packs/apps/dev-app/karma.conf.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function(config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma'),
-    ],
-    client: {
-      clearContext: false, // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../coverage/dev-app'),
-      reports: ['html', 'lcovonly', 'text-summary'],
-      fixWebpackSourcePaths: true,
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true,
-  });
-};
diff --git a/npm/ng-packs/apps/dev-app/src/test.ts b/npm/ng-packs/apps/dev-app/src/test.ts
deleted file mode 100644
index da9049dc63..0000000000
--- a/npm/ng-packs/apps/dev-app/src/test.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
-
-declare const require: any;
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting());
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);
diff --git a/npm/ng-packs/apps/dev-app/tsconfig.spec.json b/npm/ng-packs/apps/dev-app/tsconfig.spec.json
index 8eec07d40a..e487d98612 100644
--- a/npm/ng-packs/apps/dev-app/tsconfig.spec.json
+++ b/npm/ng-packs/apps/dev-app/tsconfig.spec.json
@@ -2,8 +2,8 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "outDir": "../../out-tsc/spec",
-    "types": ["jasmine", "node"]
+    "types": ["node", "jest"]
   },
-  "files": ["src/test.ts", "src/polyfills.ts"],
+  "files": ["src/polyfills.ts"],
   "include": ["src/**/*.spec.ts", "src/**/*.d.ts"]
 }
diff --git a/npm/ng-packs/jest.config.js b/npm/ng-packs/jest.config.js
new file mode 100644
index 0000000000..580ba0bcdf
--- /dev/null
+++ b/npm/ng-packs/jest.config.js
@@ -0,0 +1,19 @@
+module.exports = {
+  globals: {
+    'ts-jest': {
+      allowSyntheticDefaultImports: true,
+    },
+  },
+  transform: {
+    '^.+\\.(ts|js|html)$': 'ts-jest',
+  },
+  moduleFileExtensions: ['ts', 'js', 'html'],
+  coverageDirectory: '<rootDir>/coverage',
+  coverageReporters: ['html'],
+  preset: 'jest-preset-angular',
+  setupFilesAfterEnv: ['<rootDir>/test-setup.ts'],
+  snapshotSerializers: [
+    'jest-preset-angular/AngularSnapshotSerializer.js',
+    'jest-preset-angular/HTMLCommentSerializer.js',
+  ],
+};
diff --git a/npm/ng-packs/package.json b/npm/ng-packs/package.json
index 5e4a254863..f432ab97d9 100644
--- a/npm/ng-packs/package.json
+++ b/npm/ng-packs/package.json
@@ -2,6 +2,7 @@
   "scripts": {
     "start": "ng serve dev-app",
     "ng": "ng",
+    "test": "ng test",
     "symlink": "symlink",
     "abpng": "abpng",
     "commit": "git-cz && node scripts/push.js",
@@ -14,6 +15,7 @@
     "@abp/ng.theme.shared": "^0.9.0",
     "@angular-devkit/build-angular": "~0.803.6",
     "@angular-devkit/build-ng-packagr": "~0.803.6",
+    "@angular-builders/jest": "^8.2.0",
     "@angular/animations": "~8.2.8",
     "@angular/cdk": "^8.2.2",
     "@angular/cli": "~8.3.6",
@@ -27,14 +29,13 @@
     "@angular/platform-browser-dynamic": "~8.2.8",
     "@angular/router": "~8.2.8",
     "@ng-bootstrap/ng-bootstrap": "^5.1.0",
-    "@ngneat/spectator": "^4.3.2",
+    "@ngneat/spectator": "^4.4.0",
     "@ngx-validate/core": "^0.0.5",
     "@ngxs/devtools-plugin": "^3.5.1",
     "@ngxs/router-plugin": "^3.5.1",
     "@ngxs/storage-plugin": "^3.5.1",
     "@ngxs/store": "^3.5.1",
-    "@types/jasmine": "~3.3.8",
-    "@types/jasminewd2": "~2.0.3",
+    "@types/jest": "^24.0.18",
     "@types/node": "~8.9.4",
     "angular-oauth2-oidc": "^8.0.1",
     "bootstrap": "^4.3.1",
@@ -43,15 +44,10 @@
     "cz-conventional-changelog": "3.0.2",
     "font-awesome": "^4.7.0",
     "husky": "^3.0.7",
-    "jasmine-core": "~3.4.0",
-    "jasmine-spec-reporter": "~4.2.1",
+    "jest": "^24.9.0",
+    "jest-preset-angular": "^7.1.1",
     "just-clone": "3.1.0",
     "just-compare": "^1.3.0",
-    "karma": "~4.1.0",
-    "karma-chrome-launcher": "~2.2.0",
-    "karma-coverage-istanbul-reporter": "~2.0.1",
-    "karma-jasmine": "~2.0.1",
-    "karma-jasmine-html-reporter": "^1.4.0",
     "lint-staged": "^9.4.0",
     "ng-packagr": "^5.5.0",
     "ngx-perfect-scrollbar": "^8.0.0",
@@ -70,6 +66,7 @@
     "zone.js": "~0.9.1"
   },
   "dependencies": {
+    "@briebug/jest": "^1.3.1",
     "tslib": "^1.10.0"
   },
   "config": {
diff --git a/npm/ng-packs/packages/account-config/karma.conf.js b/npm/ng-packs/packages/account-config/karma.conf.js
deleted file mode 100644
index e74978b4ca..0000000000
--- a/npm/ng-packs/packages/account-config/karma.conf.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client: {
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../coverage/account-config'),
-      reports: ['html', 'lcovonly', 'text-summary'],
-      fixWebpackSourcePaths: true
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true
-  });
-};
diff --git a/npm/ng-packs/packages/account-config/src/test.ts b/npm/ng-packs/packages/account-config/src/test.ts
deleted file mode 100644
index 978c64fb83..0000000000
--- a/npm/ng-packs/packages/account-config/src/test.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: any;
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);
diff --git a/npm/ng-packs/packages/account-config/tsconfig.spec.json b/npm/ng-packs/packages/account-config/tsconfig.spec.json
index 16da33db07..ebce9b9fdb 100644
--- a/npm/ng-packs/packages/account-config/tsconfig.spec.json
+++ b/npm/ng-packs/packages/account-config/tsconfig.spec.json
@@ -2,16 +2,8 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine",
-      "node"
-    ]
+    "types": ["node", "jest"]
   },
-  "files": [
-    "src/test.ts"
-  ],
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
+  "files": [],
+  "include": ["**/*.spec.ts", "**/*.d.ts"]
 }
diff --git a/npm/ng-packs/packages/account/karma.conf.js b/npm/ng-packs/packages/account/karma.conf.js
deleted file mode 100644
index ccfa764753..0000000000
--- a/npm/ng-packs/packages/account/karma.conf.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client: {
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../coverage/account'),
-      reports: ['html', 'lcovonly'],
-      fixWebpackSourcePaths: true
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true
-  });
-};
diff --git a/npm/ng-packs/packages/account/src/test.ts b/npm/ng-packs/packages/account/src/test.ts
deleted file mode 100644
index 978c64fb83..0000000000
--- a/npm/ng-packs/packages/account/src/test.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: any;
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);
diff --git a/npm/ng-packs/packages/account/tsconfig.spec.json b/npm/ng-packs/packages/account/tsconfig.spec.json
index 16da33db07..ebce9b9fdb 100644
--- a/npm/ng-packs/packages/account/tsconfig.spec.json
+++ b/npm/ng-packs/packages/account/tsconfig.spec.json
@@ -2,16 +2,8 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine",
-      "node"
-    ]
+    "types": ["node", "jest"]
   },
-  "files": [
-    "src/test.ts"
-  ],
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
+  "files": [],
+  "include": ["**/*.spec.ts", "**/*.d.ts"]
 }
diff --git a/npm/ng-packs/packages/core/jest.config.js b/npm/ng-packs/packages/core/jest.config.js
new file mode 100644
index 0000000000..2e294cf4e6
--- /dev/null
+++ b/npm/ng-packs/packages/core/jest.config.js
@@ -0,0 +1,10 @@
+const { pathsToModuleNameMapper } = require('ts-jest/utils');
+const { compilerOptions } = require('./tsconfig.spec');
+const jestConfig = require('../../jest.config');
+
+module.exports = {
+  ...jestConfig,
+  name: 'core',
+  moduleNameMapper: pathsToModuleNameMapper(compilerOptions.paths /*, { prefix: '<rootDir>/' } */),
+  'ts-jest': { allowSyntheticDefaultImports: true },
+};
diff --git a/npm/ng-packs/packages/core/karma.conf.js b/npm/ng-packs/packages/core/karma.conf.js
deleted file mode 100644
index 46e0cb1d0a..0000000000
--- a/npm/ng-packs/packages/core/karma.conf.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client: {
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../coverage/core'),
-      reports: ['html', 'lcovonly'],
-      fixWebpackSourcePaths: true
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true
-  });
-};
diff --git a/npm/ng-packs/packages/core/src/lib/services/rest.service.ts b/npm/ng-packs/packages/core/src/lib/services/rest.service.ts
index 611b208b35..e3c99bac2c 100644
--- a/npm/ng-packs/packages/core/src/lib/services/rest.service.ts
+++ b/npm/ng-packs/packages/core/src/lib/services/rest.service.ts
@@ -2,7 +2,7 @@ import { HttpClient, HttpRequest } from '@angular/common/http';
 import { Injectable } from '@angular/core';
 import { Store } from '@ngxs/store';
 import { Observable, throwError } from 'rxjs';
-import { catchError, take } from 'rxjs/operators';
+import { catchError, take, tap } from 'rxjs/operators';
 import { RestOccurError } from '../actions/rest.actions';
 import { Rest } from '../models/rest';
 import { ConfigState } from '../states/config.state';
@@ -21,10 +21,11 @@ export class RestService {
 
   request<T, R>(request: HttpRequest<T> | Rest.Request<T>, config: Rest.Config = {}, api?: string): Observable<R> {
     const { observe = Rest.Observe.Body, skipHandleError } = config;
-    const url = api || this.store.selectSnapshot(ConfigState.getApiUrl()) + request.url;
+    const url = (api || this.store.selectSnapshot(ConfigState.getApiUrl())) + request.url;
     const { method, ...options } = request;
+
     return this.http.request<T>(method, url, { observe, ...options } as any).pipe(
-      observe === Rest.Observe.Body ? take(1) : null,
+      observe === Rest.Observe.Body ? take(1) : tap(),
       catchError(err => {
         if (skipHandleError) {
           return throwError(err);
diff --git a/npm/ng-packs/packages/core/src/lib/tests/config.plugin.spec.ts b/npm/ng-packs/packages/core/src/lib/tests/config.plugin.spec.ts
index 293dd4bf79..da851a5369 100644
--- a/npm/ng-packs/packages/core/src/lib/tests/config.plugin.spec.ts
+++ b/npm/ng-packs/packages/core/src/lib/tests/config.plugin.spec.ts
@@ -1,14 +1,14 @@
 import { RouterTestingModule } from '@angular/router/testing';
-import { createServiceFactory, SpectatorService } from '@ngneat/spectator';
-import { NGXS_PLUGINS, NgxsModule, InitState, Store } from '@ngxs/store';
+import { createServiceFactory, SpectatorService } from '@ngneat/spectator/jest';
+import { NgxsModule, NGXS_PLUGINS, Store } from '@ngxs/store';
 import { environment } from '../../../../../apps/dev-app/src/environments/environment';
 import { LAYOUTS } from '../../../../theme-basic/src/public-api';
-import { ABP } from '../models';
-import { ConfigPlugin, NGXS_CONFIG_PLUGIN_OPTIONS } from '../plugins';
 import { RouterOutletComponent } from '../components';
-import { ConfigState } from '../states';
 import { CoreModule } from '../core.module';
 import { eLayoutType } from '../enums/common';
+import { ABP } from '../models';
+import { ConfigPlugin, NGXS_CONFIG_PLUGIN_OPTIONS } from '../plugins';
+import { ConfigState } from '../states';
 import { addAbpRoutes } from '../utils';
 
 addAbpRoutes([
diff --git a/npm/ng-packs/packages/core/src/lib/tests/dynamic-layout.component.spec.ts b/npm/ng-packs/packages/core/src/lib/tests/dynamic-layout.component.spec.ts
index bfd2762760..d2ac2c3c50 100644
--- a/npm/ng-packs/packages/core/src/lib/tests/dynamic-layout.component.spec.ts
+++ b/npm/ng-packs/packages/core/src/lib/tests/dynamic-layout.component.spec.ts
@@ -1,6 +1,6 @@
 import { Component } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { createRoutingFactory, SpectatorRouting, SpyObject } from '@ngneat/spectator';
+import { createRoutingFactory, SpectatorRouting, SpyObject } from '@ngneat/spectator/jest';
 import { NgxsModule, Store } from '@ngxs/store';
 import { OAuthService } from 'angular-oauth2-oidc';
 import { NgxsResetPluginModule, StateOverwrite } from 'ngxs-reset-plugin';
diff --git a/npm/ng-packs/packages/core/src/lib/tests/locale.provider.spec.ts b/npm/ng-packs/packages/core/src/lib/tests/locale.provider.spec.ts
index e82e89d4a0..b5c788635d 100644
--- a/npm/ng-packs/packages/core/src/lib/tests/locale.provider.spec.ts
+++ b/npm/ng-packs/packages/core/src/lib/tests/locale.provider.spec.ts
@@ -1,5 +1,5 @@
 import { Component, LOCALE_ID } from '@angular/core';
-import { createRoutingFactory, SpectatorHost, SpectatorRouting } from '@ngneat/spectator';
+import { createRoutingFactory, SpectatorHost, SpectatorRouting } from '@ngneat/spectator/jest';
 import { LocalizationService } from '../services';
 import { LocaleProvider, LocaleId } from '../providers';
 import localesMapping from '../constants/different-locales';
@@ -24,7 +24,7 @@ describe('LocaleProvider', () => {
   });
 
   describe('#LOCALE_ID', () => {
-    it('should equal to localizationService.currentLang', async () => {
+    test('should equal to currentLang', async () => {
       spectator = createComponent();
       const localizationService = spectator.get(LocalizationService);
 
diff --git a/npm/ng-packs/packages/core/src/lib/tests/localization.service.spec.ts b/npm/ng-packs/packages/core/src/lib/tests/localization.service.spec.ts
index 8c0dbebb40..7f613543d6 100644
--- a/npm/ng-packs/packages/core/src/lib/tests/localization.service.spec.ts
+++ b/npm/ng-packs/packages/core/src/lib/tests/localization.service.spec.ts
@@ -1,5 +1,5 @@
 import { Router } from '@angular/router';
-import { createServiceFactory, SpectatorService, SpyObject } from '@ngneat/spectator';
+import { createServiceFactory, SpectatorService, SpyObject } from '@ngneat/spectator/jest';
 import { Store } from '@ngxs/store';
 import { Observable, of } from 'rxjs';
 import { LocalizationService } from '../services/localization.service';
diff --git a/npm/ng-packs/packages/core/src/lib/tests/rest.service.spec.ts b/npm/ng-packs/packages/core/src/lib/tests/rest.service.spec.ts
new file mode 100644
index 0000000000..f91fbcef3e
--- /dev/null
+++ b/npm/ng-packs/packages/core/src/lib/tests/rest.service.spec.ts
@@ -0,0 +1,22 @@
+import { createHttpFactory, HttpMethod, SpectatorHttp, SpyObject } from '@ngneat/spectator/jest';
+import { RestService } from '../services/rest.service';
+import { Store } from '@ngxs/store';
+
+describe('HttpClient testing', () => {
+  let spectator: SpectatorHttp<RestService>;
+  let store: SpyObject<Store>;
+  const api = 'https://abp.io';
+
+  const createHttp = createHttpFactory({ dataService: RestService, mocks: [Store] });
+
+  beforeEach(() => {
+    spectator = createHttp();
+    store = spectator.get(Store);
+    store.selectSnapshot.andReturn(api);
+  });
+
+  test('should send a GET request with params', () => {
+    spectator.service.request({ method: HttpMethod.GET, url: '/test', params: { id: 1 } }).subscribe();
+    spectator.expectOne(api + '/test?id=1', HttpMethod.GET);
+  });
+});
diff --git a/npm/ng-packs/packages/core/src/lib/tests/router-outlet.component.spec.ts b/npm/ng-packs/packages/core/src/lib/tests/router-outlet.component.spec.ts
index 6707432c03..b7e79b9c08 100644
--- a/npm/ng-packs/packages/core/src/lib/tests/router-outlet.component.spec.ts
+++ b/npm/ng-packs/packages/core/src/lib/tests/router-outlet.component.spec.ts
@@ -1,4 +1,4 @@
-import { Spectator, createComponentFactory, createHostFactory } from '@ngneat/spectator';
+import { Spectator, createComponentFactory, createHostFactory } from '@ngneat/spectator/jest';
 import { RouterTestingModule } from '@angular/router/testing';
 import { RouterOutletComponent } from '../components/router-outlet.component';
 
@@ -8,7 +8,6 @@ describe('RouterOutletComponent', () => {
 
   it('should have a router-outlet element', () => {
     spectator = createHost('<abp-router-outlet></abp-router-outlet>');
-    console.log((spectator.debugElement.nativeElement as HTMLElement).children);
     expect((spectator.debugElement.nativeElement as HTMLElement).children.length).toBe(1);
     expect((spectator.debugElement.nativeElement as HTMLElement).children[0].tagName).toBe('ROUTER-OUTLET');
   });
diff --git a/npm/ng-packs/packages/core/src/test.ts b/npm/ng-packs/packages/core/src/test.ts
deleted file mode 100644
index 978c64fb83..0000000000
--- a/npm/ng-packs/packages/core/src/test.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: any;
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);
diff --git a/npm/ng-packs/packages/core/tsconfig.spec.json b/npm/ng-packs/packages/core/tsconfig.spec.json
index b86d4b4cce..d2fb1e6cb3 100644
--- a/npm/ng-packs/packages/core/tsconfig.spec.json
+++ b/npm/ng-packs/packages/core/tsconfig.spec.json
@@ -1,13 +1,14 @@
 {
   "extends": "../../tsconfig.json",
   "compilerOptions": {
-    "outDir": "../../out-tsc/spec",
-    "types": ["jasmine", "node"],
+    "emitDecoratorMetadata": true,
+    "esModuleInterop": true,
+    "outDir": "../../dist/out-tsc",
+    "module": "commonjs",
+    "types": ["jest", "node"],
     "paths": {
-      "@abp/ng.core": ["packages/core/src/public-api.ts"],
       "@abp/ng.core/*": ["packages/core/src/lib/*"]
     }
   },
-  "files": ["src/test.ts"],
   "include": ["**/*.spec.ts", "**/*.d.ts"]
 }
diff --git a/npm/ng-packs/packages/feature-management/karma.conf.js b/npm/ng-packs/packages/feature-management/karma.conf.js
deleted file mode 100644
index 65f905a52e..0000000000
--- a/npm/ng-packs/packages/feature-management/karma.conf.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client: {
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../coverage/feature-management'),
-      reports: ['html', 'lcovonly', 'text-summary'],
-      fixWebpackSourcePaths: true
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true
-  });
-};
diff --git a/npm/ng-packs/packages/feature-management/src/test.ts b/npm/ng-packs/packages/feature-management/src/test.ts
deleted file mode 100644
index 978c64fb83..0000000000
--- a/npm/ng-packs/packages/feature-management/src/test.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: any;
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);
diff --git a/npm/ng-packs/packages/feature-management/tsconfig.spec.json b/npm/ng-packs/packages/feature-management/tsconfig.spec.json
index 16da33db07..ebce9b9fdb 100644
--- a/npm/ng-packs/packages/feature-management/tsconfig.spec.json
+++ b/npm/ng-packs/packages/feature-management/tsconfig.spec.json
@@ -2,16 +2,8 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine",
-      "node"
-    ]
+    "types": ["node", "jest"]
   },
-  "files": [
-    "src/test.ts"
-  ],
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
+  "files": [],
+  "include": ["**/*.spec.ts", "**/*.d.ts"]
 }
diff --git a/npm/ng-packs/packages/identity-config/karma.conf.js b/npm/ng-packs/packages/identity-config/karma.conf.js
deleted file mode 100644
index 47f6e498d2..0000000000
--- a/npm/ng-packs/packages/identity-config/karma.conf.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client: {
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../coverage/identity-config'),
-      reports: ['html', 'lcovonly', 'text-summary'],
-      fixWebpackSourcePaths: true
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true
-  });
-};
diff --git a/npm/ng-packs/packages/identity-config/src/test.ts b/npm/ng-packs/packages/identity-config/src/test.ts
deleted file mode 100644
index 978c64fb83..0000000000
--- a/npm/ng-packs/packages/identity-config/src/test.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: any;
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);
diff --git a/npm/ng-packs/packages/identity-config/tsconfig.spec.json b/npm/ng-packs/packages/identity-config/tsconfig.spec.json
index 16da33db07..ebce9b9fdb 100644
--- a/npm/ng-packs/packages/identity-config/tsconfig.spec.json
+++ b/npm/ng-packs/packages/identity-config/tsconfig.spec.json
@@ -2,16 +2,8 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine",
-      "node"
-    ]
+    "types": ["node", "jest"]
   },
-  "files": [
-    "src/test.ts"
-  ],
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
+  "files": [],
+  "include": ["**/*.spec.ts", "**/*.d.ts"]
 }
diff --git a/npm/ng-packs/packages/identity/karma.conf.js b/npm/ng-packs/packages/identity/karma.conf.js
deleted file mode 100644
index 96fe6c9293..0000000000
--- a/npm/ng-packs/packages/identity/karma.conf.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client: {
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../coverage/identity'),
-      reports: ['html', 'lcovonly'],
-      fixWebpackSourcePaths: true
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true
-  });
-};
diff --git a/npm/ng-packs/packages/identity/src/test.ts b/npm/ng-packs/packages/identity/src/test.ts
deleted file mode 100644
index 978c64fb83..0000000000
--- a/npm/ng-packs/packages/identity/src/test.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: any;
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);
diff --git a/npm/ng-packs/packages/identity/tsconfig.spec.json b/npm/ng-packs/packages/identity/tsconfig.spec.json
index 16da33db07..ebce9b9fdb 100644
--- a/npm/ng-packs/packages/identity/tsconfig.spec.json
+++ b/npm/ng-packs/packages/identity/tsconfig.spec.json
@@ -2,16 +2,8 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine",
-      "node"
-    ]
+    "types": ["node", "jest"]
   },
-  "files": [
-    "src/test.ts"
-  ],
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
+  "files": [],
+  "include": ["**/*.spec.ts", "**/*.d.ts"]
 }
diff --git a/npm/ng-packs/packages/permission-management/karma.conf.js b/npm/ng-packs/packages/permission-management/karma.conf.js
deleted file mode 100644
index 9bbd5907ef..0000000000
--- a/npm/ng-packs/packages/permission-management/karma.conf.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client: {
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../coverage/permission-management'),
-      reports: ['html', 'lcovonly'],
-      fixWebpackSourcePaths: true
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true
-  });
-};
diff --git a/npm/ng-packs/packages/permission-management/src/test.ts b/npm/ng-packs/packages/permission-management/src/test.ts
deleted file mode 100644
index 978c64fb83..0000000000
--- a/npm/ng-packs/packages/permission-management/src/test.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: any;
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);
diff --git a/npm/ng-packs/packages/permission-management/tsconfig.spec.json b/npm/ng-packs/packages/permission-management/tsconfig.spec.json
index 16da33db07..ebce9b9fdb 100644
--- a/npm/ng-packs/packages/permission-management/tsconfig.spec.json
+++ b/npm/ng-packs/packages/permission-management/tsconfig.spec.json
@@ -2,16 +2,8 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine",
-      "node"
-    ]
+    "types": ["node", "jest"]
   },
-  "files": [
-    "src/test.ts"
-  ],
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
+  "files": [],
+  "include": ["**/*.spec.ts", "**/*.d.ts"]
 }
diff --git a/npm/ng-packs/packages/setting-management-config/karma.conf.js b/npm/ng-packs/packages/setting-management-config/karma.conf.js
deleted file mode 100644
index 7ff4863cb0..0000000000
--- a/npm/ng-packs/packages/setting-management-config/karma.conf.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client: {
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../coverage/setting-management-config'),
-      reports: ['html', 'lcovonly', 'text-summary'],
-      fixWebpackSourcePaths: true
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true
-  });
-};
diff --git a/npm/ng-packs/packages/setting-management-config/src/test.ts b/npm/ng-packs/packages/setting-management-config/src/test.ts
deleted file mode 100644
index 978c64fb83..0000000000
--- a/npm/ng-packs/packages/setting-management-config/src/test.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: any;
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);
diff --git a/npm/ng-packs/packages/setting-management-config/tsconfig.spec.json b/npm/ng-packs/packages/setting-management-config/tsconfig.spec.json
index 16da33db07..ebce9b9fdb 100644
--- a/npm/ng-packs/packages/setting-management-config/tsconfig.spec.json
+++ b/npm/ng-packs/packages/setting-management-config/tsconfig.spec.json
@@ -2,16 +2,8 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine",
-      "node"
-    ]
+    "types": ["node", "jest"]
   },
-  "files": [
-    "src/test.ts"
-  ],
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
+  "files": [],
+  "include": ["**/*.spec.ts", "**/*.d.ts"]
 }
diff --git a/npm/ng-packs/packages/setting-management/karma.conf.js b/npm/ng-packs/packages/setting-management/karma.conf.js
deleted file mode 100644
index 51ccc0578d..0000000000
--- a/npm/ng-packs/packages/setting-management/karma.conf.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client: {
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../coverage/setting-management'),
-      reports: ['html', 'lcovonly', 'text-summary'],
-      fixWebpackSourcePaths: true
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true
-  });
-};
diff --git a/npm/ng-packs/packages/setting-management/src/test.ts b/npm/ng-packs/packages/setting-management/src/test.ts
deleted file mode 100644
index 978c64fb83..0000000000
--- a/npm/ng-packs/packages/setting-management/src/test.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: any;
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);
diff --git a/npm/ng-packs/packages/setting-management/tsconfig.spec.json b/npm/ng-packs/packages/setting-management/tsconfig.spec.json
index 16da33db07..ebce9b9fdb 100644
--- a/npm/ng-packs/packages/setting-management/tsconfig.spec.json
+++ b/npm/ng-packs/packages/setting-management/tsconfig.spec.json
@@ -2,16 +2,8 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine",
-      "node"
-    ]
+    "types": ["node", "jest"]
   },
-  "files": [
-    "src/test.ts"
-  ],
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
+  "files": [],
+  "include": ["**/*.spec.ts", "**/*.d.ts"]
 }
diff --git a/npm/ng-packs/packages/tenant-management-config/karma.conf.js b/npm/ng-packs/packages/tenant-management-config/karma.conf.js
deleted file mode 100644
index 850929cc06..0000000000
--- a/npm/ng-packs/packages/tenant-management-config/karma.conf.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client: {
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../coverage/tenant-management-config'),
-      reports: ['html', 'lcovonly', 'text-summary'],
-      fixWebpackSourcePaths: true
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true
-  });
-};
diff --git a/npm/ng-packs/packages/tenant-management-config/src/test.ts b/npm/ng-packs/packages/tenant-management-config/src/test.ts
deleted file mode 100644
index 978c64fb83..0000000000
--- a/npm/ng-packs/packages/tenant-management-config/src/test.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: any;
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);
diff --git a/npm/ng-packs/packages/tenant-management-config/tsconfig.spec.json b/npm/ng-packs/packages/tenant-management-config/tsconfig.spec.json
index 16da33db07..ebce9b9fdb 100644
--- a/npm/ng-packs/packages/tenant-management-config/tsconfig.spec.json
+++ b/npm/ng-packs/packages/tenant-management-config/tsconfig.spec.json
@@ -2,16 +2,8 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine",
-      "node"
-    ]
+    "types": ["node", "jest"]
   },
-  "files": [
-    "src/test.ts"
-  ],
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
+  "files": [],
+  "include": ["**/*.spec.ts", "**/*.d.ts"]
 }
diff --git a/npm/ng-packs/packages/tenant-management/karma.conf.js b/npm/ng-packs/packages/tenant-management/karma.conf.js
deleted file mode 100644
index eb6cfa24b4..0000000000
--- a/npm/ng-packs/packages/tenant-management/karma.conf.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client: {
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../coverage/tenant-management'),
-      reports: ['html', 'lcovonly', 'text-summary'],
-      fixWebpackSourcePaths: true
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true
-  });
-};
diff --git a/npm/ng-packs/packages/tenant-management/src/test.ts b/npm/ng-packs/packages/tenant-management/src/test.ts
deleted file mode 100644
index 978c64fb83..0000000000
--- a/npm/ng-packs/packages/tenant-management/src/test.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: any;
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);
diff --git a/npm/ng-packs/packages/tenant-management/tsconfig.spec.json b/npm/ng-packs/packages/tenant-management/tsconfig.spec.json
index 16da33db07..ebce9b9fdb 100644
--- a/npm/ng-packs/packages/tenant-management/tsconfig.spec.json
+++ b/npm/ng-packs/packages/tenant-management/tsconfig.spec.json
@@ -2,16 +2,8 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine",
-      "node"
-    ]
+    "types": ["node", "jest"]
   },
-  "files": [
-    "src/test.ts"
-  ],
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
+  "files": [],
+  "include": ["**/*.spec.ts", "**/*.d.ts"]
 }
diff --git a/npm/ng-packs/packages/theme-basic/karma.conf.js b/npm/ng-packs/packages/theme-basic/karma.conf.js
deleted file mode 100644
index e04be0a193..0000000000
--- a/npm/ng-packs/packages/theme-basic/karma.conf.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client: {
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../coverage/theme-basic'),
-      reports: ['html', 'lcovonly'],
-      fixWebpackSourcePaths: true
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true
-  });
-};
diff --git a/npm/ng-packs/packages/theme-basic/src/test.ts b/npm/ng-packs/packages/theme-basic/src/test.ts
deleted file mode 100644
index 978c64fb83..0000000000
--- a/npm/ng-packs/packages/theme-basic/src/test.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: any;
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);
diff --git a/npm/ng-packs/packages/theme-basic/tsconfig.spec.json b/npm/ng-packs/packages/theme-basic/tsconfig.spec.json
index 16da33db07..ebce9b9fdb 100644
--- a/npm/ng-packs/packages/theme-basic/tsconfig.spec.json
+++ b/npm/ng-packs/packages/theme-basic/tsconfig.spec.json
@@ -2,16 +2,8 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine",
-      "node"
-    ]
+    "types": ["node", "jest"]
   },
-  "files": [
-    "src/test.ts"
-  ],
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
+  "files": [],
+  "include": ["**/*.spec.ts", "**/*.d.ts"]
 }
diff --git a/npm/ng-packs/packages/theme-shared/jest.config.js b/npm/ng-packs/packages/theme-shared/jest.config.js
new file mode 100644
index 0000000000..718fcfe21b
--- /dev/null
+++ b/npm/ng-packs/packages/theme-shared/jest.config.js
@@ -0,0 +1,10 @@
+const { pathsToModuleNameMapper } = require('ts-jest/utils');
+const { compilerOptions } = require('./tsconfig.spec');
+const jestConfig = require('../../jest.config');
+
+module.exports = {
+  ...jestConfig,
+  name: 'theme-shared',
+  moduleNameMapper: pathsToModuleNameMapper(compilerOptions.paths /*, { prefix: '<rootDir>/' } */),
+  'ts-jest': { allowSyntheticDefaultImports: true },
+};
diff --git a/npm/ng-packs/packages/theme-shared/karma.conf.js b/npm/ng-packs/packages/theme-shared/karma.conf.js
deleted file mode 100644
index 5703b124a6..0000000000
--- a/npm/ng-packs/packages/theme-shared/karma.conf.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function(config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma'),
-    ],
-    client: {
-      clearContext: false, // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../coverage/theme-shared'),
-      reports: ['html', 'lcovonly'],
-      fixWebpackSourcePaths: true,
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true,
-  });
-};
diff --git a/npm/ng-packs/packages/theme-shared/src/lib/tests/button.component.spec.ts b/npm/ng-packs/packages/theme-shared/src/lib/tests/button.component.spec.ts
index 67526e271f..59d49e68c4 100644
--- a/npm/ng-packs/packages/theme-shared/src/lib/tests/button.component.spec.ts
+++ b/npm/ng-packs/packages/theme-shared/src/lib/tests/button.component.spec.ts
@@ -1,4 +1,4 @@
-import { createHostFactory, SpectatorHost } from '@ngneat/spectator';
+import { createHostFactory, SpectatorHost } from '@ngneat/spectator/jest';
 import { ButtonComponent } from '../components';
 
 describe('ButtonComponent', () => {
diff --git a/npm/ng-packs/packages/theme-shared/src/lib/tests/error.handler.spec.ts b/npm/ng-packs/packages/theme-shared/src/lib/tests/error.handler.spec.ts
index f64b7d73e2..764197f1e3 100644
--- a/npm/ng-packs/packages/theme-shared/src/lib/tests/error.handler.spec.ts
+++ b/npm/ng-packs/packages/theme-shared/src/lib/tests/error.handler.spec.ts
@@ -2,7 +2,7 @@ import { CoreModule, RestOccurError, RouterOutletComponent } from '@abp/ng.core'
 import { Location } from '@angular/common';
 import { HttpErrorResponse, HttpHeaders } from '@angular/common/http';
 import { Component } from '@angular/core';
-import { createRoutingFactory, SpectatorRouting } from '@ngneat/spectator';
+import { createRoutingFactory, SpectatorRouting } from '@ngneat/spectator/jest';
 import { NgxsModule, Store } from '@ngxs/store';
 import { DEFAULT_ERROR_MESSAGES, ErrorHandler } from '../handlers';
 import { ThemeSharedModule } from '../theme-shared.module';
@@ -35,7 +35,9 @@ describe('ErrorHandler', () => {
     store.dispatch(new RestOccurError(new HttpErrorResponse({ status: 500 })));
     spectator.detectChanges();
     expect(document.querySelector('.error-template')).toHaveText(DEFAULT_ERROR_MESSAGES.defaultError500.title);
-    expect(document.querySelector('.error-details')).toHaveText(DEFAULT_ERROR_MESSAGES.defaultError500.details);
+    expect(document.querySelector('.error-details')).toHaveText(
+      DEFAULT_ERROR_MESSAGES.defaultError500.details.defaultValue,
+    );
   });
 
   it('should display the error component when authorize error occurs', () => {
@@ -49,7 +51,9 @@ describe('ErrorHandler', () => {
     store.dispatch(new RestOccurError(new HttpErrorResponse({ status: 0, statusText: 'Unknown Error' })));
     spectator.detectChanges();
     expect(document.querySelector('.error-template')).toHaveText(DEFAULT_ERROR_MESSAGES.defaultErrorUnknown.title);
-    expect(document.querySelector('.error-details')).toHaveText(DEFAULT_ERROR_MESSAGES.defaultErrorUnknown.details);
+    expect(document.querySelector('.error-details')).toHaveText(
+      DEFAULT_ERROR_MESSAGES.defaultErrorUnknown.details.defaultValue,
+    );
   });
 
   it('should display the confirmation when not found error occurs', () => {
diff --git a/npm/ng-packs/packages/theme-shared/src/test.ts b/npm/ng-packs/packages/theme-shared/src/test.ts
deleted file mode 100644
index 978c64fb83..0000000000
--- a/npm/ng-packs/packages/theme-shared/src/test.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: any;
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);
diff --git a/npm/ng-packs/packages/theme-shared/tsconfig.spec.json b/npm/ng-packs/packages/theme-shared/tsconfig.spec.json
index 16da33db07..f87ea306f2 100644
--- a/npm/ng-packs/packages/theme-shared/tsconfig.spec.json
+++ b/npm/ng-packs/packages/theme-shared/tsconfig.spec.json
@@ -1,17 +1,14 @@
 {
   "extends": "../../tsconfig.json",
   "compilerOptions": {
-    "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine",
-      "node"
-    ]
+    "emitDecoratorMetadata": true,
+    "esModuleInterop": true,
+    "outDir": "../../dist/out-tsc",
+    "module": "commonjs",
+    "types": ["jest", "node"],
+    "paths": {
+      "@abp/ng.theme-shared/*": ["packages/theme-shared/src/lib/*"]
+    }
   },
-  "files": [
-    "src/test.ts"
-  ],
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
+  "include": ["**/*.spec.ts", "**/*.d.ts"]
 }
diff --git a/npm/ng-packs/test-setup.ts b/npm/ng-packs/test-setup.ts
new file mode 100644
index 0000000000..8d88704e8f
--- /dev/null
+++ b/npm/ng-packs/test-setup.ts
@@ -0,0 +1 @@
+import 'jest-preset-angular';
diff --git a/npm/ng-packs/tsconfig.json b/npm/ng-packs/tsconfig.json
index 9c996dd271..ac9e9e8eea 100644
--- a/npm/ng-packs/tsconfig.json
+++ b/npm/ng-packs/tsconfig.json
@@ -13,7 +13,7 @@
     "target": "es2015",
     "typeRoots": ["node_modules/@types"],
     "lib": ["es2018", "dom"],
-    "paths": {}
+    "types": ["jest"]
   },
   "angularCompilerOptions": {
     "fullTemplateTypeCheck": true,