feat(cdk): switch injectables to new scope API (#10301)

* feat(cdk): switch injectables to new scope API

* Update rxjs version

* Update CDK to new API

* Fix TS 2.7 error.

* Update package lock

Author: jelbourn

package-lock.json

@@ -26,14 +26,14 @@
     "node": ">= 5.4.1"
   },
   "dependencies": {
-    "@angular/animations": ">=6.0.0-beta.7 <7.0.0",
-    "@angular/common": ">=6.0.0-beta.7 <7.0.0",
-    "@angular/compiler": ">=6.0.0-beta.7 <7.0.0",
-    "@angular/core": ">=6.0.0-beta.7 <7.0.0",
-    "@angular/forms": ">=6.0.0-beta.7 <7.0.0",
-    "@angular/platform-browser": ">=6.0.0-beta.7 <7.0.0",
+    "@angular/animations": "6.0.0-beta.8",
+    "@angular/common": "6.0.0-beta.8",
+    "@angular/compiler": "6.0.0-beta.8",
+    "@angular/core": "6.0.0-beta.8",
+    "@angular/forms": "6.0.0-beta.8",
+    "@angular/platform-browser": "6.0.0-beta.8",
     "core-js": "^2.4.1",
-    "rxjs": "^5.5.5",
+    "rxjs": "^5.5.7",
     "systemjs": "0.19.43",
     "tsickle": "^0.24.x",
     "tslib": "^1.7.1",
@@ -42,11 +42,11 @@
   "devDependencies": {
     "@angular-devkit/core": "^0.4.5",
     "@angular-devkit/schematics": "^0.4.5",
-    "@angular/bazel": ">=6.0.0-beta.7 <7.0.0",
-    "@angular/compiler-cli": ">=6.0.0-beta.7 <7.0.0",
-    "@angular/http": ">=6.0.0-beta.7 <7.0.0",
-    "@angular/platform-browser-dynamic": ">=6.0.0-beta.7 <7.0.0",
-    "@angular/platform-server": ">=6.0.0-beta.7 <7.0.0",
+    "@angular/bazel": "6.0.0-beta.8",
+    "@angular/compiler-cli": "6.0.0-beta.8",
+    "@angular/http": "6.0.0-beta.8",
+    "@angular/platform-browser-dynamic": "6.0.0-beta.8",
+    "@angular/platform-server": "6.0.0-beta.8",
     "@angular/router": ">=6.0.0-beta.7 <7.0.0",
     "@angular/upgrade": "^5.0.1",
     "@bazel/ibazel": "0.3.1",
@@ -126,7 +126,7 @@
     "tsconfig-paths": "^2.3.0",
     "tslint": "^5.9.1",
     "tsutils": "^2.6.0",
-    "typescript": "~2.6.0",
+    "typescript": "~2.7.0",
     "uglify-js": "^2.8.14",
     "web-animations-js": "^2.2.5"
   }

package.json

@@ -9,23 +9,12 @@
 import {PlatformModule} from '@angular/cdk/platform';
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
-import {ARIA_DESCRIBER_PROVIDER, AriaDescriber} from './aria-describer/aria-describer';
-import {CdkMonitorFocus, FOCUS_MONITOR_PROVIDER} from './focus-monitor/focus-monitor';
-import {CdkTrapFocus, FocusTrapFactory} from './focus-trap/focus-trap';
-import {InteractivityChecker} from './interactivity-checker/interactivity-checker';
-import {LIVE_ANNOUNCER_PROVIDER} from './live-announcer/live-announcer';
+import {CdkMonitorFocus} from './focus-monitor/focus-monitor';
+import {CdkTrapFocus} from './focus-trap/focus-trap';
 
 @NgModule({
   imports: [CommonModule, PlatformModule],
   declarations: [CdkTrapFocus, CdkMonitorFocus],
   exports: [CdkTrapFocus, CdkMonitorFocus],
-  providers: [
-    InteractivityChecker,
-    FocusTrapFactory,
-    AriaDescriber,
-    LIVE_ANNOUNCER_PROVIDER,
-    ARIA_DESCRIBER_PROVIDER,
-    FOCUS_MONITOR_PROVIDER,
-  ]
 })
 export class A11yModule {}

src/cdk/a11y/a11y-module.ts

@@ -6,10 +6,17 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {Injectable, Inject, InjectionToken, Optional, SkipSelf} from '@angular/core';
 import {DOCUMENT} from '@angular/common';
+import {
+  Inject,
+  Injectable,
+  InjectionToken,
+  Optional,
+  SkipSelf,
+} from '@angular/core';
 import {addAriaReferencedId, getAriaReferenceIds, removeAriaReferencedId} from './aria-reference';
 
+
 /**
  * Interface used to register message elements and keep a count of how many registrations have
  * the same message and the reference to the message element used for the `aria-describedby`.
@@ -46,7 +53,7 @@ let messagesContainer: HTMLElement | null = null;
  * content.
  * @docs-private
  */
-@Injectable()
+@Injectable({providedIn: 'root'})
 export class AriaDescriber {
   private _document: Document;
 
@@ -204,12 +211,13 @@ export class AriaDescriber {
 
 }
 
-/** @docs-private */
+
+/** @docs-private @deprecated @deletion-target 7.0.0 */
 export function ARIA_DESCRIBER_PROVIDER_FACTORY(parentDispatcher: AriaDescriber, _document: any) {
   return parentDispatcher || new AriaDescriber(_document);
 }
 
-/** @docs-private */
+/** @docs-private @deprecated @deletion-target 7.0.0 */
 export const ARIA_DESCRIBER_PROVIDER = {
   // If there is already an AriaDescriber available, use that. Otherwise, provide a new one.
   provide: AriaDescriber,

src/cdk/a11y/aria-describer/aria-describer.ts

@@ -5,6 +5,7 @@
  * 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 {Platform, supportsPassiveEventListeners} from '@angular/cdk/platform';
 import {
   Directive,
@@ -39,7 +40,7 @@ type MonitoredElementInfo = {
 
 
 /** Monitors mouse and keyboard events to determine the cause of focus events. */
-@Injectable()
+@Injectable({providedIn: 'root'})
 export class FocusMonitor implements OnDestroy {
   /** The focus origin that the next focus event is a result of. */
   private _origin: FocusOrigin = null;
@@ -380,13 +381,13 @@ export class CdkMonitorFocus implements OnDestroy {
   }
 }
 
-/** @docs-private */
+/** @docs-private @deprecated @deletion-target 7.0.0 */
 export function FOCUS_MONITOR_PROVIDER_FACTORY(
     parentDispatcher: FocusMonitor, ngZone: NgZone, platform: Platform) {
   return parentDispatcher || new FocusMonitor(ngZone, platform);
 }
 
-/** @docs-private */
+/** @docs-private @deprecated @deletion-target 7.0.0 */
 export const FOCUS_MONITOR_PROVIDER = {
   // If there is already a FocusMonitor available, use that. Otherwise, provide a new one.
   provide: FocusMonitor,

src/cdk/a11y/focus-monitor/focus-monitor.ts

@@ -6,20 +6,20 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
+import {coerceBooleanProperty} from '@angular/cdk/coercion';
+import {DOCUMENT} from '@angular/common';
 import {
+  AfterContentInit,
   Directive,
   ElementRef,
+  Inject,
+  Injectable,
   Input,
   NgZone,
   OnDestroy,
-  AfterContentInit,
-  Injectable,
-  Inject,
 } from '@angular/core';
-import {coerceBooleanProperty} from '@angular/cdk/coercion';
 import {take} from 'rxjs/operators/take';
 import {InteractivityChecker} from '../interactivity-checker/interactivity-checker';
-import {DOCUMENT} from '@angular/common';
 
 
 /**
@@ -278,7 +278,7 @@ export class FocusTrap {
 
 
 /** Factory that allows easy instantiation of focus traps. */
-@Injectable()
+@Injectable({providedIn: 'root'})
 export class FocusTrapFactory {
   private _document: Document;
 

src/cdk/a11y/focus-trap/focus-trap.ts

@@ -6,8 +6,8 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {Injectable} from '@angular/core';
 import {Platform} from '@angular/cdk/platform';
+import {Injectable} from '@angular/core';
 
 
 // The InteractivityChecker leans heavily on the ally.js accessibility utilities.
@@ -18,7 +18,7 @@ import {Platform} from '@angular/cdk/platform';
  * Utility for checking the interactivity of an element, such as whether is is focusable or
  * tabbable.
  */
-@Injectable()
+@Injectable({providedIn: 'root'})
 export class InteractivityChecker {
 
   constructor(private _platform: Platform) {}

src/cdk/a11y/interactivity-checker/interactivity-checker.ts

@@ -0,0 +1,18 @@
+/**
+ * @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 {InjectionToken} from '@angular/core';
+
+// The token for the live announcer element is defined in a separate file from LiveAnnouncer
+// as a workaround for https://github.com/angular/angular/issues/22559
+
+export const LIVE_ANNOUNCER_ELEMENT_TOKEN =
+    new InjectionToken<HTMLElement | null>('liveAnnouncerElement', {
+      providedIn: 'root',
+      factory: () => null,
+    });

src/cdk/a11y/live-announcer/live-announcer-token.ts

@@ -1,8 +1,9 @@
-import {inject, fakeAsync, tick, ComponentFixture, TestBed} from '@angular/core/testing';
 import {Component} from '@angular/core';
+import {ComponentFixture, fakeAsync, inject, TestBed, tick} from '@angular/core/testing';
 import {By} from '@angular/platform-browser';
-import {LiveAnnouncer, LIVE_ANNOUNCER_ELEMENT_TOKEN} from './live-announcer';
 import {A11yModule} from '../index';
+import {LiveAnnouncer} from './live-announcer';
+import {LIVE_ANNOUNCER_ELEMENT_TOKEN} from './live-announcer-token';
 
 
 describe('LiveAnnouncer', () => {

src/cdk/a11y/live-announcer/live-announcer.spec.ts

@@ -6,25 +6,24 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
+import {DOCUMENT} from '@angular/common';
 import {
+  Inject,
   Injectable,
-  InjectionToken,
+  OnDestroy,
   Optional,
-  Inject,
+  Provider,
   SkipSelf,
-  OnDestroy,
 } from '@angular/core';
-import {DOCUMENT} from '@angular/common';
+import {LIVE_ANNOUNCER_ELEMENT_TOKEN} from './live-announcer-token';
 
 
-export const LIVE_ANNOUNCER_ELEMENT_TOKEN = new InjectionToken<HTMLElement>('liveAnnouncerElement');
-
 /** Possible politeness levels. */
 export type AriaLivePoliteness = 'off' | 'polite' | 'assertive';
 
-@Injectable()
+@Injectable({providedIn: 'root'})
 export class LiveAnnouncer implements OnDestroy {
-  private _liveElement: Element;
+  private readonly _liveElement: Element;
 
   constructor(
       @Optional() @Inject(LIVE_ANNOUNCER_ELEMENT_TOKEN) elementToken: any,
@@ -81,14 +80,15 @@ export class LiveAnnouncer implements OnDestroy {
 
 }
 
-/** @docs-private */
+
+/** @docs-private @deprecated @deletion-target 7.0.0 */
 export function LIVE_ANNOUNCER_PROVIDER_FACTORY(
     parentDispatcher: LiveAnnouncer, liveElement: any, _document: any) {
   return parentDispatcher || new LiveAnnouncer(liveElement, _document);
 }
 
-/** @docs-private */
-export const LIVE_ANNOUNCER_PROVIDER = {
+/** @docs-private @deprecated @deletion-target 7.0.0 */
+export const LIVE_ANNOUNCER_PROVIDER: Provider = {
   // If there is already a LiveAnnouncer available, use that. Otherwise, provide a new one.
   provide: LiveAnnouncer,
   deps: [

src/cdk/a11y/live-announcer/live-announcer.ts

@@ -12,6 +12,7 @@ export * from './key-manager/list-key-manager';
 export * from './focus-trap/focus-trap';
 export * from './interactivity-checker/interactivity-checker';
 export * from './live-announcer/live-announcer';
+export * from './live-announcer/live-announcer-token';
 export * from './focus-monitor/focus-monitor';
 export * from './fake-mousedown';
 export * from './a11y-module';

src/cdk/a11y/public-api.ts

@@ -7,13 +7,12 @@
  */
 
 import {NgModule} from '@angular/core';
-import {UNIQUE_SELECTION_DISPATCHER_PROVIDER} from '@angular/cdk/collections';
 import {CdkAccordion} from './accordion';
 import {CdkAccordionItem} from './accordion-item';
 
+
 @NgModule({
   exports: [CdkAccordion, CdkAccordionItem],
   declarations: [CdkAccordion, CdkAccordionItem],
-  providers: [UNIQUE_SELECTION_DISPATCHER_PROVIDER],
 })
 export class CdkAccordionModule {}

src/cdk/accordion/accordion-module.ts

@@ -1,5 +1,7 @@
 package(default_visibility=["//visibility:public"])
 load("@angular//:index.bzl", "ng_module")
+load("@build_bazel_rules_typescript//:defs.bzl", "ts_library", "ts_web_test")
+
 
 ng_module(
   name = "bidi",
@@ -8,3 +10,30 @@ ng_module(
   deps = ["@rxjs"],
   tsconfig = ":tsconfig-build.json",
 )
+
+ts_library(
+  name = "bidi_test_sources",
+  testonly = 1,
+  srcs = glob(["**/*.spec.ts"]),
+  deps = [
+    ":bidi",
+    "@rxjs",
+  ],
+  tsconfig = ":tsconfig-build.json",
+)
+
+ts_web_test(
+  name = "unit_tests",
+  bootstrap = [
+    "//:web_test_bootstrap_scripts",
+  ],
+
+  # Do not sort
+  deps = [
+    "//:tslib_bundle",
+    "//:angular_bundles",
+    "//:angular_test_bundles",
+    "//test:angular_test_init",
+    ":bidi_test_sources",
+  ],
+)

src/cdk/bidi/BUILD.bazel

@@ -7,17 +7,11 @@
  */
 
 import {NgModule} from '@angular/core';
-import {DOCUMENT} from '@angular/common';
 import {Dir} from './dir';
-import {DIR_DOCUMENT, Directionality} from './directionality';
 
 
 @NgModule({
   exports: [Dir],
   declarations: [Dir],
-  providers: [
-    {provide: DIR_DOCUMENT, useExisting: DOCUMENT},
-    Directionality,
-  ]
 })
 export class BidiModule { }

src/cdk/bidi/bidi-module.ts

@@ -0,0 +1,31 @@
+/**
+ * @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 {DOCUMENT} from '@angular/common';
+import {inject, InjectionToken} from '@angular/core';
+
+
+/**
+ * Injection token used to inject the document into Directionality.
+ * This is used so that the value can be faked in tests.
+ *
+ * We can't use the real document in tests because changing the real `dir` causes geometry-based
+ * tests in Safari to fail.
+ *
+ * We also can't re-provide the DOCUMENT token from platform-brower because the unit tests
+ * themselves use things like `querySelector` in test code.
+ *
+ * This token is defined in a separate file from Directionality as a workaround for
+ * https://github.com/angular/angular/issues/22559
+ *
+ * @docs-private
+ */
+export const DIR_DOCUMENT = new InjectionToken<Document>('cdk-dir-doc', {
+  providedIn: 'root',
+  factory: () => inject(DOCUMENT),
+});