Skip to content

Commit d8f6d3d

Browse files
SplaktarSplaktar
committed
refactor(dev-app): enable Ivy and fix template type checking issues
Fixes #16606. Closes #16373.
1 parent 3e5e9db commit d8f6d3d

File tree

52 files changed

+780
-1233
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

52 files changed

+780
-1233
lines changed

‎.bazelrc

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -40,9 +40,8 @@ build:release --workspace_status_command="node ./tools/bazel-stamp-vars.js"
4040
# Temporary Settings for Ivy #
4141
################################
4242

43-
# Use the legacy AOT compiler strategy. We don't want to compile with Ivy nor with "ngtsc" which
44-
# does not generate factory files which are needed for AOT.
45-
build --define=compile=legacy
43+
# Use the Ivy AOT compiler strategy. We want to compile with Ivy and with "ngtsc".
44+
build --define=compile=aot --keep_going=true
4645

4746
#######################
4847
# Remote HTTP Caching #

‎.circleci/config.yml

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -406,10 +406,6 @@ jobs:
406406
# Setup ngcc to make the Angular packages compatible with ngtsc (i.e. creating
407407
# directive and component definitions as static class members).
408408
- run: node ./scripts/circleci/setup-ivy-ngcc.js
409-
# Disable type checking when building with Ivy. This is necessary because
410-
# type checking is not complete yet and can incorrectly break compilation.
411-
# Issue is tracked with FW-1004.
412-
- run: sed -i "s/\(_ENABLE_NG_TYPE_CHECKING = \)True/\1False/g" tools/defaults.bzl
413409
# Run project tests with ngtsc and the Ivy Angular packages.
414410
- run: bazel build src/... --build_tag_filters=-docs-package,-e2e --define=compile=aot
415411
- run: bazel test src/... --build_tag_filters=-docs-package,-e2e --test_tag_filters=-e2e --define=compile=aot
@@ -433,10 +429,6 @@ jobs:
433429

434430
# Setup Angular ivy snapshots built with ngtsc.
435431
- run: node ./scripts/circleci/setup-angular-snapshots.js --tag master-ivy-aot
436-
# Disable type checking when building with Ivy. This is necessary because
437-
# type checking is not complete yet and can incorrectly break compilation.
438-
# Issue is tracked with FW-1004.
439-
- run: sed -i "s/\(_ENABLE_NG_TYPE_CHECKING = \)True/\1False/g" tools/defaults.bzl
440432
# Run project tests with ngtsc and the Ivy Angular packages.
441433
- run: bazel build src/... --build_tag_filters=-docs-package,-e2e --define=compile=aot
442434
- run: bazel test src/... --build_tag_filters=-docs-package,-e2e --test_tag_filters=-e2e --define=compile=aot

‎package.json

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,11 @@
99
},
1010
"license": "MIT",
1111
"engines": {
12-
"node": ">= 5.4.1",
12+
"node": "10",
1313
"yarn": ">= 1.17.3"
1414
},
1515
"scripts": {
16-
"postinstall": "node --preserve-symlinks --preserve-symlinks-main tools/bazel/postinstall-patches.js",
16+
"postinstall": "node --preserve-symlinks --preserve-symlinks-main tools/bazel/postinstall-patches.js | ivy-ngcc --properties main",
1717
"build": "bash ./scripts/build-packages-dist.sh",
1818
"bazel:buildifier": "find . -type f \\( -name \"*.bzl\" -or -name WORKSPACE -or -name BUILD -or -name BUILD.bazel \\) ! -path \"*/node_modules/*\" | xargs buildifier -v --warnings=attr-cfg,attr-license,attr-non-empty,attr-output-default,attr-single-file,constant-glob,ctx-args,depset-iteration,depset-union,dict-concatenation,duplicated-name,filetype,git-repository,http-archive,integer-division,load,load-on-top,native-build,native-package,output-group,package-name,package-on-top,redefined-variable,repository-name,same-origin-load,string-iteration,unused-variable,unsorted-dict-items,out-of-order-load",
1919
"bazel:format-lint": "yarn -s bazel:buildifier --lint=warn --mode=check",
@@ -41,33 +41,33 @@
4141
"requiredAngularVersion": "^8.0.0 || ^9.0.0-0",
4242
"requiredMDCVersion": "^4.0.0-alpha.0",
4343
"dependencies": {
44-
"@angular/animations": "^9.0.0-next.10",
45-
"@angular/common": "^9.0.0-next.10",
46-
"@angular/compiler": "^9.0.0-next.10",
47-
"@angular/core": "^9.0.0-next.10",
48-
"@angular/elements": "^9.0.0-next.10",
49-
"@angular/forms": "^9.0.0-next.10",
50-
"@angular/platform-browser": "^9.0.0-next.10",
44+
"@angular/animations": "9.0.0-next.10",
45+
"@angular/common": "9.0.0-next.10",
46+
"@angular/compiler": "9.0.0-next.10",
47+
"@angular/core": "9.0.0-next.10",
48+
"@angular/elements": "9.0.0-next.10",
49+
"@angular/forms": "9.0.0-next.10",
50+
"@angular/platform-browser": "9.0.0-next.10",
5151
"@types/googlemaps": "^3.37.0",
5252
"@types/youtube": "^0.0.38",
5353
"@webcomponents/custom-elements": "^1.1.0",
54-
"core-js": "^2.6.1",
54+
"core-js": "^2.6.9",
5555
"material-components-web": "^4.0.0-canary.e851d4f40.0",
5656
"rxjs": "^6.5.3",
5757
"systemjs": "0.19.43",
5858
"tsickle": "^0.35.0",
59-
"tslib": "^1.9.3",
59+
"tslib": "^1.10.0",
6060
"zone.js": "~0.10.2"
6161
},
6262
"devDependencies": {
6363
"@angular-devkit/core": "^9.0.0-next.9",
6464
"@angular-devkit/schematics": "^9.0.0-next.9",
65-
"@angular/bazel": "^9.0.0-next.10",
66-
"@angular/compiler-cli": "^9.0.0-next.10",
67-
"@angular/platform-browser-dynamic": "^9.0.0-next.10",
68-
"@angular/platform-server": "^9.0.0-next.10",
69-
"@angular/router": "^9.0.0-next.10",
70-
"@angular/upgrade": "^9.0.0-next.10",
65+
"@angular/bazel": "9.0.0-next.10",
66+
"@angular/compiler-cli": "9.0.0-next.10",
67+
"@angular/platform-browser-dynamic": "9.0.0-next.10",
68+
"@angular/platform-server": "9.0.0-next.10",
69+
"@angular/router": "9.0.0-next.10",
70+
"@angular/upgrade": "9.0.0-next.10",
7171
"@bazel/bazel": "^0.29.0",
7272
"@bazel/buildifier": "^0.29.0",
7373
"@bazel/ibazel": "^0.10.3",
@@ -98,11 +98,11 @@
9898
"browser-sync": "^2.26.7",
9999
"chalk": "^2.4.2",
100100
"clang-format": "^1.2.4",
101-
"codelyzer": "^5.1.1",
101+
"codelyzer": "^5.1.2",
102102
"conventional-changelog": "^3.0.5",
103103
"dgeni": "^0.4.11",
104104
"dgeni-packages": "^0.27.1",
105-
"firebase-tools": "^4.1.0",
105+
"firebase-tools": "^7.5.0",
106106
"fs-extra": "^3.0.1",
107107
"glob": "^7.1.2",
108108
"gulp": "^3.9.1",
@@ -151,7 +151,7 @@
151151
"ts-api-guardian": "^0.4.6",
152152
"ts-node": "^3.0.4",
153153
"tsconfig-paths": "^2.3.0",
154-
"tslint": "^5.19.0",
154+
"tslint": "^5.20.0",
155155
"tsutils": "^3.0.0",
156156
"typescript": "3.5.3",
157157
"uglify-js": "^2.8.14"

‎src/a11y-demo/checkbox/checkbox-a11y.ts

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -50,12 +50,18 @@ export class CheckboxAccessibilityDemo {
5050
return task.completed || (subtasks != null && subtasks.every(t => t.completed));
5151
}
5252

53-
someComplete(tasks: Task[]): boolean {
53+
someComplete(tasks: Task[] | undefined | null): boolean {
54+
if (tasks === undefined || tasks === null) {
55+
return false;
56+
}
5457
const numComplete = tasks.filter(t => t.completed).length;
5558
return numComplete > 0 && numComplete < tasks.length;
5659
}
5760

58-
setAllCompleted(tasks: Task[], completed: boolean) {
61+
setAllCompleted(tasks: Task[] | undefined | null, completed: boolean): void {
62+
if (tasks === undefined || tasks === null) {
63+
return;
64+
}
5965
tasks.forEach(t => t.completed = completed);
6066
}
6167
}

‎src/a11y-demo/chips/chips-a11y.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
import {Component} from '@angular/core';
1010
import {MatChipInputEvent} from '@angular/material/chips';
1111
import {MatSnackBar} from '@angular/material/snack-bar';
12+
import {ThemePalette} from '@angular/material/core';
1213

1314

1415
export interface Person {
@@ -23,7 +24,7 @@ export interface Person {
2324
})
2425
export class ChipsAccessibilityDemo {
2526
visible: boolean = true;
26-
color: string = '';
27+
color: ThemePalette;
2728
selectable: boolean = true;
2829
removable: boolean = true;
2930
addOnBlur: boolean = true;

‎src/a11y-demo/grid-list/grid-list-a11y.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ export class GridListAccessibilityDemo {
3939

4040
fixedCols = 4;
4141
fixedRowHeight = 100;
42-
ratioGutter = 1;
42+
ratioGutter = '1px';
4343
fitListHeight = '400px';
4444
ratio = '4:1';
4545
}

‎src/a11y-demo/input/input-a11y.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export class InputAccessibilityDemo {
2424
email: string;
2525
usd: number;
2626
comment: string;
27-
commentMax = 200;
27+
commentMax = '200';
2828

2929
get passwordType() { return this.showPassword ? 'text' : 'password'; }
3030

‎src/cdk/stepper/stepper.ts

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ import {
3434
ViewChild,
3535
ViewEncapsulation,
3636
} from '@angular/core';
37-
import {Observable, of as obaservableOf, Subject} from 'rxjs';
37+
import {Observable, of as observableOf, Subject} from 'rxjs';
3838
import {startWith, takeUntil} from 'rxjs/operators';
3939

4040
import {CdkStepHeader} from './step-header';
@@ -124,7 +124,7 @@ export class CdkStep implements OnChanges {
124124
@ViewChild(TemplateRef, {static: true}) content: TemplateRef<any>;
125125

126126
/** The top level abstract control of the step. */
127-
@Input() stepControl: FormControlLike;
127+
@Input() stepControl: AbstractControlLike;
128128

129129
/** Whether user has seen the expanded step content or not. */
130130
interacted = false;
@@ -338,7 +338,7 @@ export class CdkStepper implements AfterViewInit, OnDestroy {
338338
.withWrap()
339339
.withVerticalOrientation(this._orientation === 'vertical');
340340

341-
(this._dir ? (this._dir.change as Observable<Direction>) : obaservableOf<Direction>())
341+
(this._dir ? (this._dir.change as Observable<Direction>) : observableOf<Direction>())
342342
.pipe(startWith(this._layoutDirection()), takeUntil(this._destroyed))
343343
.subscribe(direction => this._keyManager.withHorizontalOrientation(direction));
344344

@@ -517,12 +517,12 @@ export class CdkStepper implements AfterViewInit, OnDestroy {
517517

518518

519519
/**
520-
* Simplified representation of a FormControl from @angular/forms.
520+
* Simplified representation of an "AbstractControl" from @angular/forms.
521521
* Used to avoid having to bring in @angular/forms for a single optional interface.
522522
* @docs-private
523523
*/
524-
interface FormControlLike {
525-
asyncValidator: () => any | null;
524+
interface AbstractControlLike {
525+
asyncValidator: ((control: any) => any) | null;
526526
dirty: boolean;
527527
disabled: boolean;
528528
enabled: boolean;
@@ -531,21 +531,21 @@ interface FormControlLike {
531531
parent: any;
532532
pending: boolean;
533533
pristine: boolean;
534-
root: FormControlLike;
534+
root: AbstractControlLike;
535535
status: string;
536536
statusChanges: Observable<any>;
537537
touched: boolean;
538538
untouched: boolean;
539539
updateOn: any;
540540
valid: boolean;
541-
validator: () => any | null;
541+
validator: ((control: any) => any) | null;
542542
value: any;
543543
valueChanges: Observable<any>;
544544
clearAsyncValidators(): void;
545545
clearValidators(): void;
546546
disable(opts?: any): void;
547547
enable(opts?: any): void;
548-
get(path: (string | number)[] | string): FormControlLike | null;
548+
get(path: (string | number)[] | string): AbstractControlLike | null;
549549
getError(errorCode: string, path?: (string | number)[] | string): any;
550550
hasError(errorCode: string, path?: (string | number)[] | string): boolean;
551551
markAllAsTouched(): void;
@@ -556,15 +556,15 @@ interface FormControlLike {
556556
markAsUntouched(opts?: any): void;
557557
patchValue(value: any, options?: Object): void;
558558
reset(value?: any, options?: Object): void;
559-
setAsyncValidators(newValidator: () => any | (() => any)[] | null): void;
559+
setAsyncValidators(newValidator: (control: any) => any |
560+
((control: any) => any)[] | null): void;
560561
setErrors(errors: {[key: string]: any} | null, opts?: any): void;
561562
setParent(parent: any): void;
562-
setValidators(newValidator: () => any | (() => any)[] | null): void;
563+
setValidators(newValidator: (control: any) => any |
564+
((control: any) => any)[] | null): void;
563565
setValue(value: any, options?: Object): void;
564566
updateValueAndValidity(opts?: any): void;
565567
patchValue(value: any, options?: any): void;
566-
registerOnChange(fn: Function): void;
567-
registerOnDisabledChange(fn: (isDisabled: boolean) => void): void;
568568
reset(formState?: any, options?: any): void;
569569
setValue(value: any, options?: any): void;
570570
}

‎src/dev-app/badge/badge-demo.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ <h3>Text</h3>
66
Hello
77
</span>
88

9-
<span [matBadge]="11111" matBadgeOverlap="false">
9+
<span matBadge="11111" matBadgeOverlap="false">
1010
Hello
1111
</span>
1212

‎src/dev-app/checkbox/checkbox-demo.ts

Lines changed: 17 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
import {Component, Directive} from '@angular/core';
1010
import {MAT_CHECKBOX_CLICK_ACTION} from '@angular/material/checkbox';
1111
import {ANIMATION_MODULE_TYPE} from '@angular/platform-browser/animations';
12+
import {ThemePalette} from '@angular/material/core';
1213

1314

1415
export interface Task {
@@ -46,7 +47,7 @@ export class AnimationsNoop {
4647
margin-bottom: 4px;
4748
}
4849
`],
49-
templateUrl: 'nested-checklist.html',
50+
templateUrl: './nested-checklist.html',
5051
})
5152
export class MatCheckboxDemoNestedChecklist {
5253
tasks: Task[] = [
@@ -76,12 +77,18 @@ export class MatCheckboxDemoNestedChecklist {
7677
return task.completed || (subtasks != null && subtasks.every(t => t.completed));
7778
}
7879

79-
someComplete(tasks: Task[]): boolean {
80+
someComplete(tasks: Task[] | undefined | null): boolean {
81+
if (tasks === undefined || tasks === null) {
82+
return false;
83+
}
8084
const numComplete = tasks.filter(t => t.completed).length;
8185
return numComplete > 0 && numComplete < tasks.length;
8286
}
8387

84-
setAllCompleted(tasks: Task[], completed: boolean) {
88+
setAllCompleted(tasks: Task[] | undefined | null, completed: boolean): void {
89+
if (tasks === undefined || tasks === null) {
90+
return;
91+
}
8592
tasks.forEach(t => t.completed = completed);
8693
}
8794
}
@@ -96,20 +103,20 @@ export class CheckboxDemo {
96103
isIndeterminate: boolean = false;
97104
isChecked: boolean = false;
98105
isDisabled: boolean = false;
99-
labelPosition: string = 'after';
106+
labelPosition: 'after' | 'before' = 'after';
100107
useAlternativeColor: boolean = false;
101108

102109
demoRequired = false;
103110
demoLabelAfter = false;
104111
demoChecked = false;
105112
demoDisabled = false;
106113
demoIndeterminate = false;
107-
demoLabel = null;
108-
demoLabelledBy = null;
109-
demoId = null;
110-
demoName = null;
111-
demoValue = null;
112-
demoColor = 'primary';
114+
demoLabel: string;
115+
demoLabelledBy: string;
116+
demoId: string;
117+
demoName: string;
118+
demoValue: string;
119+
demoColor: ThemePalette = 'primary';
113120
demoDisableRipple = false;
114121
demoHideLabel = false;
115122

‎src/dev-app/chips/chips-demo.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ export interface DemoColor {
3030
export class ChipsDemo {
3131
tabIndex = 0;
3232
visible = true;
33-
color = '';
33+
color: ThemePalette;
3434
selectable = true;
3535
removable = true;
3636
addOnBlur = true;

‎src/dev-app/connected-overlay/connected-overlay-demo.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -97,7 +97,7 @@ <h2>Options</h2>
9797
<button mat-raised-button
9898
cdkOverlayOrigin
9999
type="button"
100-
[disabled]="overlayRef"
100+
[disabled]="!!overlayRef"
101101
(click)="openWithConfig()">Open</button>
102102
</div>
103103

0 commit comments

Comments
 (0)