fix(progress-spinner): value not updated while in indeterminate mode (#8269)

Fixes updates to a spinner's value not being saved if they happen while the component is indeterminate, causing it to be wrong if it becomes determinate again.
This commit is contained in:
Kristiyan Kostadinov
2017-11-29 20:18:10 +01:00
committed by tinayuangao
parent 2b9bc5769a
commit 9b68b54cd2
2 changed files with 29 additions and 5 deletions
@@ -58,6 +58,27 @@ describe('MatProgressSpinner', () => {
expect(progressElement.componentInstance.value).toBe(0);
});
it('should retain the value if it updates while indeterminate', () => {
let fixture = TestBed.createComponent(ProgressSpinnerWithValueAndBoundMode);
let progressElement = fixture.debugElement.query(By.css('mat-progress-spinner'));
fixture.componentInstance.mode = 'determinate';
fixture.detectChanges();
expect(progressElement.componentInstance.value).toBe(50);
fixture.componentInstance.mode = 'indeterminate';
fixture.detectChanges();
expect(progressElement.componentInstance.value).toBe(0);
fixture.componentInstance.value = 75;
fixture.detectChanges();
expect(progressElement.componentInstance.value).toBe(0);
fixture.componentInstance.mode = 'determinate';
fixture.detectChanges();
expect(progressElement.componentInstance.value).toBe(75);
});
it('should clamp the value of the progress between 0 and 100', () => {
let fixture = TestBed.createComponent(BasicProgressSpinner);
fixture.detectChanges();
@@ -222,8 +243,13 @@ class ProgressSpinnerCustomDiameter {
@Component({template: '<mat-progress-spinner mode="indeterminate"></mat-progress-spinner>'})
class IndeterminateProgressSpinner { }
@Component({template: '<mat-progress-spinner value="50" [mode]="mode"></mat-progress-spinner>'})
class ProgressSpinnerWithValueAndBoundMode { mode = 'indeterminate'; }
@Component({
template: '<mat-progress-spinner [value]="value" [mode]="mode"></mat-progress-spinner>'
})
class ProgressSpinnerWithValueAndBoundMode {
mode = 'indeterminate';
value = 50;
}
@Component({template: `<mat-spinner [color]="color"></mat-spinner>`})
class SpinnerWithColor { color: string = 'primary'; }
+1 -3
View File
@@ -145,9 +145,7 @@ export class MatProgressSpinner extends _MatProgressSpinnerMixinBase implements
return this.mode === 'determinate' ? this._value : 0;
}
set value(newValue: number) {
if (newValue != null && this.mode === 'determinate') {
this._value = Math.max(0, Math.min(100, coerceNumberProperty(newValue)));
}
this._value = Math.max(0, Math.min(100, coerceNumberProperty(newValue)));
}
constructor(public _elementRef: ElementRef,