#1607·downshift

Combobox is not reading the items in JAWS

Author: guidariCreated Jun 4, 2024Updated Jun 4, 2024
  • downshift version: current on downshift website
  • node version: current on downshift website
  • npm (or yarn) version: current on downshift website

What you did:

I want to use the id from the items array.

javascript
  const items = [
    {id: 'option-1', author: 'Harper Lee', title: 'To Kill a Mockingbird'},
    {id: 'option-2', author: 'Lev Tolstoy', title: 'War and Peace'},
    {id: 'option-3', author: 'Fyodor Dostoyevsy', title: 'The Idiot'},
    {id: 'option-4', author: 'Oscar Wilde', title: 'A Picture of Dorian Gray'},
  ]

To grab the ids I just have to add this line of code in the getItemsProps:

id: item.id,

javascript
 {...getItemProps({
    key: item.title,
    index,
    item,
    id: item.id,
  })}

This works fine and the ids are added. The issue is that when using JAWS the items inside the Combobox are not read.

Reproduction repository:

Just copied these lines of code in your example in the website and use JAWS

https://www.downshift-js.com/downshift/#usage-with-getrootprops