build: ensure build uses typescript 3.9 (#19336)

We recently updated TS 3.9 in the `package.json` with
#19286, but
the build did not pick up the new version. This is
because peer dependency ranges did not accept TS 3.9,
so yarn hoisted sufficient TS versions.

Author: devversion

package.json

@@ -48,32 +48,32 @@
   },
   "version": "10.0.0-next.0",
   "dependencies": {
-    "@angular/animations": "^10.0.0-next.6",
-    "@angular/common": "^10.0.0-next.6",
-    "@angular/compiler": "^10.0.0-next.6",
-    "@angular/core": "^10.0.0-next.6",
-    "@angular/elements": "^10.0.0-next.6",
-    "@angular/forms": "^10.0.0-next.6",
-    "@angular/platform-browser": "^10.0.0-next.6",
+    "@angular/animations": "^10.0.0-next.8",
+    "@angular/common": "^10.0.0-next.8",
+    "@angular/compiler": "^10.0.0-next.8",
+    "@angular/core": "^10.0.0-next.8",
+    "@angular/elements": "^10.0.0-next.8",
+    "@angular/forms": "^10.0.0-next.8",
+    "@angular/platform-browser": "^10.0.0-next.8",
     "@types/googlemaps": "^3.39.3",
     "@types/youtube": "^0.0.38",
     "@webcomponents/custom-elements": "^1.1.0",
     "core-js": "^2.6.9",
     "material-components-web": "7.0.0-canary.058cfd23c.0",
     "rxjs": "^6.5.3",
     "systemjs": "0.19.43",
-    "tslib": "^1.10.0",
+    "tslib": "^1.12.0",
     "zone.js": "~0.10.2"
   },
   "devDependencies": {
-    "@angular-devkit/core": "^10.0.0-next.3",
-    "@angular-devkit/schematics": "^10.0.0-next.3",
-    "@angular/bazel": "^10.0.0-next.6",
-    "@angular/compiler-cli": "^10.0.0-next.6",
+    "@angular-devkit/core": "^10.0.0-next.5",
+    "@angular-devkit/schematics": "^10.0.0-next.5",
+    "@angular/bazel": "^10.0.0-next.8",
+    "@angular/compiler-cli": "^10.0.0-next.8",
     "@angular/dev-infra-private": "https://github.com/angular/dev-infra-private-builds.git#414d7dd979092cb52d60b58596927abbc26d40b9",
-    "@angular/platform-browser-dynamic": "^10.0.0-next.6",
-    "@angular/platform-server": "^10.0.0-next.6",
-    "@angular/router": "^10.0.0-next.6",
+    "@angular/platform-browser-dynamic": "^10.0.0-next.8",
+    "@angular/platform-server": "^10.0.0-next.8",
+    "@angular/router": "^10.0.0-next.8",
     "@bazel/bazelisk": "^1.4.0",
     "@bazel/buildifier": "^2.2.1",
     "@bazel/ibazel": "^0.13.0",
@@ -83,7 +83,7 @@
     "@bazel/typescript": "^1.6.0",
     "@firebase/app-types": "^0.3.2",
     "@octokit/rest": "16.28.7",
-    "@schematics/angular": "^10.0.0-next.3",
+    "@schematics/angular": "^10.0.0-next.5",
     "@types/autoprefixer": "^9.7.2",
     "@types/browser-sync": "^2.26.1",
     "@types/fs-extra": "^4.0.3",
@@ -161,7 +161,7 @@
     "tsickle": "0.38.1",
     "tslint": "^6.1.0",
     "tsutils": "^3.17.1",
-    "typescript": "3.9.1-rc",
+    "typescript": "3.9.2",
     "typescript-3.6": "npm:typescript@~3.6.4",
     "typescript-3.7": "npm:typescript@~3.7.0",
     "typescript-3.8": "npm:typescript@~3.8.0",
@@ -170,7 +170,7 @@
     "yargs": "15.3.0"
   },
   "resolutions": {
-    "dgeni-packages/typescript": "3.8.3",
+    "dgeni-packages/typescript": "3.9.2",
     "**/graceful-fs": "4.2.2"
   }
 }

src/bazel-tsconfig-test.json

@@ -4,7 +4,7 @@
 {
   "extends": "./bazel-tsconfig-build.json",
   "compilerOptions": {
-    "importHelpers": false,
+    "importHelpers": true,
     "types": ["jasmine"]
   },
   "bazelOptions": {

src/cdk/schematics/BUILD.bazel

@@ -23,7 +23,11 @@ ts_library(
             "testing/**/*.ts",
         ],
     ),
+    # Schematics do not need to run in browsers and can use `commonjs`
+    # as format instead the default `umd` format.
+    devmode_module = "commonjs",
     module_name = "@angular/cdk/schematics",
+    prodmode_module = "commonjs",
     tsconfig = ":tsconfig.json",
     deps = [
         "//src/cdk/schematics/update-tool",

src/cdk/schematics/testing/BUILD.bazel

@@ -5,7 +5,11 @@ package(default_visibility = ["//visibility:public"])
 ts_library(
     name = "testing",
     srcs = glob(["**/*.ts"]),
+    # Schematics do not need to run in browsers and can use `commonjs`
+    # as format instead the default `umd` format.
+    devmode_module = "commonjs",
     module_name = "@angular/cdk/schematics/testing",
+    prodmode_module = "commonjs",
     tsconfig = "tsconfig.json",
     deps = [
         "@npm//@angular-devkit/core",

src/cdk/schematics/testing/test-case-setup.ts

@@ -232,7 +232,7 @@ export function _patchTypeScriptDefaultLib(tree: Tree) {
     if (filePath.match(/node_modules[/\\]typescript/)) {
       return readFileSync(getSystemPath(filePath));
     } else {
-      return _originalRead.apply(this, arguments);
+      return _originalRead.call(this, filePath);
     }
   };
 }

src/cdk/schematics/testing/tsconfig.json

@@ -1,5 +1,6 @@
 {
   "compilerOptions": {
+    "strict": true,
     "lib": ["es2015"],
     "types": ["node", "jasmine", "glob"]
   }

src/cdk/schematics/update-tool/BUILD.bazel

@@ -5,7 +5,11 @@ package(default_visibility = ["//visibility:public"])
 ts_library(
     name = "update-tool",
     srcs = glob(["**/*.ts"]),
+    # Schematics do not need to run in browsers and can use `commonjs`
+    # as format instead the default `umd` format.
+    devmode_module = "commonjs",
     module_name = "@angular/cdk/schematics/update-tool",
+    prodmode_module = "commonjs",
     tsconfig = ":tsconfig.json",
     deps = [
         "@npm//@types/node",

src/google-maps/google-map/google-map.spec.ts

@@ -3,17 +3,8 @@ import {async, TestBed} from '@angular/core/testing';
 import {By} from '@angular/platform-browser';
 
 import {GoogleMapsModule} from '../google-maps-module';
-import {
-  createMapConstructorSpy,
-  createMapSpy,
-  TestingWindow
-} from '../testing/fake-google-map-utils';
-import {
-  DEFAULT_HEIGHT,
-  DEFAULT_OPTIONS,
-  DEFAULT_WIDTH,
-  GoogleMap,
-} from './google-map';
+import {createMapConstructorSpy, createMapSpy} from '../testing/fake-google-map-utils';
+import {DEFAULT_HEIGHT, DEFAULT_OPTIONS, DEFAULT_WIDTH, GoogleMap} from './google-map';
 
 /** Represents boundaries of a map to be used in tests. */
 const testBounds: google.maps.LatLngBoundsLiteral = {
@@ -47,8 +38,7 @@ describe('GoogleMap', () => {
   });
 
   afterEach(() => {
-    const testingWindow: TestingWindow = window;
-    delete testingWindow.google;
+    delete window.google;
   });
 
   it('throws an error is the Google Maps JavaScript API was not loaded', () => {

src/google-maps/map-circle/map-circle.spec.ts

@@ -9,7 +9,6 @@ import {
   createCircleSpy,
   createMapConstructorSpy,
   createMapSpy,
-  TestingWindow,
 } from '../testing/fake-google-map-utils';
 
 import {MapCircle} from './map-circle';
@@ -43,8 +42,7 @@ describe('MapCircle', () => {
   });
 
   afterEach(() => {
-    const testingWindow: TestingWindow = window;
-    delete testingWindow.google;
+    delete window.google;
   });
 
   it('initializes a Google Map Circle', () => {

src/google-maps/map-ground-overlay/map-ground-overlay.spec.ts

@@ -9,7 +9,6 @@ import {
   createGroundOverlaySpy,
   createMapConstructorSpy,
   createMapSpy,
-  TestingWindow,
 } from '../testing/fake-google-map-utils';
 
 import {MapGroundOverlay} from './map-ground-overlay';
@@ -37,8 +36,7 @@ describe('MapGroundOverlay', () => {
   });
 
   afterEach(() => {
-    const testingWindow: TestingWindow = window;
-    delete testingWindow.google;
+    delete window.google;
   });
 
   it('initializes a Google Map Ground Overlay', () => {

src/google-maps/map-info-window/map-info-window.spec.ts

@@ -3,16 +3,15 @@ import {async, TestBed} from '@angular/core/testing';
 import {By} from '@angular/platform-browser';
 
 import {DEFAULT_OPTIONS} from '../google-map/google-map';
+
+import {GoogleMapsModule} from '../google-maps-module';
 import {MapMarker} from '../map-marker/map-marker';
 import {
   createInfoWindowConstructorSpy,
   createInfoWindowSpy,
   createMapConstructorSpy,
-  createMapSpy,
-  TestingWindow
+  createMapSpy
 } from '../testing/fake-google-map-utils';
-
-import {GoogleMapsModule} from '../google-maps-module';
 import {MapInfoWindow} from './map-info-window';
 
 describe('MapInfoWindow', () => {
@@ -33,8 +32,7 @@ describe('MapInfoWindow', () => {
   });
 
   afterEach(() => {
-    const testingWindow: TestingWindow = window;
-    delete testingWindow.google;
+    delete window.google;
   });
 
   it('initializes a Google Map Info Window', () => {

src/google-maps/map-marker/map-marker.spec.ts

@@ -3,15 +3,14 @@ import {async, TestBed} from '@angular/core/testing';
 import {By} from '@angular/platform-browser';
 
 import {DEFAULT_OPTIONS} from '../google-map/google-map';
+
+import {GoogleMapsModule} from '../google-maps-module';
 import {
   createMapConstructorSpy,
   createMapSpy,
   createMarkerConstructorSpy,
-  createMarkerSpy,
-  TestingWindow
+  createMarkerSpy
 } from '../testing/fake-google-map-utils';
-
-import {GoogleMapsModule} from '../google-maps-module';
 import {DEFAULT_MARKER_OPTIONS, MapMarker} from './map-marker';
 
 describe('MapMarker', () => {
@@ -32,8 +31,7 @@ describe('MapMarker', () => {
   });
 
   afterEach(() => {
-    const testingWindow: TestingWindow = window;
-    delete testingWindow.google;
+    delete window.google;
   });
 
   it('initializes a Google Map marker', () => {

src/google-maps/map-polygon/map-polygon.spec.ts

@@ -9,7 +9,6 @@ import {
   createMapSpy,
   createPolygonConstructorSpy,
   createPolygonSpy,
-  TestingWindow,
 } from '../testing/fake-google-map-utils';
 
 import {MapPolygon} from './map-polygon';
@@ -36,8 +35,7 @@ describe('MapPolygon', () => {
   });
 
   afterEach(() => {
-    const testingWindow: TestingWindow = window;
-    delete testingWindow.google;
+    delete window.google;
   });
 
   it('initializes a Google Map Polygon', () => {

src/google-maps/map-polyline/map-polyline.spec.ts

@@ -9,7 +9,6 @@ import {
   createMapSpy,
   createPolylineConstructorSpy,
   createPolylineSpy,
-  TestingWindow,
 } from '../testing/fake-google-map-utils';
 
 import {MapPolyline} from './map-polyline';
@@ -40,8 +39,7 @@ describe('MapPolyline', () => {
   });
 
   afterEach(() => {
-    const testingWindow: TestingWindow = window;
-    delete testingWindow.google;
+    delete window.google;
   });
 
   it('initializes a Google Map Polyline', () => {

src/google-maps/map-rectangle/map-rectangle.spec.ts

@@ -9,7 +9,6 @@ import {
   createMapSpy,
   createRectangleConstructorSpy,
   createRectangleSpy,
-  TestingWindow,
 } from '../testing/fake-google-map-utils';
 
 import {MapRectangle} from './map-rectangle';
@@ -36,8 +35,7 @@ describe('MapRectangle', () => {
   });
 
   afterEach(() => {
-    const testingWindow: TestingWindow = window;
-    delete testingWindow.google;
+    delete window.google;
   });
 
   it('initializes a Google Map Rectangle', () => {

src/google-maps/testing/fake-google-map-utils.ts

@@ -6,6 +6,12 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
+// The global `window` variable is typed as an intersection of `Window` and `globalThis`.
+// We re-declare `window` here and omit `globalThis` as it is typed with the actual Google
+// Maps types which we intend to override with jasmine spies for testing. Keeping `globalThis`
+// would mean that `window` is not assignable to our testing window.
+declare var window: Window;
+
 /** Window interface for testing */
 export interface TestingWindow extends Window {
   google?: {

src/material/button-toggle/button-toggle.e2e.spec.ts

@@ -5,7 +5,7 @@ describe('button-toggle', () => {
   beforeEach(async () => await browser.get('/button-toggle'));
 
   it('should show a button-toggle', async () => {
-    expect(await element(by.tagName('mat-button-toggle'))).toBeDefined();
+    expect(await element(by.tagName('mat-button-toggle')).isPresent()).toBe(true);
   });
 
 });

src/material/card/card.e2e.spec.ts

@@ -5,7 +5,7 @@ describe('mat-card', () => {
   beforeEach(async () => await browser.get('/cards'));
 
   it('should show a card', async () => {
-    expect(await element(by.tagName('mat-card'))).toBeDefined();
+    expect(await element(by.tagName('mat-card')).isPresent()).toBe(true);
   });
 
 });

src/material/expansion/expansion.e2e.spec.ts

@@ -4,7 +4,7 @@ describe('expansion', () => {
   beforeEach(async () => await browser.get('/expansion'));
 
   it('should show an accordion', async () => {
-    expect(await element(by.css('.mat-accordion'))).toBeDefined();
+    expect(await element(by.css('.mat-accordion')).isPresent()).toBe(true);
   });
 
   it('should show two panels', async () => {

src/material/schematics/BUILD.bazel

@@ -22,7 +22,11 @@ ts_library(
             "ng-generate/*/files/**/*.ts",
         ],
     ),
+    # Schematics do not need to run in browsers and can use `commonjs`
+    # as format instead the default `umd` format.
+    devmode_module = "commonjs",
     module_name = "@angular/material/schematics",
+    prodmode_module = "commonjs",
     tsconfig = ":tsconfig.json",
     deps = [
         "//src/cdk/schematics",

src/material/toolbar/toolbar.e2e.spec.ts

@@ -5,7 +5,7 @@ describe('mat-toolbar', () => {
   beforeEach(async () => await browser.get('/toolbar'));
 
   it('should show a toolbar', async () => {
-    expect(await element(by.tagName('mat-toolbar'))).toBeDefined();
+    expect(await element(by.tagName('mat-toolbar')).isPresent()).toBe(true);
   });
 
 });