build(aio): upgrade rxjs to 6.0.0-beta.0 (angular#22872)

PR Close angular#22872

aio/package.json

@@ -89,7 +89,8 @@
     "core-js": "^2.4.1",
     "jasmine": "^2.6.0",
     "ng-pwa-tools": "^0.0.10",
-    "rxjs": "^5.5.2",
+    "rxjs": "^6.0.0-beta.0",
+    "rxjs-compat": "^6.0.0-beta.0",
     "tslib": "^1.9.0",
     "web-animations-js": "^2.2.5",
     "zone.js": "^0.8.19"

aio/scripts/_payload-limits.json

@@ -3,7 +3,7 @@
     "master": {
       "uncompressed": {
         "inline": 1971,
-        "main": 774095,
+        "main": 743696,
         "polyfills": 40272,
         "prettify": 14888
       }

aio/src/app/app.component.spec.ts

@@ -6,8 +6,7 @@ import { HttpClient } from '@angular/common/http';
 import { MatProgressBar, MatSidenav } from '@angular/material';
 import { By } from '@angular/platform-browser';
 
-import { Observable } from 'rxjs/Observable';
-import { timer } from 'rxjs/observable/timer';
+import { Observable, timer } from 'rxjs';
 import 'rxjs/add/operator/mapTo';
 
 import { AppComponent } from './app.component';

aio/src/app/app.component.ts

@@ -13,9 +13,7 @@ import { SearchResults } from 'app/search/interfaces';
 import { SearchService } from 'app/search/search.service';
 import { TocService } from 'app/shared/toc.service';
 
-import { Observable } from 'rxjs/Observable';
-import { BehaviorSubject } from 'rxjs/BehaviorSubject';
-import { combineLatest } from 'rxjs/observable/combineLatest';
+import { BehaviorSubject, combineLatest, Observable } from 'rxjs';
 import 'rxjs/add/operator/first';
 
 const sideNavView = 'SideNav';

aio/src/app/custom-elements/api/api-list.component.spec.ts

@@ -1,5 +1,5 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { BehaviorSubject } from 'rxjs/BehaviorSubject';
+import { BehaviorSubject } from 'rxjs';
 
 import { ApiListComponent } from './api-list.component';
 import { ApiItem, ApiSection, ApiService } from './api.service';

aio/src/app/custom-elements/api/api-list.component.ts

@@ -8,9 +8,7 @@
 
 import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
 
-import { Observable } from 'rxjs/Observable';
-import { ReplaySubject } from 'rxjs/ReplaySubject';
-import { combineLatest } from 'rxjs/observable/combineLatest';
+import { combineLatest, Observable, ReplaySubject } from 'rxjs';
 
 import { LocationService } from 'app/shared/location.service';
 import { ApiSection, ApiService } from './api.service';

aio/src/app/custom-elements/api/api.service.ts

@@ -1,8 +1,7 @@
 import { Injectable, OnDestroy } from '@angular/core';
 import { HttpClient, HttpErrorResponse } from '@angular/common/http';
 
-import { ReplaySubject } from 'rxjs/ReplaySubject';
-import { Subject } from 'rxjs/Subject';
+import { ReplaySubject, Subject } from 'rxjs';
 import 'rxjs/add/operator/do';
 import 'rxjs/add/operator/map';
 import 'rxjs/add/operator/takeUntil';

aio/src/app/custom-elements/code/code.component.spec.ts

@@ -3,6 +3,8 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { MatSnackBar } from '@angular/material';
 import { By } from '@angular/platform-browser';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import 'rxjs/add/operator/first';
+import 'rxjs/add/operator/toPromise';
 
 import { CodeComponent } from './code.component';
 import { CodeModule } from './code.module';
@@ -61,44 +63,53 @@ describe('CodeComponent', () => {
   }));
 
   describe('pretty printing', () => {
-    it('should format a one-line code sample', () => {
+    const untilCodeFormatted = () => {
+      const emitter = hostComponent.codeComponent.codeFormatted;
+      return emitter.first().toPromise();
+    };
+    const hasLineNumbers = async () => {
+      // presence of `<li>`s are a tell-tale for line numbers
+      await untilCodeFormatted();
+      return 0 < fixture.nativeElement.querySelectorAll('li').length;
+    };
+
+    it('should format a one-line code sample', async () => {
+      hostComponent.setCode(oneLineCode);
+      await untilCodeFormatted();
+
       // 'pln' spans are a tell-tale for syntax highlighing
       const spans = fixture.nativeElement.querySelectorAll('span.pln');
       expect(spans.length).toBeGreaterThan(0, 'formatted spans');
     });
 
-    function hasLineNumbers() {
-      // presence of `<li>`s are a tell-tale for line numbers
-      return 0 < fixture.nativeElement.querySelectorAll('li').length;
-    }
-
-    it('should format a one-line code sample without linenums by default', () => {
-      expect(hasLineNumbers()).toBe(false);
+    it('should format a one-line code sample without linenums by default', async () => {
+      hostComponent.setCode(oneLineCode);
+      expect(await hasLineNumbers()).toBe(false);
     });
 
-    it('should add line numbers to one-line code sample when linenums set true', () => {
+    it('should add line numbers to one-line code sample when linenums set true', async () => {
       hostComponent.linenums = 'true';
       fixture.detectChanges();
 
-      expect(hasLineNumbers()).toBe(true);
+      expect(await hasLineNumbers()).toBe(true);
     });
 
-    it('should format a small multi-line code without linenums by default', () => {
+    it('should format a small multi-line code without linenums by default', async () => {
       hostComponent.setCode(smallMultiLineCode);
-      expect(hasLineNumbers()).toBe(false);
+      expect(await hasLineNumbers()).toBe(false);
     });
 
-    it('should add line numbers to a big multi-line code by default', () => {
+    it('should add line numbers to a big multi-line code by default', async () => {
       hostComponent.setCode(bigMultiLineCode);
-      expect(hasLineNumbers()).toBe(true);
+      expect(await hasLineNumbers()).toBe(true);
     });
 
-    it('should format big multi-line code without linenums when linenums set false', () => {
+    it('should format big multi-line code without linenums when linenums set false', async () => {
       hostComponent.linenums = false;
       fixture.detectChanges();
 
       hostComponent.setCode(bigMultiLineCode);
-      expect(hasLineNumbers()).toBe(false);
+      expect(await hasLineNumbers()).toBe(false);
     });
   });
 

aio/src/app/custom-elements/code/code.component.ts

@@ -1,8 +1,9 @@
-import { Component, ElementRef, ViewChild, Input, OnChanges } from '@angular/core';
+import { Component, ElementRef, EventEmitter, Input, OnChanges, Output, ViewChild } from '@angular/core';
 import { Logger } from 'app/shared/logger.service';
 import { PrettyPrinter } from './pretty-printer.service';
 import { CopierService } from 'app/shared/copier.service';
 import { MatSnackBar } from '@angular/material/snack-bar';
+import 'rxjs/add/operator/do';
 
 /**
  * If linenums is not set, this is the default maximum number of lines that
@@ -93,6 +94,8 @@ export class CodeComponent implements OnChanges {
   get title(): string { return this._title; }
   private _title: string;
 
+  @Output() codeFormatted = new EventEmitter<void>();
+
   /** The element in the template that will display the formatted code. */
   @ViewChild('codeContainer') codeContainer: ElementRef;
 
@@ -115,7 +118,9 @@ export class CodeComponent implements OnChanges {
     this.setCodeHtml(leftAlignedCode); // start with unformatted code
     this.codeText = this.getCodeText(); // store the unformatted code as text (for copying)
 
-    this.pretty.formatCode(leftAlignedCode, this.language, this.getLinenums(leftAlignedCode))
+    this.pretty
+        .formatCode(leftAlignedCode, this.language, this.getLinenums(leftAlignedCode))
+        .do(() => this.codeFormatted.emit())
         .subscribe(c => this.setCodeHtml(c), err => { /* ignore failure to format */ }
     );
   }

aio/src/app/custom-elements/code/pretty-printer.service.ts

@@ -1,7 +1,6 @@
 import { Injectable } from '@angular/core';
 
-import { Observable } from 'rxjs/Observable';
-import { fromPromise } from 'rxjs/observable/fromPromise';
+import { from as fromPromise, Observable } from 'rxjs';
 import 'rxjs/add/operator/map';
 import 'rxjs/add/operator/first';
 

aio/src/app/custom-elements/contributor/contributor-list.component.spec.ts

@@ -1,6 +1,6 @@
 import { ReflectiveInjector } from '@angular/core';
 
-import { of } from 'rxjs/observable/of';
+import { of } from 'rxjs';
 
 import { ContributorGroup } from './contributors.model';
 import { ContributorListComponent } from './contributor-list.component';

aio/src/app/custom-elements/contributor/contributor.service.ts

@@ -1,7 +1,7 @@
 import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 
-import { Observable } from 'rxjs/Observable';
+import { Observable } from 'rxjs';
 import 'rxjs/add/operator/map';
 import 'rxjs/add/operator/publishLast';
 

aio/src/app/custom-elements/elements-loader.ts

@@ -5,9 +5,7 @@ import {
   NgModuleRef,
 } from '@angular/core';
 import { ELEMENT_MODULE_PATHS_TOKEN } from './element-registry';
-import { of } from 'rxjs/observable/of';
-import { Observable } from 'rxjs/Observable';
-import { fromPromise } from 'rxjs/observable/fromPromise';
+import { from as fromPromise, Observable, of } from 'rxjs';
 import { createCustomElement } from '@angular/elements';
 
 @Injectable()
@@ -26,14 +24,14 @@ export class ElementsLoader {
    * the browser. Custom elements that are registered will be removed from the list of unregistered
    * elements so that they will not be queried in subsequent calls.
    */
-  loadContainingCustomElements(element: HTMLElement): Observable<null> {
+  loadContainingCustomElements(element: HTMLElement): Observable<void> {
     const selectors: any[] = Array.from(this.elementsToLoad.keys())
         .filter(s => element.querySelector(s));
 
-    if (!selectors.length) { return of(null); }
+    if (!selectors.length) { return of(undefined); }
 
     // Returns observable that completes when all discovered elements have been registered.
-    return fromPromise(Promise.all(selectors.map(s => this.register(s))).then(result => null));
+    return fromPromise(Promise.all(selectors.map(s => this.register(s))).then(result => undefined));
   }
 
   /** Registers the custom element defined on the WithCustomElement module factory. */

aio/src/app/custom-elements/resource/resource-list.component.spec.ts

@@ -1,7 +1,7 @@
 import { ReflectiveInjector } from '@angular/core';
 import { PlatformLocation } from '@angular/common';
 
-import { of } from 'rxjs/observable/of';
+import { of } from 'rxjs';
 
 import { ResourceListComponent } from './resource-list.component';
 import { ResourceService } from './resource.service';

aio/src/app/custom-elements/resource/resource.service.ts

@@ -1,7 +1,7 @@
 import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 
-import { Observable } from 'rxjs/Observable';
+import { Observable } from 'rxjs';
 import 'rxjs/add/operator/map';
 import 'rxjs/add/operator/publishLast';
 

aio/src/app/custom-elements/search/file-not-found-search.component.spec.ts

@@ -1,6 +1,6 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
-import { Subject } from 'rxjs/Subject';
+import { Subject } from 'rxjs';
 import { LocationService } from 'app/shared/location.service';
 import { MockLocationService } from 'testing/location.service';
 import { SearchResults } from 'app/search/interfaces';

aio/src/app/custom-elements/search/file-not-found-search.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core';
-import { Observable } from 'rxjs/Observable';
+import { Observable } from 'rxjs';
 import { LocationService } from 'app/shared/location.service';
 import { SearchResults } from 'app/search/interfaces';
 import { SearchService } from 'app/search/search.service';

aio/src/app/documents/document.service.spec.ts

@@ -1,7 +1,7 @@
 import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
 import { TestBed } from '@angular/core/testing';
 
-import { Subscription } from 'rxjs/Subscription';
+import { Subscription } from 'rxjs';
 
 import { LocationService } from 'app/shared/location.service';
 import { MockLocationService } from 'testing/location.service';

aio/src/app/documents/document.service.ts

@@ -1,9 +1,7 @@
 import { Injectable } from '@angular/core';
 import { HttpClient, HttpErrorResponse } from '@angular/common/http';
 
-import { Observable } from 'rxjs/Observable';
-import { AsyncSubject } from 'rxjs/AsyncSubject';
-import { of } from 'rxjs/observable/of';
+import { AsyncSubject, Observable, of } from 'rxjs';
 import 'rxjs/add/operator/catch';
 import 'rxjs/add/operator/switchMap';
 

aio/src/app/layout/doc-viewer/doc-viewer.component.spec.ts

@@ -1,8 +1,7 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { Title, Meta } from '@angular/platform-browser';
 
-import { Observable } from 'rxjs/Observable';
-import { of } from 'rxjs/observable/of';
+import { Observable, of } from 'rxjs';
 
 import { FILE_NOT_FOUND_ID, FETCHING_ERROR_ID } from 'app/documents/document.service';
 import { Logger } from 'app/shared/logger.service';
@@ -297,13 +296,11 @@ describe('DocViewerComponent', () => {
     let loadElementsSpy: jasmine.Spy;
 
     const doRender = (contents: string | null, id = 'foo') =>
-      new Promise<void>((resolve, reject) =>
-        docViewer.render({contents, id}).subscribe(resolve, reject));
+      docViewer.render({contents, id}).toPromise();
 
     beforeEach(() => {
       const elementsLoader = TestBed.get(ElementsLoader) as MockElementsLoader;
-      loadElementsSpy =
-          elementsLoader.loadContainingCustomElements.and.returnValue(of([]));
+      loadElementsSpy = elementsLoader.loadContainingCustomElements.and.returnValue(of(undefined));
       prepareTitleAndTocSpy = spyOn(docViewer, 'prepareTitleAndToc');
       swapViewsSpy = spyOn(docViewer, 'swapViews').and.returnValue(of(undefined));
     });

aio/src/app/layout/doc-viewer/doc-viewer.component.ts

@@ -1,9 +1,7 @@
 import { Component, ElementRef, EventEmitter, Input, OnDestroy, Output } from '@angular/core';
 import { Title, Meta } from '@angular/platform-browser';
 
-import { Observable } from 'rxjs/Observable';
-import { of } from 'rxjs/observable/of';
-import { timer } from 'rxjs/observable/timer';
+import { Observable, of, timer } from 'rxjs';
 import 'rxjs/add/operator/catch';
 import 'rxjs/add/operator/do';
 import 'rxjs/add/operator/switchMap';

aio/src/app/layout/toc/toc.component.spec.ts

@@ -1,8 +1,7 @@
 import { Component, CUSTOM_ELEMENTS_SCHEMA, DebugElement } from '@angular/core';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
-import { BehaviorSubject } from 'rxjs/BehaviorSubject';
-import { asap } from 'rxjs/scheduler/asap';
+import { asapScheduler as asap, BehaviorSubject } from 'rxjs';
 
 import { ScrollService } from 'app/shared/scroll.service';
 import { TocComponent } from './toc.component';

aio/src/app/layout/toc/toc.component.ts

@@ -1,7 +1,5 @@
 import { AfterViewInit, Component, ElementRef, OnDestroy, OnInit, QueryList, ViewChildren } from '@angular/core';
-import { Observable } from 'rxjs/Observable';
-import { Subject } from 'rxjs/Subject';
-import { asap } from 'rxjs/scheduler/asap';
+import { asapScheduler as asap, Observable, Subject } from 'rxjs';
 import 'rxjs/add/observable/combineLatest';
 import 'rxjs/add/operator/subscribeOn';
 import 'rxjs/add/operator/takeUntil';

aio/src/app/layout/top-menu/top-menu.component.spec.ts

@@ -1,6 +1,6 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import { BehaviorSubject } from 'rxjs/BehaviorSubject';
+import { BehaviorSubject } from 'rxjs';
 
 import { TopMenuComponent } from './top-menu.component';
 import { NavigationService, NavigationViews } from 'app/navigation/navigation.service';

aio/src/app/navigation/navigation.service.ts

@@ -1,8 +1,7 @@
 import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 
-import { Observable } from 'rxjs/Observable';
-import { combineLatest } from 'rxjs/observable/combineLatest';
+import { combineLatest, Observable } from 'rxjs';
 import 'rxjs/add/operator/map';
 import 'rxjs/add/operator/publishLast';
 import 'rxjs/add/operator/publishReplay';

aio/src/app/search/search-box/search-box.component.ts

@@ -1,6 +1,6 @@
 import { Component, OnInit, ViewChild, ElementRef, EventEmitter, Output } from '@angular/core';
 import { LocationService } from 'app/shared/location.service';
-import { Subject } from 'rxjs/Subject';
+import { Subject } from 'rxjs';
 import 'rxjs/add/operator/distinctUntilChanged';
 
 /**

aio/src/app/search/search.service.spec.ts

@@ -1,6 +1,6 @@
 import { ReflectiveInjector, NgZone } from '@angular/core';
 import { fakeAsync, tick } from '@angular/core/testing';
-import { Observable } from 'rxjs/Observable';
+import { Observable } from 'rxjs';
 import 'rxjs/add/observable/of';
 import { SearchService } from './search.service';
 import { WebWorkerClient } from 'app/shared/web-worker';

aio/src/app/search/search.service.ts

@@ -5,10 +5,7 @@ can be found in the LICENSE file at http://angular.io/license
 */
 
 import { NgZone, Injectable } from '@angular/core';
-import { Observable } from 'rxjs/Observable';
-import { ReplaySubject } from 'rxjs/ReplaySubject';
-import { race } from 'rxjs/observable/race';
-import { timer } from 'rxjs/observable/timer';
+import { Observable, race, ReplaySubject, timer } from 'rxjs';
 import 'rxjs/add/operator/concatMap';
 import 'rxjs/add/operator/first';
 import 'rxjs/add/operator/publishReplay';

aio/src/app/shared/custom-icon-registry.ts

@@ -1,5 +1,5 @@
 import { InjectionToken, Inject, Injectable } from '@angular/core';
-import { of } from 'rxjs/observable/of';
+import { of } from 'rxjs';
 import { MatIconRegistry } from '@angular/material/icon';
 import { HttpClient } from '@angular/common/http';
 import { DomSanitizer } from '@angular/platform-browser';