Skip to content

Commit

Permalink
fix(ui-selectable): fix Select options not being selectable on iOS Sa…
Browse files Browse the repository at this point in the history
…fari with VoiceOver on

aria-owns seems to be misused here. It rearranges the DOM seen by the screenreader, so the subtree
owned by the element will be its child. Backport of
#1668
TEST PLAN:
Test all examples of Select, SimpleSelect, Selectable with keyboard navigation and VoiceOver. Test
on mobile devices with TalkBack/VoiceOver and Windows too if possible
  • Loading branch information
matyasf committed Sep 19, 2024
1 parent 4c55bc9 commit bcfcd78
Show file tree
Hide file tree
Showing 2 changed files with 0 additions and 3 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -802,14 +802,12 @@ describe('<Selectable />', async () => {

expect(input.getAttribute('aria-expanded')).to.equal('false')
expect(input.getAttribute('aria-controls')).to.not.exist()
expect(input.getAttribute('aria-owns')).to.not.exist()

await subject.setProps({ isShowingOptions: true })
expect(input.getAttribute('aria-expanded')).to.equal('true')
expect(input.getAttribute('aria-controls')).to.equal(
list.getAttribute('id')
)
expect(input.getAttribute('aria-owns')).to.equal(list.getAttribute('id'))
})

it('should set appropriate props based on highlightedOptionId', async () => {
Expand Down
1 change: 0 additions & 1 deletion packages/ui-selectable/src/Selectable/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -200,7 +200,6 @@ class Selectable extends Component<SelectableProps> {
)!,
'aria-haspopup': 'listbox',
'aria-expanded': isShowingOptions,
'aria-owns': isShowingOptions ? this._listId : undefined,
'aria-controls': isShowingOptions ? this._listId : undefined,
'aria-describedby': this._descriptionId,
'aria-activedescendant': isShowingOptions
Expand Down

0 comments on commit bcfcd78

Please sign in to comment.