fix(stepper): handle out-of-bounds value being assigned to the selectedIndex

Fixes the stepper throwing an error if the consumer sets a `selectedIndex` that is greater than the amount of steps or less than zero.

Author: crisbeto

src/cdk/stepper/stepper.ts

@@ -152,6 +152,9 @@ export class CdkStepper implements OnDestroy {
   get selectedIndex() { return this._selectedIndex; }
   set selectedIndex(index: number) {
     if (this._steps) {
+      // Ensure that the index can't be out of bounds.
+      index = Math.max(0, Math.min(this._steps.length - 1, index || 0));
+
       if (this._anyControlsInvalidOrPending(index) || index < this._selectedIndex &&
           !this._steps.toArray()[index].editable) {
         // remove focus from clicked step header if the step is not able to be selected
@@ -164,7 +167,7 @@ export class CdkStepper implements OnDestroy {
       this._selectedIndex = this._focusIndex = index;
     }
   }
-  private _selectedIndex: number = 0;
+  private _selectedIndex = 0;
 
   /** The step that is selected. */
   @Input()

src/lib/stepper/stepper.spec.ts

@@ -51,6 +51,30 @@ describe('MatHorizontalStepper', () => {
       expect(stepperComponent.selectedIndex).toBe(0);
     });
 
+    it('should not throw when a negative `selectedIndex` is assigned', () => {
+      const stepperComponent: MatHorizontalStepper = fixture.debugElement
+          .query(By.css('mat-horizontal-stepper')).componentInstance;
+
+      expect(() => {
+        stepperComponent.selectedIndex = -10;
+        fixture.detectChanges();
+      }).not.toThrow();
+
+      expect(stepperComponent.selectedIndex).toBe(0);
+    });
+
+    it('should not throw when an out-of-bounds `selectedIndex` is assigned', () => {
+      const stepperComponent: MatHorizontalStepper = fixture.debugElement
+          .query(By.css('mat-horizontal-stepper')).componentInstance;
+
+      expect(() => {
+        stepperComponent.selectedIndex = 1337;
+        fixture.detectChanges();
+      }).not.toThrow();
+
+      expect(stepperComponent.selectedIndex).toBe(2);
+    });
+
     it('should change selected index on header click', () => {
       let stepHeaders = fixture.debugElement.queryAll(By.css('.mat-horizontal-stepper-header'));
       assertSelectionChangeOnHeaderClick(fixture, stepHeaders);