Inaccessible with aria-activedescendent being undefined

[adamaho]

Problem

When using cmdk with app router in nextjs 13 cmdk doesn't respect screen readers.

Note: I have not tested to see if this problem exists with client side apps at all. So it could just be a bug with version 0.2.0. But that is assuming the cmdk docs site hasn't been deployed since 0.2.0 was released since it is working on that site right now.

Current Diagnosis

It seems that each of the Command.Item's are missing their id. Which means aria-activedescendent is undefined and therefore not reading out what the currently selected / highlighted item is in voice over. Which I assume means that this returning undefined

Reproduction

Repo: https://github.com/adamaho/cmdk-next13-app-router

You can also inspect the DOM here: https://ui.shadcn.com/docs/components/command and notice the same symptoms mentioned above. Which is a site that uses cmdk with app router.

Version

0.2.0

[joaom00]

Hey @adamaho,

That was fixed in #108 and will be in the next release!

[adamaho]

Ahhh wonderful! My bad for not checking past PR's. I was just looking at the source code and noticed that the code was there and was expecting it to work haha. That is good to know though! Feel free to close this issue :)

[dylanjt]

Bump.. I would love to use this library but the App Router incompatibility is blocking atm.

[adamaho]

FWIW this component works just fine on App Router as it is today. The title is a little mis-leading. I am going to update that now.

We really just need a new release to come out. There hasn't been one published since March. See: https://github.com/pacocoursey/cmdk/releases/tag/v0.2.0

[adamaho]

Closing since this issue was fixed in #108