Skip to content

Commit 87e1443

Browse files
Avoid referencing an ID that is not in the DOM (#5131)
When the menu is not open, do not set the aria props referencing it. Co-authored-by: Nathan Bierema <[email protected]>
1 parent c7d8d4b commit 87e1443

File tree

7 files changed

+9
-12
lines changed

7 files changed

+9
-12
lines changed

.changeset/curly-mice-nail.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'react-select': patch
3+
---
4+
5+
Avoid referencing an ID that is not in the DOM

packages/react-select/src/Select.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1560,13 +1560,15 @@ export default class Select<
15601560
'aria-autocomplete': 'list' as const,
15611561
'aria-expanded': menuIsOpen,
15621562
'aria-haspopup': true,
1563-
'aria-controls': this.getElementId('listbox'),
1564-
'aria-owns': this.getElementId('listbox'),
15651563
'aria-errormessage': this.props['aria-errormessage'],
15661564
'aria-invalid': this.props['aria-invalid'],
15671565
'aria-label': this.props['aria-label'],
15681566
'aria-labelledby': this.props['aria-labelledby'],
15691567
role: 'combobox',
1568+
...(menuIsOpen && {
1569+
'aria-controls': this.getElementId('listbox'),
1570+
'aria-owns': this.getElementId('listbox'),
1571+
}),
15701572
...(!isSearchable && {
15711573
'aria-readonly': true,
15721574
}),

packages/react-select/src/__tests__/__snapshots__/Async.test.tsx.snap

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -193,11 +193,9 @@ exports[`defaults - snapshot 1`] = `
193193
>
194194
<input
195195
aria-autocomplete="list"
196-
aria-controls="react-select-2-listbox"
197196
aria-describedby="react-select-2-placeholder"
198197
aria-expanded="false"
199198
aria-haspopup="true"
200-
aria-owns="react-select-2-listbox"
201199
autocapitalize="none"
202200
autocomplete="off"
203201
autocorrect="off"

packages/react-select/src/__tests__/__snapshots__/AsyncCreatable.test.tsx.snap

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -193,11 +193,9 @@ exports[`defaults - snapshot 1`] = `
193193
>
194194
<input
195195
aria-autocomplete="list"
196-
aria-controls="react-select-2-listbox"
197196
aria-describedby="react-select-2-placeholder"
198197
aria-expanded="false"
199198
aria-haspopup="true"
200-
aria-owns="react-select-2-listbox"
201199
autocapitalize="none"
202200
autocomplete="off"
203201
autocorrect="off"

packages/react-select/src/__tests__/__snapshots__/Creatable.test.tsx.snap

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -193,11 +193,9 @@ exports[`defaults - snapshot 1`] = `
193193
>
194194
<input
195195
aria-autocomplete="list"
196-
aria-controls="react-select-2-listbox"
197196
aria-describedby="react-select-2-placeholder"
198197
aria-expanded="false"
199198
aria-haspopup="true"
200-
aria-owns="react-select-2-listbox"
201199
autocapitalize="none"
202200
autocomplete="off"
203201
autocorrect="off"

packages/react-select/src/__tests__/__snapshots__/Select.test.tsx.snap

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -193,11 +193,9 @@ exports[`snapshot - defaults 1`] = `
193193
>
194194
<input
195195
aria-autocomplete="list"
196-
aria-controls="react-select-2-listbox"
197196
aria-describedby="react-select-2-placeholder"
198197
aria-expanded="false"
199198
aria-haspopup="true"
200-
aria-owns="react-select-2-listbox"
201199
autocapitalize="none"
202200
autocomplete="off"
203201
autocorrect="off"

packages/react-select/src/__tests__/__snapshots__/StateManaged.test.tsx.snap

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -193,11 +193,9 @@ exports[`defaults > snapshot 1`] = `
193193
>
194194
<input
195195
aria-autocomplete="list"
196-
aria-controls="react-select-2-listbox"
197196
aria-describedby="react-select-2-placeholder"
198197
aria-expanded="false"
199198
aria-haspopup="true"
200-
aria-owns="react-select-2-listbox"
201199
autocapitalize="none"
202200
autocomplete="off"
203201
autocorrect="off"

0 commit comments

Comments
 (0)