Angular 13

.gitignore

@@ -1,3 +1,4 @@
+/.angular/cache
 ############
 ## Project
 ############

config/spec-bundle.js

@@ -6,7 +6,7 @@ require('core-js/features/reflect');
 require('ts-helpers');
 require('./testing-utils');
 
-require('zone.js/dist/zone');
+require('zone.js');
 require('zone.js/dist/long-stack-trace-zone');
 require('zone.js/dist/proxy.js');
 require('zone.js/dist/sync-test');

demo/src/environments/environment.ts

@@ -12,4 +12,4 @@ export const environment = {
  * import the following file, but please comment it out in production mode
  * because it will have performance impact when throw error
  */
-// import 'zone.js/dist/zone-error';  // Included with Angular CLI.
+// import 'zone.js/plugins/zone-error';  // Included with Angular CLI.

demo/src/polyfills.ts

@@ -55,7 +55,7 @@
 /***************************************************************************************************
  * Zone JS is required by default for Angular itself.
  */
-import 'zone.js/dist/zone';  // Included with Angular CLI.
+import 'zone.js';  // Included with Angular CLI.
 
 
 /***************************************************************************************************

demo/src/test.ts

@@ -1,6 +1,6 @@
 // This file is required by karma.conf.js and loads recursively all the .spec and framework files
 
-import 'zone.js/dist/zone-testing';
+import 'zone.js/testing';
 import { getTestBed } from '@angular/core/testing';
 import {
   BrowserDynamicTestingModule,

package.json

@@ -25,24 +25,22 @@
   },
   "homepage": "https://github.com/Greentube/ngx-modal",
   "peerDependencies": {
-    "@angular/common": ">=10.0.0",
-    "@angular/core": ">=10.0.0",
     "rxjs": ">=6.5.0"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~0.1000.8",
+    "@angular-devkit/build-angular": "~13.3.11",
     "@angular-devkit/build-ng-packagr": "~0.1000.8",
-    "@angular/animations": "^10.0.14",
-    "@angular/cli": "^10.0.8",
-    "@angular/common": "^10.0.14",
-    "@angular/compiler": "^10.0.14",
-    "@angular/compiler-cli": "^10.0.14",
-    "@angular/core": "^10.0.14",
-    "@angular/forms": "^10.0.14",
-    "@angular/platform-browser": "^10.0.14",
-    "@angular/platform-browser-dynamic": "^10.0.14",
-    "@angular/platform-server": "^10.0.14",
-    "@angular/router": "^10.0.14",
+    "@angular/animations": "^13.4.0",
+    "@angular/cli": "^13.3.11",
+    "@angular/common": "^13.4.0",
+    "@angular/compiler": "^13.4.0",
+    "@angular/compiler-cli": "^13.4.0",
+    "@angular/core": "^13.4.0",
+    "@angular/forms": "^13.4.0",
+    "@angular/platform-browser": "^13.4.0",
+    "@angular/platform-browser-dynamic": "^13.4.0",
+    "@angular/platform-server": "^13.4.0",
+    "@angular/router": "^13.4.0",
     "@types/hammerjs": "~2.0.35",
     "@types/jasmine": "^3.5.14",
     "@types/jasminewd2": "~2.0.2",
@@ -54,7 +52,7 @@
     "core-js": "^3.6.4",
     "istanbul-instrumenter-loader": "^3.0.1",
     "jasmine-core": "^3.6.0",
-    "karma": "^5.2.0",
+    "karma": "^6.4.2",
     "karma-chrome-launcher": "~3.1.0",
     "karma-coverage": "~2.0.3",
     "karma-jasmine": "~4.0.1",
@@ -63,19 +61,19 @@
     "karma-sourcemap-loader": "0.3.8",
     "karma-webpack": "~4.0.2",
     "loader-utils": "~2.0.0",
-    "ng-packagr": "^10.0.0",
+    "ng-packagr": "^13.3.1",
     "reflect-metadata": "~0.1.12",
     "rxjs": "^6.6.2",
     "source-map-loader": "~1.1.0",
     "ts-helpers": "~1.1.2",
     "ts-node": "~8.6.2",
-    "tslib": "^2.0.0",
+    "tslib": "^2.6.0",
     "tslint": "^6.1.3",
     "tslint-eslint-rules": "^5.4.0",
     "tslint-loader": "~3.6.0",
-    "typescript": "~3.9.7",
+    "typescript": "~4.6.4",
     "webpack": "~4.44.1",
     "webpack-node-externals": "~1.7.2",
-    "zone.js": "~0.10.3"
+    "zone.js": "~0.11.4"
   }
-}
+}

src/modal-dialog.module.ts

@@ -14,11 +14,10 @@ import { NgModule, ModuleWithProviders, InjectionToken, SkipSelf, Optional } fro
 export const MODAL_DIALOG_FORROOT_GUARD = new InjectionToken<ModalDialogModule>('MODAL_DIALOG_FORROOT_GUARD');
 
 @NgModule({
-  imports: [CommonModule],
-  declarations: [ModalDialogComponent, SimpleModalComponent],
-  entryComponents: [ModalDialogComponent, SimpleModalComponent],
-  exports: [ModalDialogComponent, SimpleModalComponent],
-  providers: [ModalDialogService, ModalDialogInstanceService]
+    imports: [CommonModule],
+    declarations: [ModalDialogComponent, SimpleModalComponent],
+    exports: [ModalDialogComponent, SimpleModalComponent],
+    providers: [ModalDialogService, ModalDialogInstanceService]
 })
 export class ModalDialogModule {
 

tests/modal-dialog-instance.service.spec.ts

@@ -20,11 +20,12 @@ describe('ModalDialogInstance.Service: ', () => {
 
   beforeEach(() => {
     TestBed.configureTestingModule({
-      providers: [
+    providers: [
         ModalDialogInstanceService
-      ],
-      declarations: [ModalDialogComponent]
-    });
+    ],
+    declarations: [ModalDialogComponent],
+    teardown: { destroyAfterEach: false }
+});
   });
 
   it('should create ModalDialogInstanceService', () => {

tests/modal-dialog.component.spec.ts

@@ -41,9 +41,10 @@ describe('ModalDialog.Component:', () => {
     jasmine.clock().install();
 
     let module = TestBed.configureTestingModule({
-      imports: [CommonModule],
-      declarations: [ModalDialogComponent, DummyComponent]
-    });
+    imports: [CommonModule],
+    declarations: [ModalDialogComponent, DummyComponent],
+    teardown: { destroyAfterEach: false }
+});
     module.overrideModule(BrowserDynamicTestingModule, {
       set: { entryComponents: [DummyComponent] }
     });

tests/modal-dialog.service.spec.ts

@@ -31,14 +31,15 @@ describe('ModalDialog.Service: ', () => {
   beforeEach(() => {
 
     TestBed.configureTestingModule({
-      providers: [
+    providers: [
         ModalDialogService,
         { provide: ViewContainerRef, useClass: MockedViewContainerRef },
         { provide: ComponentFactoryResolver, useClass: MockedComponentFactoryResolver },
         ModalDialogInstanceService
-      ],
-      declarations: [ModalDialogComponent]
-    });
+    ],
+    declarations: [ModalDialogComponent],
+    teardown: { destroyAfterEach: false }
+});
   });
 
   //let component;

tests/simple-modal.component.spec.ts

@@ -6,8 +6,9 @@ let fixture: ComponentFixture<SimpleModalComponent>;
 describe('SimpleModal.Component: ', () => {
   beforeEach(() => {
     TestBed.configureTestingModule({
-      declarations: [SimpleModalComponent]
-    });
+    declarations: [SimpleModalComponent],
+    teardown: { destroyAfterEach: false }
+});
     fixture = TestBed.createComponent(SimpleModalComponent);
   });
 

tsconfig.json

@@ -35,6 +35,6 @@
   "angularCompilerOptions": {
     "fullTemplateTypeCheck": true,
     "strictInjectionParameters": true,
-    "enableIvy": true
+    "enableIvy": false
   }
 }