Skip to content

Commit e1bfb92

Browse files
authored
fix(form-field): error in older versions of edge (#19698)
Some older versions of Edge will throw an error due to the way we were iterating over an `HTMLCollection`. This is actually something that TS throws a compilation error for, but we didn't catch it, because the variable was being inferred as `any`. Fixes #17810.
1 parent 9af441d commit e1bfb92

File tree

1 file changed

+6
-5
lines changed

1 file changed

+6
-5
lines changed

src/material/form-field/form-field.ts

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -255,7 +255,7 @@ export class MatFormField extends _MatFormFieldMixinBase
255255

256256
@ViewChild('connectionContainer', {static: true}) _connectionContainerRef: ElementRef;
257257
@ViewChild('inputContainer') _inputContainerRef: ElementRef;
258-
@ViewChild('label') private _label: ElementRef;
258+
@ViewChild('label') private _label: ElementRef<HTMLElement>;
259259

260260
@ContentChild(MatFormFieldControl) _controlNonStatic: MatFormFieldControl<any>;
261261
@ContentChild(MatFormFieldControl, {static: true}) _controlStatic: MatFormFieldControl<any>;
@@ -540,7 +540,7 @@ export class MatFormField extends _MatFormFieldMixinBase
540540
const labelEl = this._label ? this._label.nativeElement : null;
541541

542542
if (this.appearance !== 'outline' || !labelEl || !labelEl.children.length ||
543-
!labelEl.textContent.trim()) {
543+
!labelEl.textContent!.trim()) {
544544
return;
545545
}
546546

@@ -578,11 +578,12 @@ export class MatFormField extends _MatFormFieldMixinBase
578578
}
579579

580580
const containerStart = this._getStartEnd(containerRect);
581-
const labelStart = this._getStartEnd(labelEl.children[0].getBoundingClientRect());
581+
const labelChildren = labelEl.children;
582+
const labelStart = this._getStartEnd(labelChildren[0].getBoundingClientRect());
582583
let labelWidth = 0;
583584

584-
for (const child of labelEl.children) {
585-
labelWidth += child.offsetWidth;
585+
for (let i = 0; i < labelChildren.length; i++) {
586+
labelWidth += (labelChildren[i] as HTMLElement).offsetWidth;
586587
}
587588
startWidth = Math.abs(labelStart - containerStart) - outlineGapPadding;
588589
gapWidth = labelWidth > 0 ? labelWidth * floatingLabelScale + outlineGapPadding * 2 : 0;

0 commit comments

Comments
 (0)