Skip to content

Enable WCAG 2.2 A and AA Tests #8763

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
jrjohnson wants to merge 1 commit into
base: master
Choose a base branch
from
Draft

Enable WCAG 2.2 A and AA Tests #8763

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 20 additions & 1 deletion packages/frontend/tests/helpers/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,18 @@ import { setupMirage } from 'frontend/tests/test-support/mirage';
import { setupIntl } from 'ember-intl/test-support';
import { setRunOptions } from 'ember-a11y-testing/test-support';

/**
* In order to get wcag22 rules we have to specify the tags manually.
* see: https://github.com/dequelabs/axe-core/blob/develop/doc/rule-descriptions.md#wcag-22-level-a--aa-rules
*
* There is no supported way to add tags, only to send the entire list.
* see https://github.com/dequelabs/axe-core/issues/4717
*/
const runOnly = {
type: 'tag',
values: ['wcag2a', 'wcag2aa', 'wcag21a', 'wcag21aa', 'best-practice', 'wcag22a', 'wcag22aa'],
};

// This file exists to provide wrappers around ember-qunit's
// test setup functions. This way, you can easily extend the setup that is
// needed per test type.
Expand All @@ -28,21 +40,28 @@ function setupApplicationTest(hooks, options) {
//
setupIntl(hooks, 'en-us'); // ember-intl
setupMirage(hooks); // ember-mirage
setRunOptions({
preload: false,
runOnly,
});
}

function setupRenderingTest(hooks, options) {
upstreamSetupRenderingTest(hooks, options);
setupIntl(hooks, 'en-us'); // ember-intl

// Additional setup for rendering tests can be done here.

setRunOptions({
preload: false,
rules: {
//disable color-contrast check on integration tests as we don't have a full background or styles
'color-contrast': { enabled: false },
//dislable list-item as many components are just an li element not in a list
listitem: { enabled: false },
//disable heading order as many components have headings that start too low
'heading-order': { enabled: false },
},
runOnly,
});
}

Expand Down
4 changes: 0 additions & 4 deletions packages/frontend/tests/test-helper.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@ import { forceModulesToBeLoaded, sendCoverage } from 'ember-cli-code-coverage/te
import DefaultAdapter from 'ember-cli-page-object/adapters/rfc268';
import { setAdapter } from 'ember-cli-page-object/adapters';
import {
setRunOptions,
setupGlobalA11yHooks,
setupQUnitA11yAuditToggle,
setupConsoleLogger,
Expand All @@ -19,9 +18,6 @@ import start from 'ember-exam/test-support/start';
import './helpers/percy-snapshot-name';

setupConsoleLogger();
setRunOptions({
preload: false,
});
setupGlobalA11yHooks(() => true);
setupQUnitA11yAuditToggle(QUnit);

Expand Down
20 changes: 20 additions & 0 deletions packages/test-app/tests/helpers/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,18 @@ import { setupMirage } from 'test-app/tests/test-support/mirage';
import { setupIntl } from 'ember-intl/test-support';
import { setRunOptions } from 'ember-a11y-testing/test-support';

/**
* In order to get wcag22 rules we have to specify the tags manually.
* see: https://github.com/dequelabs/axe-core/blob/develop/doc/rule-descriptions.md#wcag-22-level-a--aa-rules
*
* There is no supported way to add tags, only to send the entire list.
* see https://github.com/dequelabs/axe-core/issues/4717
*/
const runOnly = {
type: 'tag',
values: ['wcag2a', 'wcag2aa', 'wcag21a', 'wcag21aa', 'best-practice', 'wcag22a', 'wcag22aa'],
};

// This file exists to provide wrappers around ember-qunit's
// test setup functions. This way, you can easily extend the setup that is
// needed per test type.
Expand All @@ -28,6 +40,10 @@ function setupApplicationTest(hooks, options) {
//
setupIntl(hooks, 'en-us'); // ember-intl
setupMirage(hooks); // ember-mirage
setRunOptions({
preload: false,
runOnly,
});
}

function setupRenderingTest(hooks, options) {
Expand All @@ -36,12 +52,16 @@ function setupRenderingTest(hooks, options) {

// Additional setup for rendering tests can be done here.
setRunOptions({
preload: false,
rules: {
//disable color-contrast check on integration tests as we don't have a full background or styles
'color-contrast': { enabled: false },
//dislable list-item as many components are just an li element not in a list
listitem: { enabled: false },
//disable heading order as many components have headings that start too low
'heading-order': { enabled: false },
},
runOnly,
});
}

Expand Down
4 changes: 0 additions & 4 deletions packages/test-app/tests/test-helper.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@ import { setupEmberOnerrorValidation } from 'ember-qunit';

import { forceModulesToBeLoaded, sendCoverage } from 'ember-cli-code-coverage/test-support';
import {
setRunOptions,
setupGlobalA11yHooks,
setupQUnitA11yAuditToggle,
setupConsoleLogger,
Expand All @@ -16,9 +15,6 @@ import {
import start from 'ember-exam/test-support/start';

setupConsoleLogger();
setRunOptions({
preload: false,
});
setupGlobalA11yHooks(() => true);
setupQUnitA11yAuditToggle(QUnit);

Expand Down
Loading