Skip to content

Commit 9135eeb

Browse files
authored
fix: Ensure screenreaders read combobox label (#2919)
Signed-off-by: Akshat Patel <[email protected]>
1 parent e167388 commit 9135eeb

File tree

1 file changed

+3
-1
lines changed

1 file changed

+3
-1
lines changed

src/combobox/combobox.component.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ import { Observable } from "rxjs";
4444
<label
4545
*ngIf="label"
4646
[for]="id"
47+
[id]="labelId"
4748
class="cds--label"
4849
[ngClass]="{'cds--label--disabled': disabled}">
4950
<ng-container *ngIf="!isTemplate(label)">{{label}}</ng-container>
@@ -110,7 +111,7 @@ import { Observable } from "rxjs";
110111
[ngClass]="{'cds--text-input--empty': !showClearButton}"
111112
tabindex="0"
112113
[id]="id"
113-
[attr.aria-labelledby]="id"
114+
[attr.aria-labelledby]="labelId"
114115
[attr.aria-expanded]="open"
115116
aria-haspopup="listbox"
116117
[attr.maxlength]="maxLength"
@@ -258,6 +259,7 @@ export class ComboBox implements OnChanges, AfterViewInit, AfterContentInit, OnD
258259
}
259260
static comboBoxCount = 0;
260261
@Input() id = `dropdown-${ComboBox.comboBoxCount++}`;
262+
@Input() labelId = `dropdown-label-${ComboBox.comboBoxCount++}`;
261263
/**
262264
* List of items to fill the content with.
263265
*

0 commit comments

Comments
 (0)