old-docs-site
old-docs-site copied to clipboard
Polymer
[Accessibility - multiple pages] Keyboard navigation on v.1.0 drop down
On Chrome OS with ChromeVox, the V.1.0 drop down in the top right corner doesn't appear to be keyboard navigable. This does work with VoiceOver on Mac. That said, I am not actually able to open the drop down with the keyboard. Will there be content within this? If so, please make sure that you can use the keyboard to open it, use the arrows to cycle through any options within it, press enter to activate any of the items, or press esc to close.
+aboxhall - any thoughts on this?
On Fri, Jun 5, 2015 at 4:57 PM, Arthur Evans [email protected] wrote:
Took a look at this, couldn't figure it out immediately.
— Reply to this email directly or view it on GitHub https://github.com/Polymer/docs/issues/1142#issuecomment-109485907.
sorry yeah the dropdown (and everything on the site) is using the old 0.5 Polymer elements, so none of the accessibility goodness that everyone has done recently is reflected there. We're planning to scrap the current site and redo it with 1.0 stuff, in the meantime we may need to extend that element and patch in keyboard support.
On Fri, Jun 5, 2015 at 8:13 PM, Laura Palmaro [email protected] wrote:
+aboxhall - any thoughts on this?
On Fri, Jun 5, 2015 at 4:57 PM, Arthur Evans [email protected] wrote:
Took a look at this, couldn't figure it out immediately.
— Reply to this email directly or view it on GitHub https://github.com/Polymer/docs/issues/1142#issuecomment-109485907.
— Reply to this email directly or view it on GitHub https://github.com/Polymer/docs/issues/1142#issuecomment-109513624.
Would it be pointless to ask for the hotfix of adding tabindex="0" to all of the core-item(s) on the left drop down without an a tag? If you use that hotfix with tabs and arrow keys, you get a confusing but semi-workable keyboard navigation.
@blissfulyoshi looking this over, I think all the core-items should have a tags inside of them. Do you mean the core-submenus?
@robdodson The ones with id="submenuItem" (All the top level menu labels with dropdowns, ex: "About this release" and "Get Started")
<core-item id="submenuItem" src="{{src}}" label="{{label}}" icon="{{icon}}" class="core-selected" on-tap="{{ activate }}" horizontal="" center="" layout="">
<content select=".item-content"></content>
</core-item>