Accessibility - with a screen reader, items not in the DOM are inaccessible

[jwahyoung]

With a mouse or keyboard, it's possible to scroll the list element to reveal more virtual items - previous, or next. Testing with Voiceover in Safari (OSX 10.10) with the demo application, someone using a screen reader cannot access elements in the list that are not in the DOM.

I believe that a fix for this could be to add a hidden element at the beginning and end of the DOM list (of the same type as the element with the virtual-repeat property) that contains a button or link of some type that would manually call the scroll event to load a new page of list elements. (We could possibly do that on focus, but I don't know if that's an accessibility trap.)

I imagine that when the list is in the home or end position, the corresponding element would be removed from the DOM.

I'm definitely open to suggestions and I'll probably continue testing this locally to see what else I find.

[AStoker]

@jedd-ahyoung, so essentially you're proposing a "scroll to next page" type element, right?
What would be the possible pitfalls of that approach that you can think of? Would having an external element (outside the list) that performs the same action be sufficient for a screen reader? Not sure what all the accessibility standards are for usability in that setup.

[Alexander-Taran]

stale since 2016

[bigopon]

@jedd-ahyoung @AStoker

There is new API being discussed for this https://github.com/WICG/aom