Skip to content

Commit

Permalink
Infrastructure: Add queryElements test helper, remove t.plan from reg…
Browse files Browse the repository at this point in the history 
…ression tests (pull #1343)

Resolves issue #1312 with changes that:
* add queryElements helper
* update findElements to queryElements in tests, remove unused imports
* update missing awaits
* Add a lint check for findElements and exclude current uses
* Document `t` argument, unconditionally return `result`
* add assertNoElements test helper
* removed unnecessary eslit no-restricted-props
* update carousel tests to use queryElements

Co-authored-by: Simon Pieters <zcorpan@gmail.com>
Co-authored-by: Matt King <a11yThinker@Gmail.com>
  • Loading branch information
@smhigley @zcorpan @mcking65
3 people committed May 5, 2020
1 parent d06b4a5 commit b9f352d
Show file tree
Hide file tree
Showing 59 changed files with 1,149 additions and 1,863 deletions.
6 changes: 5 additions & 1 deletion .eslintrc.json
View file
Expand Up @@ -5,6 +5,10 @@
},
"rules": {
"no-unused-vars": 0,
"no-undef": 0
"no-undef": 0,
"no-restricted-properties": [2, {
"property": "findElements",
"message": "Please use t.context.queryElements()."
}]
}
}
4 changes: 3 additions & 1 deletion test/index.js
View file
Expand Up @@ -6,6 +6,7 @@ const webdriver = require('selenium-webdriver');
const { By } = require('selenium-webdriver');

const startGeckodriver = require('./util/start-geckodriver');
const queryElements = require('./util/queryElements');

let session, geckodriver;
const firefoxArgs = process.env.CI ? [ '-headless' ] : [];
Expand All @@ -30,6 +31,7 @@ if (!coverageReportRun) {
test.beforeEach((t) => {
t.context.session = session;
t.context.waitTime = testWaitTime;
t.context.queryElements = queryElements;
});

test.after.always(() => {
Expand Down Expand Up @@ -84,7 +86,7 @@ const _ariaTest = (desc, page, testId, body, failing) => {
if (testId !== 'test-additional-behavior') {
const assert = require('assert');
assert(
(await t.context.session.findElements(By.css(selector))).length,
(await t.context.queryElements(t, selector)).length,
'Cannot find behavior description for this test in example page:' + testId
);
}
Expand Down
68 changes: 27 additions & 41 deletions test/tests/accordion_accordion.js
View file
Expand Up @@ -2,7 +2,6 @@

const { ariaTest } = require('..');
const { By, Key } = require('selenium-webdriver');
const assertAttributeValues = require('../util/assertAttributeValues');
const assertAriaControls = require('../util/assertAriaControls');
const assertAriaLabelledby = require('../util/assertAriaLabelledby');

Expand Down Expand Up @@ -45,9 +44,8 @@ const focusMatchesElement = async function (t, selector) {
// Attributes

ariaTest('h3 element should wrap accordion button', exampleFile, 'h3-element', async (t) => {
t.plan(3);

const buttons = await t.context.session.findElements(By.css(ex.buttonSelector));

const buttons = await t.context.queryElements(t, ex.buttonSelector);

for (let button of buttons) {
t.is(
Expand All @@ -59,9 +57,8 @@ ariaTest('h3 element should wrap accordion button', exampleFile, 'h3-element', a
});

ariaTest('aria-expanded on button element', exampleFile, 'button-aria-expanded', async (t) => {
t.plan(9);

const buttons = await t.context.session.findElements(By.css(ex.buttonSelector));

const buttons = await t.context.queryElements(t, ex.buttonSelector);

for (let expandIndex = 0; expandIndex < buttons.length; expandIndex++) {

Expand All @@ -81,15 +78,13 @@ ariaTest('aria-expanded on button element', exampleFile, 'button-aria-expanded',
});

ariaTest('aria-controls on button element', exampleFile, 'button-aria-controls', async (t) => {
t.plan(1);


await assertAriaControls(t, ex.buttonSelector);
});

ariaTest('"aria-disabled" set on expanded sections', exampleFile, 'button-aria-disabled', async (t) => {
t.plan(9);

const buttons = await t.context.session.findElements(By.css(ex.buttonSelector));

const buttons = await t.context.queryElements(t, ex.buttonSelector);

for (let expandIndex = 0; expandIndex < buttons.length; expandIndex++) {

Expand All @@ -109,9 +104,8 @@ ariaTest('"aria-disabled" set on expanded sections', exampleFile, 'button-aria-d
});

ariaTest('role "region" exists on accordion panels', exampleFile, 'region-role', async (t) => {
t.plan(3);

const buttons = await t.context.session.findElements(By.css(ex.buttonSelector));

const buttons = await t.context.queryElements(t, ex.buttonSelector);
const panelIds = [];
for (let button of buttons) {
panelIds.push(await button.getAttribute('aria-controls'));
Expand All @@ -127,18 +121,16 @@ ariaTest('role "region" exists on accordion panels', exampleFile, 'region-role',
});

ariaTest('"aria-labelledby" on region', exampleFile, 'region-aria-labelledby', async (t) => {
t.plan(1);
await assertAriaLabelledby(t, ex.panelSelector);
await assertAriaLabelledby(t, ex.panelSelector);
});


// Keys

ariaTest('ENTER key expands section', exampleFile, 'key-enter-or-space', async (t) => {
t.plan(12);

const buttons = await t.context.session.findElements(By.css(ex.buttonSelector));
const panels = await t.context.session.findElements(By.css(ex.panelSelector));

const buttons = await t.context.queryElements(t, ex.buttonSelector);
const panels = await t.context.queryElements(t, ex.panelSelector);

for (let expandIndex of [1, 2, 0]) {
await buttons[expandIndex].sendKeys(Key.ENTER);
Expand Down Expand Up @@ -170,10 +162,9 @@ ariaTest('ENTER key expands section', exampleFile, 'key-enter-or-space', async (
});

ariaTest('SPACE key expands section', exampleFile, 'key-enter-or-space', async (t) => {
t.plan(12);

const buttons = await t.context.session.findElements(By.css(ex.buttonSelector));
const panels = await t.context.session.findElements(By.css(ex.panelSelector));

const buttons = await t.context.queryElements(t, ex.buttonSelector);
const panels = await t.context.queryElements(t, ex.panelSelector);

for (let expandIndex of [1, 2, 0]) {
await buttons[expandIndex].sendKeys(Key.SPACE);
Expand Down Expand Up @@ -205,9 +196,8 @@ ariaTest('SPACE key expands section', exampleFile, 'key-enter-or-space', async (
});

ariaTest('TAB moves focus between headers and displayed inputs', exampleFile, 'key-tab', async (t) => {
t.plan(22);

const buttons = await t.context.session.findElements(By.css(ex.buttonSelector));

const buttons = await t.context.queryElements(t, ex.buttonSelector);

// Open a panel
await buttons[0].click();
Expand Down Expand Up @@ -280,9 +270,8 @@ ariaTest('TAB moves focus between headers and displayed inputs', exampleFile, 'k
});

ariaTest('SHIFT+TAB moves focus between headers and displayed inputs', exampleFile, 'key-shift-tab', async (t) => {
t.plan(22);

const buttons = await t.context.session.findElements(By.css(ex.buttonSelector));

const buttons = await t.context.queryElements(t, ex.buttonSelector);

// Open a panel
await buttons[0].click();
Expand Down Expand Up @@ -358,9 +347,8 @@ ariaTest('SHIFT+TAB moves focus between headers and displayed inputs', exampleFi
});

ariaTest('DOWN ARROW moves focus between headers', exampleFile, 'key-down-arrow', async (t) => {
t.plan(3);

const buttons = await t.context.session.findElements(By.css(ex.buttonSelector));

const buttons = await t.context.queryElements(t, ex.buttonSelector);

// Confirm focus moves through remaining items
for (let index = 0; index < ex.buttonsInOrder.length - 1; index++) {
Expand All @@ -387,7 +375,7 @@ ariaTest('DOWN ARROW moves focus between headers', exampleFile, 'key-down-arrow'

ariaTest('UP ARROW moves focus between headers', exampleFile, 'key-up-arrow', async (t) => {

const buttons = await t.context.session.findElements(By.css(ex.buttonSelector));
const buttons = await t.context.queryElements(t, ex.buttonSelector);

// Confirm focus moves through remaining items
for (let index = ex.buttonsInOrder.length - 1; index > 0; index--) {
Expand All @@ -413,9 +401,8 @@ ariaTest('UP ARROW moves focus between headers', exampleFile, 'key-up-arrow', as
});

ariaTest('HOME key will always move focus to first button', exampleFile, 'key-home', async (t) => {
t.plan(3);

const buttons = await t.context.session.findElements(By.css(ex.buttonSelector));

const buttons = await t.context.queryElements(t, ex.buttonSelector);
const lastIndex = ex.buttonsInOrder.length - 1;

// Confirm focus moves through remaining items
Expand All @@ -433,9 +420,8 @@ ariaTest('HOME key will always move focus to first button', exampleFile, 'key-ho
});

ariaTest('END key will always move focus to last button', exampleFile, 'key-end', async (t) => {
t.plan(3);

const buttons = await t.context.session.findElements(By.css(ex.buttonSelector));

const buttons = await t.context.queryElements(t, ex.buttonSelector);
const lastIndex = ex.buttonsInOrder.length - 1;

// Confirm focus moves through remaining items
Expand Down
5 changes: 2 additions & 3 deletions test/tests/alert_alert.js
View file
@@ -1,7 +1,7 @@
'use strict';

const { ariaTest } = require('..');
const { By, Key } = require('selenium-webdriver');
const { By } = require('selenium-webdriver');

const exampleFile = 'alert/alert.html';

Expand All @@ -13,8 +13,7 @@ const ex = {
// Attributes

ariaTest('role="alert" on alert element', exampleFile, 'alert-role', async (t) => {
t.plan(2);


t.false(
await t.context.session.findElement(By.css(ex.alertSelector)).isDisplayed(),
'[role="alert"] element found and should not be displayed on pageload'
Expand Down
10 changes: 4 additions & 6 deletions test/tests/breadcrumb_index.js
View file
@@ -1,7 +1,7 @@
'use strict';

const { ariaTest } = require('..');
const { By, Key } = require('selenium-webdriver');
const { By } = require('selenium-webdriver');
const assertAriaLabelExists = require('../util/assertAriaLabelExists');

const exampleFile = 'breadcrumb/index.html';
Expand All @@ -13,15 +13,13 @@ const ex = {
// Attributes

ariaTest('aria-label attribute on nav element', exampleFile, 'aria-label', async (t) => {
t.plan(1);
await assertAriaLabelExists(t, ex.breadcrumbSelector);
await assertAriaLabelExists(t, ex.breadcrumbSelector);
});

ariaTest('aria-current element should exist on relevent link', exampleFile, 'aria-current', async (t) => {
t.plan(2);


let navElement = await t.context.session.findElement(By.css(ex.breadcrumbSelector));
let currentElement = await navElement.findElements(By.css('[aria-current]'));
let currentElement = await t.context.queryElements(t, '[aria-current]', navElement);

t.is(
currentElement.length,
Expand Down
15 changes: 5 additions & 10 deletions test/tests/button_button.js
View file
Expand Up @@ -22,8 +22,7 @@ const ex = {
// Attributes

ariaTest('Example elements should have role="button" set', exampleFile, 'button-role', async (t) => {
t.plan(4);


for (let button of ex.buttons) {
let buttonEl = await t.context.session.findElement(By.id(button.id));

Expand All @@ -42,8 +41,7 @@ ariaTest('Example elements should have role="button" set', exampleFile, 'button-
});

ariaTest('Button examples should have tabindex="0"', exampleFile, 'button-tabindex', async (t) => {
t.plan(2);


for (let button of ex.buttons) {
let buttonEl = await t.context.session.findElement(By.id(button.id));

Expand All @@ -56,8 +54,7 @@ ariaTest('Button examples should have tabindex="0"', exampleFile, 'button-tabind
});

ariaTest('"aria-pressed" reflects button state', exampleFile, 'button-aria-pressed', async (t) => {
t.plan(3);


let toggleButtonSelector = '#' + ex.buttons[1].id;

let ariaPressedExists = await t.context.session.executeScript(async function () {
Expand Down Expand Up @@ -93,8 +90,7 @@ ariaTest('"aria-pressed" reflects button state', exampleFile, 'button-aria-press
});

ariaTest('key ENTER activates button', exampleFile, 'key-enter', async (t) => {
t.plan(3);


let toggleButtonSelector = '#' + ex.buttons[1].id;
let toggleButtonEl = await t.context.session.findElement(By.css(toggleButtonSelector));

Expand Down Expand Up @@ -149,8 +145,7 @@ ariaTest('key ENTER activates button', exampleFile, 'key-enter', async (t) => {
});

ariaTest('key SPACE activates button', exampleFile, 'key-space', async (t) => {
t.plan(3);


let toggleButtonSelector = '#' + ex.buttons[1].id;
let toggleButtonEl = await t.context.session.findElement(By.css(toggleButtonSelector));

Expand Down

0 comments on commit b9f352d

Please sign in to comment.