Steps to reproduce:
1. Go to https://webkit.org/blog-files/aria1.0/combobox_with_live_region_status.html
2. Type "ca" in the text field (it has a role=combobox)
3. Hit "arrow down", this should select the "American Samoa" option
Actual: nothing is read
Expected: "American Samoa" is read
4. Hit "arrow down", this should select the "California" option
Actual: "American Samoa" is read
Expected: "California" is read
Note that this makes combobox/listbox almost unusable to VoiceOver users.
A somewhat similar issue was reported in Chrome as well: https://bugs.chromium.org/p/chromium/issues/detail?id=666049
*** Bug 167680 has been marked as a duplicate of this bug. ***
Just to note this is still happening in Safari + VoiceOver, but Chrome + Safari handles it properly.
I'm still getting reports that this is still broken on the example at
Can I get a status update on where this currently stands in dev?
This will be fixed in VoiceOver
https://webkit.org/blog-files/aria1.0/combobox_with_live_region_status.html is working well for me with Safari Version 12.1.1 (14607.2.6.1.1) and macOS 10.14.5 (18F203).
It also seems to be working well with Chrome 75.
Michael, I have exactly the same setup as you and the bug is still reproducible on my side.
This is currently broken for me on Mojave 10.14.6 with Safari 13.0.4
These examples use aria-activedescendant and they work as expected in Safari+VO:
Why they work? Because, in addition to active descendant they set aria-selected to active option.
I found that when I do that in my custom dropdown work in VO+Safari (Safari Version 14.0 15610.1.28.1.9, 15610 / macOS 10.15.7 (19H2)).
My understanding of aria-selected is that it indicates the current selection - not the active item. So this looks like a bug.
The w3 example selects uses the active item = value pattern, so aria-selected has the right semantics.
The deque example requires an explicit selection, so aria-selected seems to be wrong there.
I tested an implementation without aria-selected in Chrome (86.0.4240.111) and Firefox (83.0b3), and both announce the active descendant when I move between list items.
I ran into this issue today. VoiceOver (macOS 10.14.6) + Chrome (86.0) worked fine but VoiceOver (macOS 10.14.6) + Safari (14.0) didn't announce anything when the active descendant changed. I had aria-activedescendant set correctly on the listbox element *and* aria-selected set on the active descendent element as others have suggested.
I was able to work around the issue by removing an extra wrapper element that I had placed inside the listbox element for styling purposes (all of the listbox option elements were children of this wrapper, not of the listbox itself). When I removed the wrapper and moved the option elements up in the DOM tree to be *direct* children of the listbox Safari started announcing the active descendant. The WAI-ARIA Authoring Practices is pretty clear that the active descendant just needs to be a descendant, not a direct child.
As mentioned in #c10 this has been resolved and working in VoiceOver for a couple years, so I'm closing this orphaned bug report as Resolved.
The other examples people have linked since then are almost certainly related but different bugs. Event if they're all about combobox+activedescendant, the markup or rendering instances are likely different. The best approach to get those resolved is to file a new bug for reduced test cases that you find are not working... I'll try to do that with some of these now.
Note: If I can't verify the linked instance bug on my system, but you're still seeing it on yours, there may be other factors at play. Include software versions, etc. Potentially attach VoiceOver preferences if it work in the default config but not with your preferred config.
FWIW @Kaelig, I'm looking at a bug that resolved this. Prior to the fix, this example did not work for me at all, but it does now. If you're still seeing this specific test case unresolved on your system, could you ping me offline? We can investigate what's different about the configs. Thanks.
I'm looking at a slight variant of this bug that seems to be happening when aria-haspopup is set to "grid". I'm not sure if that difference from the original example is the cause but the bug can be reproduced faithfully with this example page from w3c:
When navigating through the options in the list using the arrow keys absolutely nothing is announced.
I can confirm that it works with VoiceOver/Chrome as well as VoiceOver/IOS Safari (14.1)
This is still an issue and not fixed.
We are still facing this issue in Safari.
Here's jsfiddle link if you want to check the implementation - https://jsfiddle.net/f5Larbnk/19/
Note that voiceover in the above fiddle works fine in Firefox, Chrome when active-descendant is updated.