Skip to content

Commit 12c6f81

Browse files
crisbetojelbourn
authored andcommitted
fix(select): pointing to non-existent element via aria-labelledby (#12411)
Fixes `mat-select` referring to an element that doesn't exist, through `aria-labelledby`, if the select is inside a form field that doesn't have a label. Fixes #12405.
1 parent 04d5955 commit 12c6f81

File tree

2 files changed

+13
-1
lines changed

2 files changed

+13
-1
lines changed

src/lib/select/select.spec.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -126,6 +126,7 @@ describe('MatSelect', () => {
126126
SelectWithGroups,
127127
SelectWithGroupsAndNgContainer,
128128
SelectWithFormFieldLabel,
129+
SelectWithChangeEvent,
129130
]);
130131
}));
131132

@@ -255,6 +256,16 @@ describe('MatSelect', () => {
255256
expect(select.getAttribute('aria-labelledby')).toBeFalsy();
256257
});
257258

259+
it('should not set `aria-labelledby` if there is no form field label', () => {
260+
fixture.destroy();
261+
262+
const labelFixture = TestBed.createComponent(SelectWithChangeEvent);
263+
labelFixture.detectChanges();
264+
select = labelFixture.debugElement.query(By.css('mat-select')).nativeElement;
265+
266+
expect(select.getAttribute('aria-labelledby')).toBeFalsy();
267+
});
268+
258269
it('should select options via the UP/DOWN arrow keys on a closed select', fakeAsync(() => {
259270
const formControl = fixture.componentInstance.control;
260271
const options = fixture.componentInstance.options.toArray();

src/lib/select/select.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1054,7 +1054,8 @@ export class MatSelect extends _MatSelectMixinBase implements AfterContentInit,
10541054

10551055
// Note: we use `_getAriaLabel` here, because we want to check whether there's a
10561056
// computed label. `this.ariaLabel` is only the user-specified label.
1057-
if (!this._parentFormField || this._getAriaLabel()) {
1057+
if (!this._parentFormField || !this._parentFormField._hasFloatingLabel() ||
1058+
this._getAriaLabel()) {
10581059
return null;
10591060
}
10601061

0 commit comments

Comments
 (0)