Skip to content

Commit eb92de8

Browse files
authored
fix(form-field): error when trying to lock label into position too early (#18666)
Fixes an error that is thrown by the form field's `_animateAndLockLabel` if it's called before `ngAfterViewInit`. This can happen if an autocomplete receives focus too early. Fixes #18663.
1 parent dd239dd commit eb92de8

File tree

2 files changed

+8
-1
lines changed

2 files changed

+8
-1
lines changed

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -422,7 +422,7 @@ export class MatFormField extends _MatFormFieldMixinBase
422422
if (this._hasFloatingLabel() && this._canLabelFloat) {
423423
// If animations are disabled, we shouldn't go in here,
424424
// because the `transitionend` will never fire.
425-
if (this._animationsEnabled) {
425+
if (this._animationsEnabled && this._label) {
426426
this._showAlwaysAnimate = true;
427427

428428
fromEvent(this._label.nativeElement, 'transitionend').pipe(take(1)).subscribe(() => {

src/material/input/input.spec.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -850,6 +850,13 @@ describe('MatInput without forms', () => {
850850
expect(inputContainer.floatLabel).toBe('always');
851851
}));
852852

853+
it('should not throw when trying to animate and lock too early', fakeAsync(() => {
854+
const fixture = createComponent(MatInputTextTestController);
855+
const formField = fixture.debugElement.query(By.directive(MatFormField))!
856+
.componentInstance as MatFormField;
857+
expect(() => formField._animateAndLockLabel()).not.toThrow();
858+
}));
859+
853860
it('should not highlight when focusing a readonly input', fakeAsync(() => {
854861
let fixture = createComponent(MatInputWithReadonlyInput);
855862
fixture.detectChanges();

0 commit comments

Comments
 (0)