feat(core): support TypeScript 4.8

Adds support for TypeScript 4.8 and resolves some issues that came up as a result of the update.

Most of the issues came from some changes in TypeScript where the `decorators` and `modifiers` properties were removed from most node types, and were combined into a single `modifiers` array. Since we need to continue supporting TS 4.6 and 4.7 until v15, I ended up creating a new `ngtsc/ts_compatibility` directory to make it easier to reuse the new backwards-compatible code.

integration/animations/package.json

@@ -42,6 +42,6 @@
     "protractor": "file:../../node_modules/protractor",
     "ts-node": "8.3.0",
     "tslint": "5.18.0",
-    "typescript": "file:../../node_modules/typescript"
+    "typescript": "~4.7.2"
   }
 }

integration/cli-hello-world-ivy-compat/package.json

@@ -44,6 +44,6 @@
     "protractor": "file:../../node_modules/protractor",
     "ts-node": "8.3.0",
     "tslint": "5.18.0",
-    "typescript": "file:../../node_modules/typescript"
+    "typescript": "~4.7.2"
   }
 }

integration/cli-hello-world-mocha/package.json

@@ -47,6 +47,6 @@
     "protractor": "file:../../node_modules/protractor",
     "ts-node": "8.3.0",
     "tslint": "5.18.0",
-    "typescript": "file:../../node_modules/typescript"
+    "typescript": "~4.7.2"
   }
 }

integration/cli-hello-world/package.json

@@ -43,6 +43,6 @@
     "protractor": "file:../../node_modules/protractor",
     "ts-node": "8.3.0",
     "tslint": "5.18.0",
-    "typescript": "file:../../node_modules/typescript"
+    "typescript": "~4.7.2"
   }
 }

integration/forms/package.json

@@ -43,6 +43,6 @@
     "protractor": "file:../../node_modules/protractor",
     "ts-node": "8.3.0",
     "tslint": "5.18.0",
-    "typescript": "file:../../node_modules/typescript"
+    "typescript": "~4.7.2"
   }
 }

integration/ivy-i18n/package.json

@@ -64,6 +64,6 @@
     "serve": "11.2.0",
     "ts-node": "8.3.0",
     "tslint": "5.18.0",
-    "typescript": "file:../../node_modules/typescript"
+    "typescript": "~4.7.2"
   }
 }

integration/trusted-types/package.json

@@ -41,6 +41,6 @@
     "protractor": "file:../../node_modules/protractor",
     "ts-node": "8.3.0",
     "tslint": "6.1.3",
-    "typescript": "file:../../node_modules/typescript"
+    "typescript": "~4.7.2"
   }
 }

integration/typings_test_ts48/BUILD.bazel

@@ -0,0 +1,9 @@
+load("//integration:index.bzl", "ng_integration_test")
+
+ng_integration_test(
+    name = "test",
+    # Special case for `typings_test_ts48` test as we want to pin
+    # `typescript` at version 4.8.x for that test and not link to the
+    # root @npm//typescript package.
+    pinned_npm_packages = ["typescript"],
+)

integration/typings_test_ts48/include-all.ts

@@ -0,0 +1,71 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+
+
+import * as animations from '@angular/animations';
+import * as animationsBrowser from '@angular/animations/browser';
+import * as animationsBrowserTesting from '@angular/animations/browser/testing';
+import * as common from '@angular/common';
+import * as commonHttp from '@angular/common/http';
+import * as commonTesting from '@angular/common/testing';
+import * as commonHttpTesting from '@angular/common/testing';
+import * as compiler from '@angular/compiler';
+import * as compilerTesting from '@angular/compiler/testing';
+import * as core from '@angular/core';
+import * as coreTesting from '@angular/core/testing';
+import * as elements from '@angular/elements';
+import * as forms from '@angular/forms';
+import * as localize from '@angular/localize';
+import * as platformBrowser from '@angular/platform-browser';
+import * as platformBrowserDynamic from '@angular/platform-browser-dynamic';
+import * as platformBrowserDynamicTesting from '@angular/platform-browser-dynamic/testing';
+import * as platformBrowserAnimations from '@angular/platform-browser/animations';
+import * as platformBrowserTesting from '@angular/platform-browser/testing';
+import * as platformServer from '@angular/platform-server';
+import * as platformServerInit from '@angular/platform-server/init';
+import * as platformServerTesting from '@angular/platform-server/testing';
+import * as router from '@angular/router';
+import * as routerTesting from '@angular/router/testing';
+import * as routerUpgrade from '@angular/router/upgrade';
+import * as serviceWorker from '@angular/service-worker';
+import * as upgrade from '@angular/upgrade';
+import * as upgradeStatic from '@angular/upgrade/static';
+import * as upgradeTesting from '@angular/upgrade/static/testing';
+
+export default {
+  animations,
+  animationsBrowser,
+  animationsBrowserTesting,
+  common,
+  commonTesting,
+  commonHttp,
+  commonHttpTesting,
+  compiler,
+  compilerTesting,
+  core,
+  coreTesting,
+  elements,
+  forms,
+  localize,
+  platformBrowser,
+  platformBrowserTesting,
+  platformBrowserDynamic,
+  platformBrowserDynamicTesting,
+  platformBrowserAnimations,
+  platformServer,
+  platformServerInit,
+  platformServerTesting,
+  router,
+  routerTesting,
+  routerUpgrade,
+  serviceWorker,
+  upgrade,
+  upgradeStatic,
+  upgradeTesting,
+};

integration/typings_test_ts48/package.json

@@ -0,0 +1,29 @@
+{
+  "name": "angular-integration",
+  "description": "Assert that users with TypeScript 4.8 can type-check an Angular application",
+  "version": "0.0.0",
+  "license": "MIT",
+  "dependencies": {
+    "@angular/animations": "file:../../dist/packages-dist/animations",
+    "@angular/common": "file:../../dist/packages-dist/common",
+    "@angular/compiler": "file:../../dist/packages-dist/compiler",
+    "@angular/compiler-cli": "file:../../dist/packages-dist/compiler-cli",
+    "@angular/core": "file:../../dist/packages-dist/core",
+    "@angular/elements": "file:../../dist/packages-dist/elements",
+    "@angular/forms": "file:../../dist/packages-dist/forms",
+    "@angular/localize": "file:../../dist/packages-dist/localize",
+    "@angular/platform-browser": "file:../../dist/packages-dist/platform-browser",
+    "@angular/platform-browser-dynamic": "file:../../dist/packages-dist/platform-browser-dynamic",
+    "@angular/platform-server": "file:../../dist/packages-dist/platform-server",
+    "@angular/router": "file:../../dist/packages-dist/router",
+    "@angular/service-worker": "file:../../dist/packages-dist/service-worker",
+    "@angular/upgrade": "file:../../dist/packages-dist/upgrade",
+    "@types/jasmine": "file:../../node_modules/@types/jasmine",
+    "rxjs": "file:../../node_modules/rxjs",
+    "typescript": "4.8.0-beta",
+    "zone.js": "file:../../dist/zone.js-dist/archive/zone.js.tgz"
+  },
+  "scripts": {
+    "test": "tsc"
+  }
+}

integration/typings_test_ts48/tsconfig.json

@@ -0,0 +1,26 @@
+{
+  "compilerOptions": {
+    "forceConsistentCasingInFileNames": true,
+    "strict": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true,
+    "experimentalDecorators": true,
+    "module": "commonjs",
+    "moduleResolution": "node",
+    "outDir": "./dist/out-tsc",
+    "rootDir": ".",
+    "target": "es5",
+    "lib": [
+      "es5",
+      "dom",
+      "es2015.collection",
+      "es2015.iterable",
+      "es2015.promise"
+    ],
+    "types": [],
+  },
+  "files": [
+    "include-all.ts",
+    "node_modules/@types/jasmine/index.d.ts"
+  ]
+}

package.json

@@ -172,7 +172,7 @@
     "tsickle": "0.46.3",
     "tslib": "^2.3.0",
     "tslint": "6.1.3",
-    "typescript": "~4.7.2",
+    "typescript": "4.8.0-beta",
     "webtreemap": "^2.0.1",
     "xhr2": "0.2.1",
     "yargs": "^17.2.1"

packages/bazel/package.json

@@ -36,7 +36,7 @@
     "rollup": "^2.56.3",
     "rollup-plugin-sourcemaps": "^0.6.3",
     "terser": "^5.9.0",
-    "typescript": ">=4.6.2 <4.8"
+    "typescript": ">=4.6.2 <4.9"
   },
   "peerDependenciesMeta": {
     "terser": {

packages/compiler-cli/ngcc/BUILD.bazel

@@ -32,6 +32,7 @@ ts_library(
         "//packages/compiler-cli/src/ngtsc/sourcemaps",
         "//packages/compiler-cli/src/ngtsc/transform",
         "//packages/compiler-cli/src/ngtsc/translator",
+        "//packages/compiler-cli/src/ngtsc/ts_compatibility",
         "//packages/compiler-cli/src/ngtsc/util",
         "@npm//@types/convert-source-map",
         "@npm//@types/node",

packages/compiler-cli/ngcc/src/host/esm2015_host.ts

@@ -11,6 +11,7 @@ import ts from 'typescript';
 import {absoluteFromSourceFile} from '../../../src/ngtsc/file_system';
 import {Logger} from '../../../src/ngtsc/logging';
 import {ClassDeclaration, ClassMember, ClassMemberKind, CtorParameter, Declaration, DeclarationNode, Decorator, EnumMember, Import, isConcreteDeclaration, isDecoratorIdentifier, isNamedClassDeclaration, isNamedFunctionDeclaration, isNamedVariableDeclaration, KnownDeclaration, reflectObjectLiteral, SpecialDeclarationKind, TypeScriptReflectionHost, TypeValueReference, TypeValueReferenceKind, ValueUnavailableKind} from '../../../src/ngtsc/reflection';
+import {getModifiers} from '../../../src/ngtsc/ts_compatibility';
 import {isSymbolWithValueDeclaration, SymbolWithValueDeclaration} from '../../../src/ngtsc/util/src/typescript';
 import {isWithinPackage} from '../analysis/util';
 import {BundleProgram} from '../packages/bundle_program';
@@ -1534,8 +1535,9 @@ export class Esm2015ReflectionHost extends TypeScriptReflectionHost implements N
     // If we have still not determined if this is a static or instance member then
     // look for the `static` keyword on the declaration
     if (isStatic === undefined) {
-      isStatic = node.modifiers !== undefined &&
-          node.modifiers.some(mod => mod.kind === ts.SyntaxKind.StaticKeyword);
+      const modifiers = getModifiers(node);
+      isStatic = modifiers !== undefined &&
+          modifiers.some(mod => mod.kind === ts.SyntaxKind.StaticKeyword);
     }
 
     const type: ts.TypeNode = (node as any).type || null;

packages/compiler-cli/package.json

@@ -66,7 +66,7 @@
   },
   "peerDependencies": {
     "@angular/compiler": "0.0.0-PLACEHOLDER",
-    "typescript": ">=4.6.2 <4.8"
+    "typescript": ">=4.6.2 <4.9"
   },
   "repository": {
     "type": "git",

packages/compiler-cli/src/ngtsc/core/BUILD.bazel

@@ -32,6 +32,7 @@ ts_library(
         "//packages/compiler-cli/src/ngtsc/shims",
         "//packages/compiler-cli/src/ngtsc/shims:api",
         "//packages/compiler-cli/src/ngtsc/transform",
+        "//packages/compiler-cli/src/ngtsc/ts_compatibility",
         "//packages/compiler-cli/src/ngtsc/typecheck",
         "//packages/compiler-cli/src/ngtsc/typecheck/api",
         "//packages/compiler-cli/src/ngtsc/typecheck/diagnostics",

packages/compiler-cli/src/ngtsc/core/src/compiler.ts

@@ -27,6 +27,7 @@ import {ComponentScopeReader, CompoundComponentScopeReader, LocalModuleScopeRegi
 import {StandaloneComponentScopeReader} from '../../scope/src/standalone';
 import {generatedFactoryTransform} from '../../shims';
 import {aliasTransformFactory, CompilationMode, declarationTransformFactory, DecoratorHandler, DtsTransformRegistry, ivyTransformFactory, TraitCompiler} from '../../transform';
+import {getModifiers} from '../../ts_compatibility';
 import {TemplateTypeCheckerImpl} from '../../typecheck';
 import {OptimizeFor, TemplateTypeChecker, TypeCheckingConfig} from '../../typecheck/api';
 import {ALL_DIAGNOSTIC_FACTORIES, ExtendedTemplateCheckerImpl} from '../../typecheck/extended';
@@ -1107,8 +1108,7 @@ export function isAngularCorePackage(program: ts.Program): boolean {
       return false;
     }
     // It must be exported.
-    if (stmt.modifiers === undefined ||
-        !stmt.modifiers.some(mod => mod.kind === ts.SyntaxKind.ExportKeyword)) {
+    if (!getModifiers(stmt)?.some(mod => mod.kind === ts.SyntaxKind.ExportKeyword)) {
       return false;
     }
     // It must declare ITS_JUST_ANGULAR.

packages/compiler-cli/src/ngtsc/metadata/BUILD.bazel

@@ -12,6 +12,7 @@ ts_library(
         "//packages/compiler-cli/src/ngtsc/file_system",
         "//packages/compiler-cli/src/ngtsc/imports",
         "//packages/compiler-cli/src/ngtsc/reflection",
+        "//packages/compiler-cli/src/ngtsc/ts_compatibility",
         "//packages/compiler-cli/src/ngtsc/util",
         "@npm//typescript",
     ],

packages/compiler-cli/src/ngtsc/metadata/src/util.ts

@@ -10,6 +10,7 @@ import ts from 'typescript';
 
 import {OwningModule, Reference} from '../../imports';
 import {ClassDeclaration, ClassMember, ClassMemberKind, isNamedClassDeclaration, ReflectionHost, reflectTypeEntityToDeclaration} from '../../reflection';
+import {getModifiers} from '../../ts_compatibility';
 import {nodeDebugInfo} from '../../util/src/typescript';
 
 import {DirectiveMeta, DirectiveTypeCheckMeta, MetadataReader, NgModuleMeta, PipeMeta, TemplateGuardMeta} from './api';
@@ -150,14 +151,11 @@ export function extractDirectiveTypeCheckMeta(
 }
 
 function isRestricted(node: ts.Node): boolean {
-  if (node.modifiers === undefined) {
-    return false;
-  }
-
-  return node.modifiers.some(
-      modifier => modifier.kind === ts.SyntaxKind.PrivateKeyword ||
-          modifier.kind === ts.SyntaxKind.ProtectedKeyword ||
-          modifier.kind === ts.SyntaxKind.ReadonlyKeyword);
+  return getModifiers(node)?.some(
+             ({kind}) => kind === ts.SyntaxKind.PrivateKeyword ||
+                 kind === ts.SyntaxKind.ProtectedKeyword ||
+                 kind === ts.SyntaxKind.ReadonlyKeyword) ||
+      false;
 }
 
 function extractTemplateGuard(member: ClassMember): TemplateGuardMeta|null {

packages/compiler-cli/src/ngtsc/partial_evaluator/BUILD.bazel

@@ -15,6 +15,7 @@ ts_library(
         "//packages/compiler-cli/src/ngtsc/imports",
         "//packages/compiler-cli/src/ngtsc/incremental:api",
         "//packages/compiler-cli/src/ngtsc/reflection",
+        "//packages/compiler-cli/src/ngtsc/ts_compatibility",
         "//packages/compiler-cli/src/ngtsc/util",
         "@npm//@types/node",
         "@npm//typescript",

packages/compiler-cli/src/ngtsc/partial_evaluator/src/interpreter.ts

@@ -12,6 +12,7 @@ import {Reference} from '../../imports';
 import {OwningModule} from '../../imports/src/references';
 import {DependencyTracker} from '../../incremental/api';
 import {Declaration, DeclarationKind, DeclarationNode, EnumMember, FunctionDefinition, isConcreteDeclaration, ReflectionHost, SpecialDeclarationKind} from '../../reflection';
+import {getModifiers} from '../../ts_compatibility';
 import {isDeclaration} from '../../util/src/typescript';
 
 import {ArrayConcatBuiltinFn, ArraySliceBuiltinFn, StringConcatBuiltinFn} from './builtin';
@@ -746,8 +747,7 @@ function isVariableDeclarationDeclared(node: ts.VariableDeclaration): boolean {
     return false;
   }
   const varStmt = declList.parent;
-  return varStmt.modifiers !== undefined &&
-      varStmt.modifiers.some(mod => mod.kind === ts.SyntaxKind.DeclareKeyword);
+  return getModifiers(varStmt)?.some(mod => mod.kind === ts.SyntaxKind.DeclareKeyword) || false;
 }
 
 const EMPTY = {};

packages/compiler-cli/src/ngtsc/reflection/BUILD.bazel

@@ -7,5 +7,8 @@ ts_library(
     srcs = ["index.ts"] + glob([
         "src/**/*.ts",
     ]),
-    deps = ["@npm//typescript"],
+    deps = [
+        "//packages/compiler-cli/src/ngtsc/ts_compatibility",
+        "@npm//typescript",
+    ],
 )