From 6d4c7ae714a12248d4f1734a4782de1970bccb26 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9=20Roggeri=20Campos?= Date: Tue, 23 Jan 2018 14:18:03 -0200 Subject: [PATCH] fix(progress-spinner): element size not updated when diamater is changed (#8697) --- src/lib/progress-spinner/progress-spinner.spec.ts | 8 ++++++++ src/lib/progress-spinner/progress-spinner.ts | 8 +++++++- 2 files changed, 15 insertions(+), 1 deletion(-) diff --git a/src/lib/progress-spinner/progress-spinner.spec.ts b/src/lib/progress-spinner/progress-spinner.spec.ts index 2c5bce299b7a..d00d31881999 100644 --- a/src/lib/progress-spinner/progress-spinner.spec.ts +++ b/src/lib/progress-spinner/progress-spinner.spec.ts @@ -224,6 +224,14 @@ describe('MatProgressSpinner', () => { expect(svgElement.getAttribute('viewBox')).toBe('0 0 38 38'); }); + it('should update the element size when changed dynamically', () => { + let fixture = TestBed.createComponent(BasicProgressSpinner); + let spinner = fixture.debugElement.query(By.directive(MatProgressSpinner)); + spinner.componentInstance.diameter = 32; + fixture.detectChanges(); + expect(spinner.nativeElement.style.width).toBe('32px'); + expect(spinner.nativeElement.style.height).toBe('32px'); + }); }); diff --git a/src/lib/progress-spinner/progress-spinner.ts b/src/lib/progress-spinner/progress-spinner.ts index 38c5af808606..842d042e5858 100644 --- a/src/lib/progress-spinner/progress-spinner.ts +++ b/src/lib/progress-spinner/progress-spinner.ts @@ -120,6 +120,7 @@ export class MatProgressSpinner extends _MatProgressSpinnerMixinBase implements if (!this._fallbackAnimation && !MatProgressSpinner.diameters.has(this._diameter)) { this._attachStyleNode(); } + this._updateElementSize(); } private _diameter = BASE_SIZE; @@ -162,7 +163,7 @@ export class MatProgressSpinner extends _MatProgressSpinnerMixinBase implements ngOnChanges(changes: SimpleChanges) { if (changes.strokeWidth || changes.diameter) { - this._elementSize = this._diameter + Math.max(this.strokeWidth - BASE_STROKE_WIDTH, 0); + this._updateElementSize(); } } @@ -226,6 +227,11 @@ export class MatProgressSpinner extends _MatProgressSpinnerMixinBase implements .replace(/END_VALUE/g, `${0.2 * this._strokeCircumference}`) .replace(/DIAMETER/g, `${this.diameter}`); } + + /** Updates the spinner element size based on its diameter. */ + private _updateElementSize() { + this._elementSize = this._diameter + Math.max(this.strokeWidth - BASE_STROKE_WIDTH, 0); + } }