At the moment, accordions that do not have a panel open by default are inaccessible via keyboard navigation using the Tab key. These changes add an additional check to the collapse tab initialization that adds a tabindex="1" property to the first child panel toggle of an accordion if no other child panel is open by default (i.e. has the "in" class).
To do this, it checks to see if the accordion container has any children with both the "panel-collapse" and "in" classes. If it doesn't, it adds a tabindex="0" to the first child panel toggle of the accordion container and a tabindex="-1" to the corresponding child panel.
This has been tested on the following:
Windows - Chrome 60, Firefox 54, Internet Explorer 11, Microsoft Edge 38
Linux - Chrome 60, Firefox 54
iOS 10.3.3 - Safari (Latest Version), Chrome 60
At the moment, accordions that do not have a panel open by default are inaccessible via keyboard navigation using the Tab key. These changes add an additional check to the collapse tab initialization that adds a
tabindex="1"
property to the first child panel toggle of an accordion if no other child panel is open by default (i.e. has the "in" class).To do this, it checks to see if the accordion container has any children with both the "panel-collapse" and "in" classes. If it doesn't, it adds a
tabindex="0"
to the first child panel toggle of the accordion container and atabindex="-1"
to the corresponding child panel.This has been tested on the following: Windows - Chrome 60, Firefox 54, Internet Explorer 11, Microsoft Edge 38 Linux - Chrome 60, Firefox 54 iOS 10.3.3 - Safari (Latest Version), Chrome 60
Windows - IE11 - JAWS Windows - Firefox 54 - NVDA