Update for Angular 14

.gitignore

@@ -26,6 +26,7 @@
 !.vscode/extensions.json
 
 # misc
+/.angular/cache
 /.sass-cache
 /connect.lock
 /coverage

CHANGELOG.md

@@ -1,7 +1,24 @@
-# Change Log
+# Changelog
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [5.0.1](https://github.com/thisissoon/angular-inviewport/compare/v5.0.0...v5.0.1) (2022-06-15)
+
+## [5.0.0](https://github.com/thisissoon/angular-inviewport/compare/v4.2.2...v5.0.0) (2022-06-15)
+
+
+### ⚠ BREAKING CHANGES
+
+* requires Angular v10
+
+### Bug Fixes
+
+* **@nguniversal/module-map-ngfactory-loader:** remove module-map-ngfactory-loader (deprecated) ([30e6a57](https://github.com/thisissoon/angular-inviewport/commit/30e6a570bf8858f10fa2cc0c711f1e94487ebfa9))
+* **package.json:** update package versions to go along with Angular v10 upgrade ([ea3b739](https://github.com/thisissoon/angular-inviewport/commit/ea3b739fbd327579c942511ae6f71a108e83a412)), closes [#41](https://github.com/thisissoon/angular-inviewport/issues/41)
+* **polyfills,lock file:** update polyfills to use proper references; rebuild lock file ([ef09fe0](https://github.com/thisissoon/angular-inviewport/commit/ef09fe0490d9247022ef9e379daa0a6d7e860934)), closes [#41](https://github.com/thisissoon/angular-inviewport/issues/41)
+* update packages for audit issues ([2e8e7f5](https://github.com/thisissoon/angular-inviewport/commit/2e8e7f5e1d580cc0555e613289c838c3e6a9fbf0)), closes [#41](https://github.com/thisissoon/angular-inviewport/issues/41)
+* Upgrade to Angular v10 ([3e5b1ca](https://github.com/thisissoon/angular-inviewport/commit/3e5b1ca233d0d55d5865125c6ce6ac8afafae679))
+
 <a name="4.2.2"></a>
 ## [4.2.2](https://github.com/thisissoon/angular-inviewport/compare/v4.2.1...v4.2.2) (2020-02-03)
 

angular.json

@@ -11,7 +11,6 @@
         "build": {
           "builder": "@angular-devkit/build-angular:browser",
           "options": {
-            "aot": true,
             "outputPath": "dist/angular-inviewport",
             "index": "src/index.html",
             "main": "src/main.ts",
@@ -20,7 +19,13 @@
             "assets": ["src/assets", "src/favicon.ico"],
             "styles": ["src/styles.scss"],
             "scripts": [],
-            "progress": false
+            "progress": false,
+            "vendorChunk": true,
+            "extractLicenses": false,
+            "buildOptimizer": false,
+            "sourceMap": true,
+            "optimization": false,
+            "namedChunks": true
           },
           "configurations": {
             "production": {
@@ -33,9 +38,7 @@
               "optimization": true,
               "outputHashing": "all",
               "sourceMap": false,
-              "extractCss": true,
               "namedChunks": false,
-              "aot": true,
               "extractLicenses": true,
               "vendorChunk": false,
               "buildOptimizer": true,
@@ -55,7 +58,8 @@
               ],
               "progress": false
             }
-          }
+          },
+          "defaultConfiguration": ""
         },
         "serve": {
           "builder": "@angular-devkit/build-angular:dev-server",
@@ -99,20 +103,16 @@
             }
           }
         },
-        "lint": {
-          "builder": "@angular-devkit/build-angular:tslint",
-          "options": {
-            "tsConfig": ["src/tsconfig.app.json", "src/tsconfig.spec.json"],
-            "exclude": ["**/node_modules/**"]
-          }
-        },
         "server": {
           "builder": "@angular-devkit/build-angular:server",
           "options": {
             "outputPath": "dist/angular-inviewport-server",
             "main": "src/main.server.ts",
-            "tsConfig": "src/tsconfig.server.json"
-          }
+            "tsConfig": "src/tsconfig.server.json",
+            "sourceMap": true,
+            "optimization": false
+          },
+          "defaultConfiguration": ""
         }
       }
     },
@@ -127,18 +127,10 @@
             "protractorConfig": "e2e/protractor.conf.js",
             "devServerTarget": "angular-inviewport:serve:no-progress"
           }
-        },
-        "lint": {
-          "builder": "@angular-devkit/build-angular:tslint",
-          "options": {
-            "tsConfig": ["e2e/tsconfig.e2e.json"],
-            "exclude": ["**/node_modules/**"]
-          }
         }
       }
     }
   },
-  "defaultProject": "angular-inviewport",
   "schematics": {
     "@schematics/angular:component": {
       "prefix": "sn",
@@ -149,6 +141,6 @@
     }
   },
   "cli": {
-    "packageManager": "yarn"
+    "packageManager": "npm"
   }
 }

e2e/tsconfig.e2e.json

@@ -1,5 +1,5 @@
 {
-  "extends": "../tsconfig.base.json",
+  "extends": "../tsconfig.json",
   "compilerOptions": {
     "outDir": "../out-tsc/e2e",
     "baseUrl": "./",

ng-package.json

@@ -0,0 +1,6 @@
+{
+  "$schema": "./node_modules/ng-packagr/ng-package.schema.json",
+  "lib": {
+    "entryFile": "src/index.ts"
+  }
+}

package.json

@@ -1,6 +1,6 @@
 {
-  "name": "@thisissoon/angular-inviewport",
-  "version": "4.2.2",
+  "name": "@elvirus/angular-inviewport",
+  "version": "5.0.2",
   "description": "A simple lightweight library for Angular that detects when an element is within the browser viewport and adds a sn-viewport--in or sn-viewport--out class to the element.",
   "keywords": [
     "angular",
@@ -42,27 +42,27 @@
     "packagr": "ng-packagr -p package.json",
     "build:ssr": "npm run build:client-and-server-bundles && npm run webpack:server",
     "serve:ssr": "node dist/server.js",
-    "build:client-and-server-bundles": "ng build --prod && ng run angular-inviewport:server",
+    "build:client-and-server-bundles": "ng build --configuration production && ng run angular-inviewport:server",
     "webpack:server": "webpack --config webpack.server.js --progress --colors",
     "release": "standard-version",
     "postrelease": "npm run packagr"
   },
   "private": false,
   "peerDependencies": {},
   "devDependencies": {
-    "@angular-devkit/build-angular": "~0.1000.4",
-    "@angular/animations": "10.0.5",
-    "@angular/cli": "10.0.4",
-    "@angular/common": "10.0.5",
-    "@angular/compiler": "10.0.5",
-    "@angular/compiler-cli": "10.0.5",
-    "@angular/core": "10.0.5",
-    "@angular/platform-browser": "10.0.5",
-    "@angular/platform-browser-dynamic": "10.0.5",
-    "@angular/platform-server": "10.0.5",
-    "@nguniversal/express-engine": "^10.0.1",
+    "@angular-devkit/build-angular": "^14.0.1",
+    "@angular/animations": "14.0.1",
+    "@angular/cli": "14.0.1",
+    "@angular/common": "14.0.1",
+    "@angular/compiler": "14.0.1",
+    "@angular/compiler-cli": "14.0.1",
+    "@angular/core": "14.0.1",
+    "@angular/platform-browser": "14.0.1",
+    "@angular/platform-browser-dynamic": "14.0.1",
+    "@angular/platform-server": "14.0.1",
+    "@nguniversal/express-engine": "^14.0.0",
     "@thisissoon/schematics": "^1.0.0-alpha.17",
-    "@types/jasmine": "^3.5.11",
+    "@types/jasmine": "~3.8.0",
     "@types/jasminewd2": "~2.0.2",
     "@types/node": "^14.0.25",
     "codelyzer": "^6.0.0",
@@ -72,17 +72,17 @@
     "express": "^4.16.3",
     "husky": "^4.2.5",
     "intersection-observer": "^0.11.0",
-    "jasmine-core": "^3.6.0",
+    "jasmine-core": "~3.8.0",
     "jasmine-spec-reporter": "~5.0.0",
-    "karma": "~5.1.0",
+    "karma": "~6.4.0",
     "karma-chrome-launcher": "~3.1.0",
     "karma-cli": "^2.0.0",
     "karma-coverage-istanbul-reporter": "~3.0.2",
-    "karma-jasmine": "~3.3.0",
+    "karma-jasmine": "~4.0.0",
     "karma-jasmine-html-reporter": "^1.5.0",
     "karma-mocha-reporter": "^2.2.5",
     "lint-staged": "^10.2.11",
-    "ng-packagr": "^10.0.0",
+    "ng-packagr": "^14.0.2",
     "prettier": "^2.0.5",
     "protractor": "^7.0.0",
     "rxjs": "^6.6.0",
@@ -97,20 +97,14 @@
     "ts-node": "^8.10.2",
     "tslint": "~6.1.0",
     "tslint-config-prettier": "^1.16.0",
-    "typescript": "~3.9.7",
-    "zone.js": "~0.10.3"
+    "typescript": "~4.6.4",
+    "zone.js": "~0.11.4"
   },
   "config": {
     "commitizen": {
       "path": "./node_modules/cz-conventional-changelog"
     }
   },
-  "ngPackage": {
-    "$schema": "./node_modules/ng-packagr/ng-package.schema.json",
-    "lib": {
-      "entryFile": "src/index.ts"
-    }
-  },
   "husky": {
     "hooks": {
       "pre-commit": "lint-staged"

server.ts

@@ -1,4 +1,4 @@
-import 'zone.js/dist/zone-node';
+import 'zone.js/node';
 import 'reflect-metadata';
 
 import { enableProdMode } from '@angular/core';

src/polyfills.ts

@@ -34,25 +34,16 @@ import 'core-js/es/map';
 import 'core-js/es/weak-map';
 import 'core-js/es/set';
 
-/** IE10 and IE11 requires the following for NgClass support on SVG elements */
-// import 'classlist.js';  // Run `npm install --save classlist.js`.
-
 /** IE10 and IE11 requires the following for the Reflect API. */
 // import 'core-js/es/reflect';
 
 /** Evergreen browsers require these. **/
 // Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove.
 
-/**
- * Required to support Web Animations `@angular/platform-browser/animations`.
- * Needed for: All but Chrome, Firefox and Opera. http://caniuse.com/#feat=web-animation
- **/
-// import 'web-animations-js';  // Run `npm install --save web-animations-js`.
-
 /***************************************************************************************************
  * Zone JS is required by Angular itself.
  */
-import 'zone.js/dist/zone'; // Included with Angular CLI.
+import 'zone.js'; // Included with Angular CLI.
 
 /***************************************************************************************************
  * APPLICATION IMPORTS

src/test.ts

@@ -22,7 +22,10 @@ __karma__.loaded = function () {};
 // First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(
   BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
+  platformBrowserDynamicTesting(),
+  {
+    teardown: { destroyAfterEach: false },
+  }
 );
 // Then we find all the tests.
 const context = require.context('./', true, /\.spec\.ts$/);

src/tsconfig.app.json

@@ -1,5 +1,5 @@
 {
-  "extends": "../tsconfig.base.json",
+  "extends": "../tsconfig.json",
   "compilerOptions": {
     "outDir": "../out-tsc/app",
     "baseUrl": "./",

src/tsconfig.spec.json

@@ -1,9 +1,9 @@
 {
-  "extends": "../tsconfig.base.json",
+  "extends": "../tsconfig.json",
   "compilerOptions": {
     "outDir": "../out-tsc/spec",
     "baseUrl": "./",
-    "target": "es5",
+    "target": "es2020",
     "types": ["jasmine", "node"]
   },
   "files": ["test.ts", "polyfills.ts"],

tsconfig.json

@@ -1,20 +1,14 @@
-/*
-  This is a "Solution Style" tsconfig.json file, and is used by editors and TypeScript’s language server to improve development experience.
-  It is not intended to be used to perform a compilation.
-
-  To learn more about this file see: https://angular.io/config/solution-tsconfig.
-*/
 {
-  "files": [],
-  "references": [
-    {
-      "path": "./src/tsconfig.app.json"
-    },
-    {
-      "path": "./src/tsconfig.spec.json"
-    },
-    {
-      "path": "./src/tsconfig.server.json"
-    }
-  ]
-}
+  "compileOnSave": false,
+  "compilerOptions": {
+    "module": "es2020",
+    "outDir": "./dist/out-tsc",
+    "sourceMap": true,
+    "declaration": false,
+    "moduleResolution": "node",
+    "experimentalDecorators": true,
+    "target": "es2020",
+    "typeRoots": ["node_modules/@types"],
+    "lib": ["es2017", "dom"]
+  }
+}