feat: Angular 14.2.0 (#84)

lekhmanrus · web-flow · commit 5a976a29c966 · 2022-08-26T23:31:26.000-07:00
diff --git a/package.json b/package.json
@@ -35,77 +35,77 @@
     "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s"
   },
   "dependencies": {
-    "@angular/animations": "14.1.1",
-    "@angular/common": "14.1.1",
-    "@angular/compiler": "14.1.1",
-    "@angular/core": "14.1.1",
-    "@angular/forms": "14.1.1",
-    "@angular/platform-browser": "14.1.1",
-    "@angular/platform-browser-dynamic": "14.1.1",
-    "@angular/router": "14.1.1",
-    "@nativescript/core": "~8.3.0",
-    "@nativescript/theme": "~3.0.0",
+    "@angular/animations": "14.2.0",
+    "@angular/common": "14.2.0",
+    "@angular/compiler": "14.2.0",
+    "@angular/core": "14.2.0",
+    "@angular/forms": "14.2.0",
+    "@angular/platform-browser": "14.2.0",
+    "@angular/platform-browser-dynamic": "14.2.0",
+    "@angular/router": "14.2.0",
+    "@nativescript/core": "~8.3.4",
+    "@nativescript/theme": "~3.0.2",
     "@ngx-translate/core": "~14.0.0",
     "nativescript-ngx-fonticon": "~7.0.0",
-    "rxjs": "^7.5.0",
-    "zone.js": "~0.11.5"
+    "rxjs": "^7.5.6",
+    "zone.js": "~0.11.8"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "14.1.1",
-    "@angular-eslint/eslint-plugin": "14.0.2",
-    "@angular-eslint/eslint-plugin-template": "14.0.2",
-    "@angular-eslint/template-parser": "14.0.2",
-    "@angular/compiler-cli": "14.1.1",
+    "@angular-devkit/build-angular": "14.2.0",
+    "@angular-eslint/eslint-plugin": "14.0.3",
+    "@angular-eslint/eslint-plugin-template": "14.0.3",
+    "@angular-eslint/template-parser": "14.0.3",
+    "@angular/compiler-cli": "14.2.0",
     "@jsdevtools/coverage-istanbul-loader": "3.0.5",
-    "@nativescript/types": "~8.3.0",
-    "@nativescript/unit-test-runner": "^3.0.2",
-    "@nativescript/webpack": "~5.0.0",
-    "@ngtools/webpack": "14.1.1",
-    "@nrwl/angular": "14.5.4",
-    "@nrwl/cli": "14.5.4",
-    "@nrwl/eslint-plugin-nx": "14.5.4",
-    "@nrwl/jest": "14.5.4",
-    "@nrwl/js": "14.5.4",
-    "@nrwl/node": "14.5.4",
-    "@nrwl/workspace": "14.5.4",
+    "@nativescript/types": "~8.3.1",
+    "@nativescript/unit-test-runner": "^3.0.4",
+    "@nativescript/webpack": "~5.0.8",
+    "@ngtools/webpack": "14.2.0",
+    "@nrwl/angular": "14.5.10",
+    "@nrwl/cli": "14.5.10",
+    "@nrwl/eslint-plugin-nx": "14.5.10",
+    "@nrwl/jest": "14.5.10",
+    "@nrwl/js": "14.5.10",
+    "@nrwl/node": "14.5.10",
+    "@nrwl/workspace": "14.5.10",
     "@nstudio/angular": "14.3.0",
     "@nstudio/nativescript": "14.3.0",
     "@nstudio/nativescript-angular": "14.3.0",
     "@nstudio/xplat": "14.3.0",
-    "@types/jasmine": "4.0.3",
-    "@types/jest": "27.4.1",
-    "@types/node": "^18.0.0",
-    "@types/sinon": "^10.0.2",
-    "@typescript-eslint/eslint-plugin": "~5.24.0",
-    "@typescript-eslint/parser": "~5.24.0",
-    "conventional-changelog-cli": "^2.1.1",
-    "dotenv": "10.0.0",
-    "eslint": "7.22.0",
-    "eslint-config-prettier": "8.1.0",
-    "fs-extra": "^9.0.1",
+    "@types/jasmine": "4.3.0",
+    "@types/jest": "28.1.8",
+    "@types/node": "^18.7.13",
+    "@types/sinon": "^10.0.13",
+    "@typescript-eslint/eslint-plugin": "~5.35.1",
+    "@typescript-eslint/parser": "~5.35.1",
+    "conventional-changelog-cli": "^2.2.2",
+    "dotenv": "16.0.1",
+    "eslint": "8.22.0",
+    "eslint-config-prettier": "8.5.0",
+    "fs-extra": "^10.1.0",
     "husky": "~8.0.1",
-    "jest": "27.5.1",
+    "jest": "29.0.1",
     "karma": "6.4.0",
-    "karma-coverage": "2.0.3",
+    "karma-coverage": "2.2.0",
     "karma-jasmine": "5.1.0",
     "karma-mocha-reporter": "^2.2.5",
     "karma-nativescript-launcher": "0.4.0",
     "karma-sinon": "^1.0.5",
-    "lint-staged": "^13.0.0",
-    "ng-packagr": "14.1.0",
-    "nx": "14.5.4",
+    "lint-staged": "^13.0.3",
+    "ng-packagr": "14.2.0",
+    "nx": "14.5.10",
     "nyc": "15.1.0",
-    "postcss": "^8.3.9",
+    "postcss": "^8.4.16",
     "postcss-import": "14.1.0",
-    "postcss-preset-env": "7.5.0",
+    "postcss-preset-env": "7.8.0",
     "postcss-url": "10.1.3",
-    "prettier": "2.6.2",
-    "sass": "^1.32.0",
-    "sinon": "^11.1.1",
-    "ts-jest": "27.1.4",
-    "ts-node": "10.8.1",
-    "tslib": "^2.1.0",
-    "typescript": "~4.7.3"
+    "prettier": "2.7.1",
+    "sass": "^1.54.5",
+    "sinon": "^14.0.0",
+    "ts-jest": "28.0.8",
+    "ts-node": "10.9.1",
+    "tslib": "^2.4.0",
+    "typescript": "~4.8.2"
   },
   "xplat": {
     "prefix": "nativescript",
diff --git a/packages/angular/src/lib/cdk/dialog/native-modal-ref.ts b/packages/angular/src/lib/cdk/dialog/native-modal-ref.ts
@@ -1,4 +1,4 @@
-import { ApplicationRef, ComponentFactoryResolver, ComponentRef, EmbeddedViewRef, Injector, Optional, ViewContainerRef, ɵmarkDirty } from '@angular/core';
+import { ApplicationRef, ComponentFactoryResolver, ComponentRef, EmbeddedViewRef, Injector, Optional, ViewContainerRef, ɵdetectChanges as detectChanges } from '@angular/core';
 import { ContentView, View, Application, Frame } from '@nativescript/core';
 import { fromEvent, Subject } from 'rxjs';
 import { take } from 'rxjs/operators';
@@ -100,7 +100,7 @@ export class NativeModalRef {
     const targetView = new ContentView();
     this.portalOutlet = new NativeScriptDomPortalOutlet(targetView, this._config.componentFactoryResolver || this._injector.get(ComponentFactoryResolver), this._injector.get(ApplicationRef), this._injector);
     const componentRef = this.portalOutlet.attach(portal);
-    ɵmarkDirty(componentRef.instance);
+    detectChanges(componentRef.instance);
     this.modalViewRef = new NgViewRef(componentRef);
     if (this.modalViewRef.firstNativeLikeView !== this.modalViewRef.view) {
       (<any>this.modalViewRef.view)._ngDialogRoot = this.modalViewRef.firstNativeLikeView;
diff --git a/packages/angular/src/lib/cdk/list-view/list-view.component.ts b/packages/angular/src/lib/cdk/list-view/list-view.component.ts
@@ -1,4 +1,4 @@
-import { AfterContentInit, ChangeDetectionStrategy, Component, ContentChild, Directive, DoCheck, ElementRef, EmbeddedViewRef, EventEmitter, forwardRef, Host, HostListener, Inject, InjectionToken, Input, IterableDiffer, IterableDiffers, NgZone, OnDestroy, Output, TemplateRef, ViewChild, ViewContainerRef, ɵisListLikeIterable as isListLikeIterable, ɵmarkDirty } from '@angular/core';
+import { AfterContentInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChild, Directive, DoCheck, ElementRef, EmbeddedViewRef, EventEmitter, forwardRef, Host, HostListener, Inject, InjectionToken, Input, IterableDiffer, IterableDiffers, OnDestroy, Output, TemplateRef, ViewChild, ViewContainerRef, ɵisListLikeIterable as isListLikeIterable } from '@angular/core';
 import { ItemEventData, KeyedTemplate, LayoutBase, ListView, ObservableArray, profile, View } from '@nativescript/core';
 
 import { extractSingleViewRecursive } from '../../element-registry/registry';
@@ -130,7 +130,7 @@ export class ListViewComponent<T = any> implements DoCheck, OnDestroy, AfterCont
     this.templatedItemsView.items = this._items;
   }
 
-  constructor(_elementRef: ElementRef, private _iterableDiffers: IterableDiffers, private zone: NgZone) {
+  constructor(_elementRef: ElementRef, private readonly _iterableDiffers: IterableDiffers, private readonly _changeDetectorRef: ChangeDetectorRef) {
     this.templatedItemsView = _elementRef.nativeElement;
   }
 
@@ -187,10 +187,7 @@ export class ListViewComponent<T = any> implements DoCheck, OnDestroy, AfterCont
       this._templateMap = new Map<string, NsTemplatedItem<T>>();
     }
 
-    this._templateMap.set(
-      key,
-      new NsTemplatedItem<T>(template, this.loader, (v) => this._viewToTemplate.set(v, key))
-    );
+    this._templateMap.set(key, new NsTemplatedItem<T>(template, this.loader, (v) => this._viewToTemplate.set(v, key)));
   }
 
   @HostListener('itemLoading', ['$event'])
@@ -240,7 +237,7 @@ export class ListViewComponent<T = any> implements DoCheck, OnDestroy, AfterCont
     this.setupViewRef(template.getEmbeddedViewRef(args.view), currentItem, index, args.view);
 
     template.attach(args.view);
-    ɵmarkDirty(this);
+    this._changeDetectorRef.detectChanges();
   }
 
   public setupViewRef(viewRef: EmbeddedViewRef<ItemContext<T>>, data: T, index: number, nativeElement: View): void {
diff --git a/packages/angular/src/lib/legacy/directives/dialogs.ts b/packages/angular/src/lib/legacy/directives/dialogs.ts
@@ -1,4 +1,4 @@
-import { ApplicationRef, ComponentFactoryResolver, ComponentRef, Injectable, Injector, NgModuleRef, NgZone, Type, ViewContainerRef, ɵmarkDirty } from '@angular/core';
+import { ApplicationRef, ComponentFactoryResolver, ComponentRef, Injectable, Injector, NgModuleRef, NgZone, Type, ViewContainerRef, ɵdetectChanges as detectChanges } from '@angular/core';
 import { Application, ContentView, Frame, ShowModalOptions, View, ViewBase } from '@nativescript/core';
 import { Subject } from 'rxjs';
 import { AppHostAsyncView, AppHostView } from '../../app-host-view';
@@ -169,7 +169,7 @@ export class ModalDialogService {
       const portal = new ComponentPortal(options.type);
       portalOutlet = new NativeScriptDomPortalOutlet(targetView, options.resolver, this.appRef, childInjector);
       const componentRef = portalOutlet.attach(portal);
-      ɵmarkDirty(componentRef.instance);
+      detectChanges(componentRef.instance);
       componentViewRef = new NgViewRef(componentRef);
       if (options.useContextAsComponentProps && options.context) {
         for (const key in options.context) {

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-import { AfterContentInit, ChangeDetectionStrategy, Component, ContentChild, Directive, DoCheck, ElementRef, EmbeddedViewRef, EventEmitter, forwardRef, Host, HostListener, Inject, InjectionToken, Input, IterableDiffer, IterableDiffers, NgZone, OnDestroy, Output, TemplateRef, ViewChild, ViewContainerRef, ɵisListLikeIterable as isListLikeIterable, ɵmarkDirty } from '@angular/core';`
	`1`	`+import { AfterContentInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChild, Directive, DoCheck, ElementRef, EmbeddedViewRef, EventEmitter, forwardRef, Host, HostListener, Inject, InjectionToken, Input, IterableDiffer, IterableDiffers, OnDestroy, Output, TemplateRef, ViewChild, ViewContainerRef, ɵisListLikeIterable as isListLikeIterable } from '@angular/core';`
`2`	`2`	`import { ItemEventData, KeyedTemplate, LayoutBase, ListView, ObservableArray, profile, View } from '@nativescript/core';`
`3`	`3`
`4`	`4`	`import { extractSingleViewRecursive } from '../../element-registry/registry';`
`@@ -130,7 +130,7 @@ export class ListViewComponent<T = any> implements DoCheck, OnDestroy, AfterCont`
`130`	`130`	`this.templatedItemsView.items = this._items;`
`131`	`131`	`}`
`132`	`132`
`133`		`- constructor(_elementRef: ElementRef, private _iterableDiffers: IterableDiffers, private zone: NgZone) {`
	`133`	`+ constructor(_elementRef: ElementRef, private readonly _iterableDiffers: IterableDiffers, private readonly _changeDetectorRef: ChangeDetectorRef) {`
`134`	`134`	`this.templatedItemsView = _elementRef.nativeElement;`
`135`	`135`	`}`
`136`	`136`
`@@ -187,10 +187,7 @@ export class ListViewComponent<T = any> implements DoCheck, OnDestroy, AfterCont`
`187`	`187`	`this._templateMap = new Map<string, NsTemplatedItem<T>>();`
`188`	`188`	`}`
`189`	`189`
`190`		`- this._templateMap.set(`
`191`		`- key,`
`192`		`- new NsTemplatedItem<T>(template, this.loader, (v) => this._viewToTemplate.set(v, key))`
`193`		`- );`
	`190`	`+ this._templateMap.set(key, new NsTemplatedItem<T>(template, this.loader, (v) => this._viewToTemplate.set(v, key)));`
`194`	`191`	`}`
`195`	`192`
`196`	`193`	`@HostListener('itemLoading', ['$event'])`
`@@ -240,7 +237,7 @@ export class ListViewComponent<T = any> implements DoCheck, OnDestroy, AfterCont`
`240`	`237`	`this.setupViewRef(template.getEmbeddedViewRef(args.view), currentItem, index, args.view);`
`241`	`238`
`242`	`239`	`template.attach(args.view);`
`243`		`- ɵmarkDirty(this);`
	`240`	`+ this._changeDetectorRef.detectChanges();`
`244`	`241`	`}`
`245`	`242`
`246`	`243`	`public setupViewRef(viewRef: EmbeddedViewRef<ItemContext<T>>, data: T, index: number, nativeElement: View): void {`