Difference between revisions of "ARIA Accordion"

From Level Access Web Labs
Jump to navigation Jump to search
(Undo revision 5971 by Schou (talk))
(iOS)
 
Line 204: Line 204:
 
When the button is collapsed the region is no longer announced as expected.
 
When the button is collapsed the region is no longer announced as expected.
  
 
+
===mac OS voiceOver===
 +
When a button is activated, the new state is announced as expected.
 +
If a button is expanded, when VO+RIGHT ARROW is pressed, the focus is set to the top of the page. If the tab key is used then the focus goes to the region (new content) as expected.
 
[[Category:ARIA]]
 
[[Category:ARIA]]

Latest revision as of 19:31, 7 April 2020

This accordion uses buttons for the accordion headers with aria-expanded and aria-controls. Panels use the role of region with aria-labelledby referencing the accordion headers. The tab, tablist, or tabpanel roles are not used. There is no accordion role in ARIA. The last button ("Inaccessibility") is incorrectly formed, and contains the accordion's content inside the tag with role button. This was created to test behavior on iOS and Android devices with Voiceover and Talkback respectively.
Reference: WAI Description, Keyboard Interaction , States and Properties of Accordion: http://www.w3.org/TR/wai-aria-practices-1.1/#accordion
Accordion

Results

JAWS

JAWS 18 The expanded or collapsed STATE of the buttons is announced when the TAB or ARROW keys are used as expected. When the Button is expanded the region for the button is announced immediately after the button as expected. When the button is collapsed the region is no longer announced as expected.

NVDA

NVDA 2017.2 The expanded or collapsed STATE of the buttons is announced when the TAB or ARROW keys are used as expected. When the Button is expanded the region for the button is announced immediately after the button as expected. When the button is collapsed the region is no longer announced as expected.

iOS

VoiceOver iOS 10.3.2 The expanded or collapsed STATE of the buttons is announced as expected. When the Button is expanded the region for the button is announced immediately after the button as expected. When the button is collapsed the region is no longer announced as expected.

mac OS voiceOver

When a button is activated, the new state is announced as expected. If a button is expanded, when VO+RIGHT ARROW is pressed, the focus is set to the top of the page. If the tab key is used then the focus goes to the region (new content) as expected.