refactor: address feedback

Author: crisbeto

src/cdk/scrolling/viewport-ruler.spec.ts

@@ -33,6 +33,10 @@ describe('ViewportRuler', () => {
     scrollTo(0, 0);
   }));
 
+  afterEach(() => {
+    ruler.ngOnDestroy();
+  });
+
   it('should get the viewport bounds when the page is not scrolled', () => {
     let bounds = ruler.getViewportRect();
     expect(bounds.top).toBe(0);
@@ -109,7 +113,7 @@ describe('ViewportRuler', () => {
       const subscription = ruler.change(0).subscribe(spy);
 
       dispatchFakeEvent(window, 'resize');
-      expect(spy).toHaveBeenCalledWith('resize');
+      expect(spy).toHaveBeenCalled();
       subscription.unsubscribe();
     });
 
@@ -118,7 +122,7 @@ describe('ViewportRuler', () => {
       const subscription = ruler.change(0).subscribe(spy);
 
       dispatchFakeEvent(window, 'orientationchange');
-      expect(spy).toHaveBeenCalledWith('orientationchange');
+      expect(spy).toHaveBeenCalled();
       subscription.unsubscribe();
     });
 

src/cdk/scrolling/viewport-ruler.ts

@@ -6,14 +6,15 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {Injectable, Optional, SkipSelf, NgZone} from '@angular/core';
+import {Injectable, Optional, SkipSelf, NgZone, OnDestroy} from '@angular/core';
 import {Platform} from '@angular/cdk/platform';
 import {ScrollDispatcher} from './scroll-dispatcher';
 import {Observable} from 'rxjs/Observable';
 import {Subject} from 'rxjs/Subject';
 import {fromEvent} from 'rxjs/observable/fromEvent';
 import {merge} from 'rxjs/observable/merge';
 import {auditTime} from 'rxjs/operator/auditTime';
+import {Subscription} from 'rxjs/Subscription';
 
 /** Time in ms to throttle the resize events by default. */
 export const DEFAULT_RESIZE_TIME = 20;
@@ -23,27 +24,33 @@ export const DEFAULT_RESIZE_TIME = 20;
  * @docs-private
  */
 @Injectable()
-export class ViewportRuler {
+export class ViewportRuler implements OnDestroy {
 
   /** Cached document client rectangle. */
   private _documentRect?: ClientRect;
 
   /** Stream of viewport change events. */
-  private _changed = new Subject<string>();
+  private _changed = new Subject<void>();
+
+  /** Subscriptions to streams that invalidate the cached viewport dimensions. */
+  private _invalidateCacheSubscriptions: Subscription[];
 
   constructor(platform: Platform, ngZone: NgZone, scrollDispatcher: ScrollDispatcher) {
     if (platform.isBrowser) {
-      ngZone.runOutsideAngular(() => {
-        merge<Event>(
-          fromEvent(window, 'resize'),
-          fromEvent(window, 'orientationchange')
-        ).subscribe(event => this._changed.next(event.type));
+      this._changed = ngZone.runOutsideAngular(() => {
+        return merge<Event>(fromEvent(window, 'resize'), fromEvent(window, 'orientationchange'));
       });
     }
 
     // Subscribe to scroll and resize events and update the document rectangle on changes.
-    scrollDispatcher.scrolled(0, () => this._cacheViewportGeometry());
-    this.change().subscribe(() => this._cacheViewportGeometry());
+    this._invalidateCacheSubscriptions = [
+      scrollDispatcher.scrolled(0, () => this._cacheViewportGeometry()),
+      this.change().subscribe(() => this._cacheViewportGeometry())
+    ];
+  }
+
+  ngOnDestroy() {
+    this._invalidateCacheSubscriptions.forEach(subscription => subscription.unsubscribe());
   }
 
   /** Gets a ClientRect for the viewport's bounds. */