feat(aio): sidenav headers should be focusable buttons

Sidenav headers had been anchors w/o hrefs. These can’t take focus which makes you can’t navigate through them with keyboard. For a11y purposes, this PR turns them into buttons.
This commit is contained in:
Ward Bell
2017-05-15 14:52:39 -07:00
committed by Pete Bacon Darwin
parent 7ae0440cca
commit a68ad6d58d
5 changed files with 30 additions and 10 deletions

View File

@ -5,8 +5,8 @@ describe('site App', function() {
let page: SitePage;
beforeEach(() => {
SitePage.setWindowWidth(1050); // Make the window wide enough to show the SideNav side-by-side.
page = new SitePage();
page.setWindowWidth(1050); // Make the window wide enough to show the SideNav side-by-side.
page.navigateTo();
});

View File

@ -3,6 +3,7 @@ import { browser, element, by, promise, ElementFinder } from 'protractor';
const githubRegex = /https:\/\/github.com\/angular\/angular\//;
export class SitePage {
links = element.all(by.css('md-toolbar a'));
docsMenuLink = element(by.cssContainingText('aio-top-menu a', 'Docs'));
docViewer = element(by.css('aio-doc-viewer'));
@ -12,8 +13,14 @@ export class SitePage {
.filter((a: ElementFinder) => a.getAttribute('href').then(href => githubRegex.test(href)))
.first();
gaReady: promise.Promise<any>;
static setWindowWidth(newWidth: number) {
const win = browser.driver.manage().window();
return win.getSize().then(oldSize => win.setSize(newWidth, oldSize.height));
}
getNavItem(pattern: RegExp) {
return element.all(by.css('aio-nav-item a'))
return element.all(by.css('aio-nav-item .vertical-menu-item'))
.filter(element => element.getText().then(text => pattern.test(text)))
.first();
}
@ -35,11 +42,6 @@ export class SitePage {
return browser.executeScript('return arguments[0].innerHTML;', element);
}
setWindowWidth(newWidth: number) {
const win = browser.driver.manage().window();
return win.getSize().then(oldSize => win.setSize(newWidth, oldSize.height));
}
/**
* Replace the ambient Google Analytics tracker with homebrew spy
* don't send commands to GA during e2e testing!