I have a video with a time bar and markers to reveal points on the timebar to access (checkpoints). I want to be able to have focus on the checkpoint marker and announce it to VoiceOver, but there is no way to get to the focused checkpoint marker (a button) via Screenreader whereas the button does have focus from the browser.
If I were to remove the role="slider" or role="progressbar" on the time bar, focus is given to the checkpoints. This suggests to me that VoiceOver (in Safari) does not drill into those elements.
One option is to separate the buttons to a separate div outside of the time bar, but that seems messy. Are there any ideas to get VoiceOver to announce the buttons within the role="slider" or role="progressbar" div, when they receive focus.
Note: This does work in Chrome, so this is a Safari issue.
Here's an example: https://codepen.io/kmcgrady/pen/oVZxLE Be sure to use Safari and get access to the frame and then try to tab into the button.
<div role="slider" aria-valuemin="0" aria-valuemax="100" aria-valuenow=50>
<button tabindex="0">Hello</button>
</div>
Unfortunately (for you), VoiceOver is correct. The spec for role="slider" says that all child elements are considered "presentational", which means child DOM elements do not have a role. So your embedded button loses its "button-ness" and just becomes plain text. If Chrome works, then it's wrong.
I tried your codepen example with NVDA (on a PC) with Firefox and Chrome and they both (correctly) ignored your button. I then added a button before and after your button and those buttons are found, as I would expect. If I navigate by buttons by using the B key in NVDA, your button is ignored and the sample buttons are found. If I try the example on iOS and change my rotor to "Form Controls", then swiping up or down ignores your button.
So you may have to work with a UX person to come with a good experience for users to get to your checkpoints. When you select a checkpoint button, is it supposed to take you to that point in the video? I think having a series of checkpoint buttons outside the slider wouldn't be too bad. The play, pause, volume, closed captions, and other such buttons are outside the time bar so having a few more buttons for checkpoints might not be too bad.