[Slideshow] Autorotating slideshow may be difficult to bypass #1183
Labels
Category: Accessibility
Bugs found while using assistive technology
Critical Path: 2
Affects some merchants/buyers
Effort: Medium
Severity: 1
Urgent Severity
Projects
Issue summary
When the slideshow is set to autorotate, screen reader users may have difficulty bypassing the slideshow content.
When the screen reader virtual cursor is on a slide and the slide moves to reveal the next slide, the virtual cursor focus position moves and is placed in an unexpected spot, such as the top of the slideshow or in the middle of the next slide. If the user is not fast enough to navigate through, this would create difficulty in bypassing the slideshow content, potentially creating a "keyboard trap."
Video demo
screen-20220113-125511.mp4
Steps to reproduce
Behavior
Expected
Actual
Recommendation
Since we can't detect when a screen reader is in use or where its virtual cursor is positioned in the DOM, we're unable to pause the slideshow when someone is navigating through it (as apposed to the browser cursor which we can detect via
document.activeElement
.)The next best solution is to place the slideshow controls (next, prev, pause, etc) at the top of the slideshow container. With this, the user will be able to pause the slideshow before entering the rotating content. This will allow the user to move through the slideshow with ease.
In order to not disrupt the indented design, use CSS to re-position the control container at the bottom of the slideshow container. Scoping this change to only when autorotate is enabled will help to avoid focus order issues for when autorotate is disabled.
Recommended code
HTML
Specifications
The text was updated successfully, but these errors were encountered: