From 42b2413ab879eb8738e525859b56c3de9473ef19 Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@users.noreply.github.com>
Date: Sun, 9 Jul 2017 03:50:30 +0200
Subject: [PATCH] chore(progess-spinner): switch to OnPush change detection
 (#5421)

* Switches the progress spinner component to `OnPush` change detection.
* Removes a workaround for older Angular 2.x versions where inherited lifecycle hooks weren't being called.
* Fixes some wrong terminology in the spinner demo.

Relates to #5035.
---
 .../progress-spinner/progress-spinner-demo.html        |  6 +++---
 src/demo-app/progress-spinner/progress-spinner-demo.ts |  6 +++---
 src/lib/progress-spinner/progress-spinner.spec.ts      |  6 +++---
 src/lib/progress-spinner/progress-spinner.ts           | 10 ++--------
 4 files changed, 11 insertions(+), 17 deletions(-)

diff --git a/src/demo-app/progress-spinner/progress-spinner-demo.html b/src/demo-app/progress-spinner/progress-spinner-demo.html
index 2e2ba59b85e..07a04390dc8 100644
--- a/src/demo-app/progress-spinner/progress-spinner-demo.html
+++ b/src/demo-app/progress-spinner/progress-spinner-demo.html
@@ -4,13 +4,13 @@
   <p>Value: {{progressValue}}</p>
   <button md-raised-button (click)="step(10)">Increase</button>
   <button md-raised-button (click)="step(-10)">Decrease</button>
-  <md-checkbox [(ngModel)]="modeToggle">Is determinate</md-checkbox>
+  <md-checkbox [(ngModel)]="isDeterminate">Is determinate</md-checkbox>
 </div>
 
 <div class="demo-progress-spinner">
-  <md-progress-spinner [mode]="modeToggle ? 'indeterminate' : 'determinate'"
+  <md-progress-spinner [mode]="isDeterminate ? 'determinate' : 'indeterminate'"
       [value]="progressValue" color="primary" [strokeWidth]="1"></md-progress-spinner>
-  <md-progress-spinner [mode]="modeToggle ? 'indeterminate' : 'determinate'"
+  <md-progress-spinner [mode]="isDeterminate ? 'determinate' : 'indeterminate'"
       [value]="progressValue" color="accent"></md-progress-spinner>
 </div>
 
diff --git a/src/demo-app/progress-spinner/progress-spinner-demo.ts b/src/demo-app/progress-spinner/progress-spinner-demo.ts
index b67781631c5..9677e78e50d 100644
--- a/src/demo-app/progress-spinner/progress-spinner-demo.ts
+++ b/src/demo-app/progress-spinner/progress-spinner-demo.ts
@@ -8,9 +8,9 @@ import {Component} from '@angular/core';
   styleUrls: ['progress-spinner-demo.css'],
 })
 export class ProgressSpinnerDemo {
-  progressValue: number = 60;
-  color: string = 'primary';
-  modeToggle: boolean = false;
+  progressValue = 60;
+  color = 'primary';
+  isDeterminate = true;
 
   step(val: number) {
     this.progressValue = Math.max(0, Math.min(100, val + this.progressValue));
diff --git a/src/lib/progress-spinner/progress-spinner.spec.ts b/src/lib/progress-spinner/progress-spinner.spec.ts
index 76bc536fd04..c23ba1bde66 100644
--- a/src/lib/progress-spinner/progress-spinner.spec.ts
+++ b/src/lib/progress-spinner/progress-spinner.spec.ts
@@ -27,10 +27,10 @@ describe('MdProgressSpinner', () => {
 
   it('should apply a mode of "determinate" if no mode is provided.', () => {
     let fixture = TestBed.createComponent(BasicProgressSpinner);
-      fixture.detectChanges();
+    fixture.detectChanges();
 
-      let progressElement = fixture.debugElement.query(By.css('md-progress-spinner'));
-      expect(progressElement.componentInstance.mode).toBe('determinate');
+    let progressElement = fixture.debugElement.query(By.css('md-progress-spinner'));
+    expect(progressElement.componentInstance.mode).toBe('determinate');
   });
 
   it('should not modify the mode if a valid mode is provided.', () => {
diff --git a/src/lib/progress-spinner/progress-spinner.ts b/src/lib/progress-spinner/progress-spinner.ts
index aaa74d42e05..7320c54ab7c 100644
--- a/src/lib/progress-spinner/progress-spinner.ts
+++ b/src/lib/progress-spinner/progress-spinner.ts
@@ -287,19 +287,13 @@ export class MdProgressSpinner extends _MdProgressSpinnerMixinBase
   inputs: ['color'],
   templateUrl: 'progress-spinner.html',
   styleUrls: ['progress-spinner.css'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class MdSpinner extends MdProgressSpinner implements OnDestroy {
-
+export class MdSpinner extends MdProgressSpinner {
   constructor(elementRef: ElementRef, ngZone: NgZone, renderer: Renderer2) {
     super(renderer, elementRef, ngZone);
     this.mode = 'indeterminate';
   }
-
-  ngOnDestroy() {
-    // The `ngOnDestroy` from `MdProgressSpinner` should be called explicitly, because
-    // in certain cases Angular won't call it (e.g. when using AoT and in unit tests).
-    super.ngOnDestroy();
-  }
 }