From fe62e4e80e67e40f73c167bc407ef3479c8f5c2d Mon Sep 17 00:00:00 2001 From: Paul Gschwendtner Date: Tue, 10 Mar 2020 10:28:35 +0100 Subject: [PATCH 1/2] fix(material-experimental/mdc-form-field): refresh notch width when toggling appearances Previously, switching between outline and filled appearance caused the notch width to be incorrect in some situations. This is because then notched-outline component does not sync with the underlying MDC component in case width and open state have been set upon `ngOnInit`. --- .../mdc-form-field/directives/notched-outline.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/material-experimental/mdc-form-field/directives/notched-outline.ts b/src/material-experimental/mdc-form-field/directives/notched-outline.ts index 55778fa096a8..63eac20ee532 100644 --- a/src/material-experimental/mdc-form-field/directives/notched-outline.ts +++ b/src/material-experimental/mdc-form-field/directives/notched-outline.ts @@ -62,6 +62,8 @@ export class MatFormFieldNotchedOutline implements AfterViewInit, OnChanges, OnD // that we cannot extend from the "MDCNotchedOutline". this._mdcNotchedOutline = MDCNotchedOutline.attachTo(this._elementRef.nativeElement); } + // Initial sync in case state has been updated before view initialization. + this._syncNotchedOutlineState(); } ngOnChanges() { From 1e56dd57da6f724255eb4f7c521577b20485d395 Mon Sep 17 00:00:00 2001 From: Paul Gschwendtner Date: Tue, 10 Mar 2020 10:37:10 +0100 Subject: [PATCH 2/2] refactor(material/material-experimental): reduce specificity of textarea overrides selector --- .../mdc-form-field/_mdc-text-field-textarea-overrides.scss | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/material-experimental/mdc-form-field/_mdc-text-field-textarea-overrides.scss b/src/material-experimental/mdc-form-field/_mdc-text-field-textarea-overrides.scss index 4474c38f3aca..4cf58eb12aa1 100644 --- a/src/material-experimental/mdc-form-field/_mdc-text-field-textarea-overrides.scss +++ b/src/material-experimental/mdc-form-field/_mdc-text-field-textarea-overrides.scss @@ -12,9 +12,6 @@ @mixin _mat-mdc-text-field-textarea-overrides() { // Ensures that textarea elements inside of the form-field have proper vertical spacing // to account for the floating label. Also ensures that there is no vertical text overflow. - // TODO(devversion): remove extra specificity if we removed the ":not(outline-appearance)" - // selector from the structure overwrites. Blocked on material-components-web#5326. - .mat-mdc-form-field > .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix .mat-mdc-textarea-input { resize: vertical; box-sizing: border-box;