From 7af23772910e7dae1ddf83e962d23ddc21bb69ce Mon Sep 17 00:00:00 2001 From: Steve Calvert Date: Thu, 20 Aug 2020 17:13:29 -0700 Subject: [PATCH] Reformats all files using Prettier --- .travis.yml | 2 +- CHANGELOG.md | 93 ++++---- README.md | 90 ++++---- RELEASE.md | 18 +- addon-test-support/audit-if.js | 12 +- addon-test-support/audit.js | 36 +-- addon-test-support/utils.js | 13 +- addon/instance-initializers/axe-component.js | 54 +++-- .../violations-helper.js | 2 +- addon/utils/concurrent-axe.js | 3 +- addon/utils/format-violation.js | 12 +- addon/utils/is-background-replaced-element.js | 23 +- addon/utils/violations-helper.js | 26 ++- app/instance-initializers/axe-component.js | 5 +- .../violations-helper.js | 5 +- config/ember-try.js | 68 +++--- config/environment.js | 4 +- config/release.js | 2 +- content-for/head-footer.html | 37 ++-- ember-cli-build.js | 2 +- index.js | 45 ++-- package.json | 2 +- renovate.json | 9 +- testem.js | 16 +- tests/acceptance/a11y-audit-test.js | 46 ++-- tests/acceptance/violations-test.js | 9 +- tests/dummy/app/app.js | 2 +- .../app/components/_base-demo-component.js | 2 +- tests/dummy/app/components/axe-component.js | 3 +- tests/dummy/app/components/empty-button.js | 2 +- tests/dummy/app/components/page-title.js | 2 +- .../dummy/app/components/passing-component.js | 5 +- .../app/components/violations-grid-item.js | 3 +- tests/dummy/app/components/x-button.js | 3 +- tests/dummy/app/components/x-div.js | 2 +- tests/dummy/app/components/x-image.js | 3 +- tests/dummy/app/components/x-paragraph.js | 2 +- tests/dummy/app/components/x-text-input.js | 3 +- tests/dummy/app/index.html | 12 +- .../initializers/component-data-attributes.js | 4 +- tests/dummy/app/router.js | 4 +- tests/dummy/app/routes/ignored-image-alt.js | 3 +- tests/dummy/app/routes/index.js | 3 +- tests/dummy/app/routes/violations.js | 17 +- tests/dummy/app/styles/app.scss | 15 +- .../app/styles/components/_components.scss | 10 +- .../app/styles/components/_radio-track.scss | 48 ++-- .../components/_violations-grid-item.scss | 2 - .../object-patterns/_object-patterns.scss | 4 +- tests/dummy/app/styles/pages/_pages.scss | 2 +- tests/dummy/app/styles/pages/_violations.scss | 3 - tests/dummy/app/styles/typography/_fonts.scss | 15 +- .../app/styles/typography/_headings.scss | 7 +- .../app/styles/typography/_typography.scss | 4 +- .../app/styles/utilities/_utilities.scss | 24 +- .../app/styles/variables/_variables.scss | 25 +-- tests/dummy/config/environment.js | 16 +- tests/dummy/config/targets.js | 4 +- tests/index.html | 26 +-- .../integration/helpers/a11y-audit-if-test.js | 16 +- tests/integration/helpers/a11y-audit-test.js | 30 +-- .../axe-component-test.js | 207 +++++++++++------- .../violations-helper-test.js | 10 +- tests/unit/utils/concurrent-axe-test.js | 40 ++-- tests/unit/utils/format-violation-test.js | 42 ++-- .../is-background-replaced-element-test.js | 16 +- tests/unit/utils/violations-helper-test.js | 65 ++++-- tsconfig.json | 29 +-- types/dummy/index.d.ts | 1 - yarn.lock | 8 +- 70 files changed, 753 insertions(+), 625 deletions(-) diff --git a/.travis.yml b/.travis.yml index 159e82b8..88a022f0 100644 --- a/.travis.yml +++ b/.travis.yml @@ -3,7 +3,7 @@ language: node_js node_js: # we recommend testing addons with the same minimum supported node version as Ember CLI # so that your addon works for all apps - - "10" + - '10' os: linux diff --git a/CHANGELOG.md b/CHANGELOG.md index e85b62a0..e2fd941c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,94 +1,93 @@ - # 3.0.1 / 2020-06-29 - * Update dependency ember-cli-htmlbars to v5.2.0 - * Update dependency eslint-plugin-ember to v8.9.0 - * Update dependency sass to v1.26.9 - * Update ember packages - * Update dependency axe-core to v3.5.5 - * Update dependency eslint-plugin-ember to v8.7.0 +- Update dependency ember-cli-htmlbars to v5.2.0 +- Update dependency eslint-plugin-ember to v8.9.0 +- Update dependency sass to v1.26.9 +- Update ember packages +- Update dependency axe-core to v3.5.5 +- Update dependency eslint-plugin-ember to v8.7.0 # 3.0.1 / 2020-05-18 - * Update dependency ember-cli-version-checker to v5.1.1 - * Update dependency eslint-plugin-ember to v8.5.1 - * Update ember packages +- Update dependency ember-cli-version-checker to v5.1.1 +- Update dependency eslint-plugin-ember to v8.5.1 +- Update ember packages # 3.0.0 / 2020-05-07 - * Drops support for Ember 2.18 due to major dependencies - * Drops support for Node.js v8 due to EOL - * Update eslint - * Update dependency ember-cli-version-checker to v5 - * Update dependency @ember/optional-features to v1 - * Update ember packages - * Update sass - * Update dependency ember-cli-github-pages to v0.2.2 - * Update dependency axe-core to v3.5.3 - * Update dependency ember-radio-button to v2 +- Drops support for Ember 2.18 due to major dependencies +- Drops support for Node.js v8 due to EOL +- Update eslint +- Update dependency ember-cli-version-checker to v5 +- Update dependency @ember/optional-features to v1 +- Update ember packages +- Update sass +- Update dependency ember-cli-github-pages to v0.2.2 +- Update dependency axe-core to v3.5.3 +- Update dependency ember-radio-button to v2 # 2.0.0 / 2019-11-21 - * Upgrade Ember CLI to 3.12 LTS and drop Node.js 6 support ([#138](https://github.com/ember-a11y/ember-a11y-testing/pull/138)) +- Upgrade Ember CLI to 3.12 LTS and drop Node.js 6 support ([#138](https://github.com/ember-a11y/ember-a11y-testing/pull/138)) # 1.1.1 / 2019-09-29 - * Fixes code included in production builds [#108] ([#134](https://github.com/ember-a11y/ember-a11y-testing/pull/134)) +- Fixes code included in production builds [#108](<[#134](https://github.com/ember-a11y/ember-a11y-testing/pull/134)>) # 1.1.0 / 2019-09-09 - * Bumps axe-core to v3.3 - * Adds concurrent-axe strict check to counter next() 0 value - * Fixes [#124](https://github.com/ember-a11y/ember-a11y-testing/issues/124), allows a11yAudit to account for axe inlude/exclude context param - * Fixes [#127](https://github.com/ember-a11y/ember-a11y-testing/issues/127), removes use of Ember.Logger - * Fixes [#107](https://github.com/ember-a11y/ember-a11y-testing/issues/107) by adding app re-exports +- Bumps axe-core to v3.3 +- Adds concurrent-axe strict check to counter next() 0 value +- Fixes [#124](https://github.com/ember-a11y/ember-a11y-testing/issues/124), allows a11yAudit to account for axe inlude/exclude context param +- Fixes [#127](https://github.com/ember-a11y/ember-a11y-testing/issues/127), removes use of Ember.Logger +- Fixes [#107](https://github.com/ember-a11y/ember-a11y-testing/issues/107) by adding app re-exports # 0.5.7 / 2019-03-08 - * Axe-core version bump to 3.2.2 +- Axe-core version bump to 3.2.2 # 0.5.6 / 2018-11-22 - * Adds user timing mechanism for performance profiling - * Use process.env.EMBER_ENV for env check +- Adds user timing mechanism for performance profiling +- Use process.env.EMBER_ENV for env check # 0.5.5 / 2018-11-04 - * Fixes #113: provides empty object if axeOptions are not defined to prevent axe.run from failing +- Fixes #113: provides empty object if axeOptions are not defined to prevent axe.run from failing # 0.5.4 / 2018-10-22 - * Fix services for engines, add option to exclude axe-core for component audits +- Fix services for engines, add option to exclude axe-core for component audits # 0.5.3 / 2018-10-01 - * Update axe-core to 3.1.2 ([#109](https://github.com/ember-a11y/ember-a11y-testing/pull/109)) - * Make aXe v3 compatible with component audit - * Fix “Visual Noise Level” demo page +- Update axe-core to 3.1.2 ([#109](https://github.com/ember-a11y/ember-a11y-testing/pull/109)) +- Make aXe v3 compatible with component audit +- Fix “Visual Noise Level” demo page # 0.5.2 / 2018-06-05 - * Improve Test Failure Messages ([#103](https://github.com/ember-a11y/ember-a11y-testing/pull/103)) - * Update README with aXe Options and Scoped Auditing ([#104]((https://github.com/ember-a11y/ember-a11y-testing/pull/104))) - * Upgrade axe-core to 2.6.1 ([#98]((https://github.com/ember-a11y/ember-a11y-testing/pull/98))) - * Fix: `a11yAudit` not using default `axeOptions` ([#100]((https://github.com/ember-a11y/ember-a11y-testing/pull/100))) +- Improve Test Failure Messages ([#103](https://github.com/ember-a11y/ember-a11y-testing/pull/103)) +- Update README with aXe Options and Scoped Auditing ([#104](<(https://github.com/ember-a11y/ember-a11y-testing/pull/104)>)) +- Upgrade axe-core to 2.6.1 ([#98](<(https://github.com/ember-a11y/ember-a11y-testing/pull/98)>)) +- Fix: `a11yAudit` not using default `axeOptions` ([#100](<(https://github.com/ember-a11y/ember-a11y-testing/pull/100)>)) # 0.5.1 / 2018-02-20 - * Update Ember-CLI to 2.18.x ([#94]((https://github.com/ember-a11y/ember-a11y-testing/pull/94))) - * Add check of `isDestroyed` when running an audit ([#92]((https://github.com/ember-a11y/ember-a11y-testing/pull/92))) +- Update Ember-CLI to 2.18.x ([#94](<(https://github.com/ember-a11y/ember-a11y-testing/pull/94)>)) +- Add check of `isDestroyed` when running an audit ([#92](<(https://github.com/ember-a11y/ember-a11y-testing/pull/92)>)) # 0.5.0 / 2017-10-19 - * Update a couple more dependencies - * Update runtime dependencies +- Update a couple more dependencies +- Update runtime dependencies # 0.4.4 / 2017-10-05 - - Package upgrades and locking version of htmlbars-inline-precompile - - update README -change double-ticks to single-ticks - - update README to combine axeOptions examples - - README - example to disable color contrast scroll +- Package upgrades and locking version of htmlbars-inline-precompile +- update README -change double-ticks to single-ticks +- update README to combine axeOptions examples +- README - example to disable color contrast scroll # 0.4.3 / 2017-06-21 diff --git a/README.md b/README.md index 9b53df49..f6bf30bb 100644 --- a/README.md +++ b/README.md @@ -13,17 +13,13 @@ workflow by running during a component's `didRender` phase in non-production environments. This gives you instant feedback on if your components are accessible in any given state. +## Compatibility -Compatibility ------------------------------------------------------------------------------- +- Ember.js v3.0.0 or above +- Ember CLI v3.0.0 or above +- Node.js v10 or above -* Ember.js v3.0.0 or above -* Ember CLI v3.0.0 or above -* Node.js v10 or above - - -Installation ------------------------------------------------------------------------------- +## Installation ```bash ember install ember-a11y-testing @@ -57,7 +53,7 @@ import a11yAudit from 'ember-a11y-testing/test-support/audit'; // ...elided for brevity -test('Some test case', async function(assert) { +test('Some test case', async function (assert) { await visit('/'); await a11yAudit(); assert.ok(true, 'no a11y errors found!'); @@ -71,7 +67,7 @@ import a11yAudit from 'ember-a11y-testing/test-support/audit'; // ...elided for brevity -test('Some test case', function(assert) { +test('Some test case', function (assert) { visit('/'); a11yAudit(); andThen(() => assert.ok(true, 'no a11y errors found!')); @@ -83,13 +79,13 @@ either a selector string or an HTML element. You can also provide a secondary parameter to specify axe-core options: ```js -test('Some test case', async function(assert) { +test('Some test case', async function (assert) { let axeOptions = { rules: { 'button-name': { - enabled: false - } - } + enabled: false, + }, + }, }; await visit('/'); @@ -101,13 +97,13 @@ test('Some test case', async function(assert) { Or specify options as a single argument: ```js -test('Some test case', async function(assert) { +test('Some test case', async function (assert) { let axeOptions = { rules: { 'button-name': { - enabled: false - } - } + enabled: false, + }, + }, }; await visit('/'); @@ -125,15 +121,15 @@ import a11yAudit from 'ember-a11y-testing/test-support/audit'; // ...elided for brevity -test('Some test case', function(assert) { +test('Some test case', function (assert) { this.render(hbs`{{some-component}}`); let axeOptions = { rules: { 'button-name': { - enabled: false - } - } + enabled: false, + }, + }, }; return a11yAudit(this.element, axeOptions).then(() => { assert.ok(true, 'no a11y errors found!'); @@ -176,32 +172,34 @@ after state changes, and since the checks are scoped to a component's element, it means that any state change propagated downwards is also caught. #### Inspecting Violations + When a violation is detected for a component's element, Ember A11y Testing will attempt to visually indicate the violation by updating the component's element `className`. The class used is determined as follows: -1) If a component's `axeViolationClassNames` property is set, these names will always be used. This provides a way for you to customize the styling of a violation to your own needs. - - `axeViolationClassNames` can be passed in your template, with each name as an element in a space-separated string: +1. If a component's `axeViolationClassNames` property is set, these names will always be used. This provides a way for you to customize the styling of a violation to your own needs. + +- `axeViolationClassNames` can be passed in your template, with each name as an element in a space-separated string: - ```hbs - {{x-button - id="violations__empty-button" - data-test-selector="empty-button" - axeViolationClassNames="outline outline--red" - }} - ``` +```hbs + {{x-button + id="violations__empty-button" + data-test-selector="empty-button" + axeViolationClassNames="outline outline--red" + }} +``` - - they can also be defined as an array of names within your component: +- they can also be defined as an array of names within your component: - ```javascript - axeViolationClassNames: ['outline', 'outline--red'] - ``` +```javascript +axeViolationClassNames: ['outline', 'outline--red']; +``` -2) By forgoing custom styling, you can rely on Ember A11y Testing's own set of -default styles. These are set according to a series of configurable -`visualNoiseLevel`s spanning from 1 to 3, and a special styling is applied to element's whose default appearance would require a different set of rules for visibility. +2. By forgoing custom styling, you can rely on Ember A11y Testing's own set of + default styles. These are set according to a series of configurable + `visualNoiseLevel`s spanning from 1 to 3, and a special styling is applied to element's whose default appearance would require a different set of rules for visibility. ```hbs {{x-button @@ -230,7 +228,6 @@ At the same time, a violation error message will be logged to the console with e ![](docs/assets/violation-log-output.png) - ##### Special Styling for Background-replaced elements As mentioned, some HTML elements are considered to be @@ -248,7 +245,6 @@ of the component's current noise level: ![](docs/assets/violation-replaced-bg-element.png) - #### Component Hooks Since development is not a uniform experience, Ember A11y Testing provides @@ -275,7 +271,9 @@ As with testing, if you need to set custom auditing options for a component, you can do so easily. Simply set a value for the `axeOptions` property value: ```javascript -axeOptions: { /* a11yCheck options */ } +axeOptions: { + /* a11yCheck options */ +} ``` ##### Turning the audit off @@ -284,7 +282,7 @@ Lastly, if you really find the audits to be cramping development, you can turn them off via a simple boolean switch: ```javascript -turnAuditOff: true +turnAuditOff: true; ``` #### Environment Options @@ -298,9 +296,9 @@ ENV['ember-a11y-testing'] = { axeCallback: defaultAxeCallback, axeOptions: defaultAxeOptions, visualNoiseLevel: 2, - axeViolationClassNames: ['alert-box', 'alert-box--a11y'] - } -} + axeViolationClassNames: ['alert-box', 'alert-box--a11y'], + }, +}; ``` By example, to enable a specific rule and to set options for a specific check, you can: diff --git a/RELEASE.md b/RELEASE.md index acdf5ac2..b8fc7bb6 100644 --- a/RELEASE.md +++ b/RELEASE.md @@ -4,7 +4,6 @@ Releases are mostly automated using [release-it](https://github.com/release-it/release-it/) and [lerna-changelog](https://github.com/lerna/lerna-changelog/). - ## Preparation Since the majority of the actual release process is automated, the primary @@ -18,25 +17,24 @@ guiding principle here is that changelogs are for humans, not machines. When reviewing merged PR's the labels to be used are: -* breaking - Used when the PR is considered a breaking change. -* enhancement - Used when the PR adds a new feature or enhancement. -* bug - Used when the PR fixes a bug included in a previous release. -* documentation - Used when the PR adds or updates documentation. -* internal - Used for internal changes that still require a mention in the +- breaking - Used when the PR is considered a breaking change. +- enhancement - Used when the PR adds a new feature or enhancement. +- bug - Used when the PR fixes a bug included in a previous release. +- documentation - Used when the PR adds or updates documentation. +- internal - Used for internal changes that still require a mention in the changelog/release notes. - ## Release Once the prep work is completed, the release itself is straightforward: -* First, ensure that you have installed your projects dependencies: +- First, ensure that you have installed your projects dependencies: ``` yarn install ``` -* Second, ensure that you have obtained a +- Second, ensure that you have obtained a [GitHub personal access token][generate-token] with the `repo` scope (no other permissions are needed). Make sure the token is available as the `GITHUB_AUTH` environment variable. @@ -49,7 +47,7 @@ yarn install [generate-token]: https://github.com/settings/tokens/new?scopes=repo&description=GITHUB_AUTH+env+variable -* And last (but not least 😁) do your release. +- And last (but not least 😁) do your release. ``` npx release-it diff --git a/addon-test-support/audit-if.js b/addon-test-support/audit-if.js index 65471b2b..e741587f 100644 --- a/addon-test-support/audit-if.js +++ b/addon-test-support/audit-if.js @@ -9,10 +9,12 @@ import utils from './utils'; * @private */ function getUrlParameter(name) { - const location = utils.getLocation(); - const regex = new RegExp('[\\?&]' + name + '=([^&#]*)'); - const results = regex.exec(location.search); - return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' ')); + const location = utils.getLocation(); + const regex = new RegExp('[\\?&]' + name + '=([^&#]*)'); + const results = regex.exec(location.search); + return results === null + ? '' + : decodeURIComponent(results[1].replace(/\+/g, ' ')); } /** @@ -22,7 +24,7 @@ function getUrlParameter(name) { * @public */ export default function a11yAuditIf(...args) { - if(getUrlParameter('enableA11yAudit') === 'true') { + if (getUrlParameter('enableA11yAudit') === 'true') { return a11yAudit(...args); } diff --git a/addon-test-support/audit.js b/addon-test-support/audit.js index e91a61f5..52955747 100644 --- a/addon-test-support/audit.js +++ b/addon-test-support/audit.js @@ -19,17 +19,19 @@ function a11yAuditCallback(results) { for (let i = 0, l = violations.length; i < l; i++) { let violation = violations[i]; - let violationNodes = violation.nodes.map(node => node.html); + let violationNodes = violation.nodes.map((node) => node.html); let violationMessage = formatViolation(violation, violationNodes); allViolations.push(violationMessage); - console.error(violationMessage, violation); // eslint-disable-line no-console + console.error(violationMessage, violation); // eslint-disable-line no-console violationsHelper.push(violation); } let allViolationMessages = allViolations.join('\n'); - assert(`The page should have no accessibility violations. Violations:\n${allViolationMessages}`); + assert( + `The page should have no accessibility violations. Violations:\n${allViolationMessages}` + ); } } @@ -52,7 +54,10 @@ function isPlainObj(obj) { * @return {Boolean} */ function isNotSelectorObj(obj) { - return !obj.hasOwnProperty('include') && !obj.hasOwnProperty('exclude'); + return ( + !Object.prototype.hasOwnProperty.call(obj, 'include') && + !Object.prototype.hasOwnProperty.call(obj, 'exclude') + ); } /** @@ -63,11 +68,18 @@ function isNotSelectorObj(obj) { * @method runA11yAudit * @private */ -function runA11yAudit(contextSelector = '#ember-testing-container', axeOptions) { +function runA11yAudit( + contextSelector = '#ember-testing-container', + axeOptions +) { mark('a11y_audit_start'); // Support passing axeOptions as a single argument - if (arguments.length === 1 && isPlainObj(contextSelector) && isNotSelectorObj(contextSelector)) { + if ( + arguments.length === 1 && + isPlainObj(contextSelector) && + isNotSelectorObj(contextSelector) + ) { axeOptions = contextSelector; contextSelector = '#ember-testing-container'; } @@ -88,15 +100,13 @@ function runA11yAudit(contextSelector = '#ember-testing-container', axeOptions) } else { return reject(error); } - }) + }); }); - return auditPromise - .then(a11yAuditCallback) - .finally(() => { - document.body.classList.remove('axe-running'); - markEndAndMeasure('a11y_audit', 'a11y_audit_start', 'a11y_audit_end'); - }); + return auditPromise.then(a11yAuditCallback).finally(() => { + document.body.classList.remove('axe-running'); + markEndAndMeasure('a11y_audit', 'a11y_audit_start', 'a11y_audit_end'); + }); } /** diff --git a/addon-test-support/utils.js b/addon-test-support/utils.js index 4c555b4c..f98cffe1 100644 --- a/addon-test-support/utils.js +++ b/addon-test-support/utils.js @@ -14,10 +14,12 @@ const performance = hasPerformanceApi() ? window.performance : undefined; * @private */ function hasPerformanceApi() { - return window && + return ( + window && typeof window.performance !== 'undefined' && typeof window.performance.mark === 'function' && - typeof window.performance.measure === 'function'; + typeof window.performance.measure === 'function' + ); } /** @@ -48,7 +50,10 @@ export function measure(comment, startMark, endMark) { performance.measure(comment, startMark, endMark); } catch (e) { // eslint-disable-next-line no-console - console.warn('performance.measure could not be executed because of ', e.message); + console.warn( + 'performance.measure could not be executed because of ', + e.message + ); } } @@ -77,5 +82,5 @@ export default { */ getLocation() { return window && window.location; - } + }, }; diff --git a/addon/instance-initializers/axe-component.js b/addon/instance-initializers/axe-component.js index 3eb969c9..4cd4494b 100644 --- a/addon/instance-initializers/axe-component.js +++ b/addon/instance-initializers/axe-component.js @@ -25,10 +25,12 @@ const VIOLATION_CLASS_MAP = { LEVEL_1: VIOLATION_CLASS__LEVEL_1, LEVEL_2: VIOLATION_CLASS__LEVEL_2, LEVEL_3: VIOLATION_CLASS__LEVEL_3, - REPLACED_ELEMENT: VIOLATION_CLASS__REPLACED + REPLACED_ELEMENT: VIOLATION_CLASS__REPLACED, }; -const VIOLATION_CLASS_NAMES = Object.keys(VIOLATION_CLASS_MAP).map(key => VIOLATION_CLASS_MAP[key]); +const VIOLATION_CLASS_NAMES = Object.keys(VIOLATION_CLASS_MAP).map( + (key) => VIOLATION_CLASS_MAP[key] +); /** * Variable to ensure that the initializer is only ran once. Though in this @@ -38,7 +40,9 @@ const VIOLATION_CLASS_NAMES = Object.keys(VIOLATION_CLASS_MAP).map(key => VIOLAT let hasRan = false; export function initialize(appInstance) { - if (hasRan) { return; } + if (hasRan) { + return; + } const ENV = appInstance.resolveRegistration('config:environment'); const addonConfig = ENV['ember-a11y-testing'] || {}; @@ -50,11 +54,15 @@ export function initialize(appInstance) { axeOptions = {}, axeCallback, visualNoiseLevel: configuredVisualNoiseLevel, - axeViolationClassNames: configuredAxeViolationClassNames + axeViolationClassNames: configuredAxeViolationClassNames, } = componentOptions; - let visualNoiseLevel = configuredVisualNoiseLevel ? configuredVisualNoiseLevel : 1; - let axeViolationClassNames = isPresent(configuredAxeViolationClassNames) ? configuredAxeViolationClassNames : []; + let visualNoiseLevel = configuredVisualNoiseLevel + ? configuredVisualNoiseLevel + : 1; + let axeViolationClassNames = isPresent(configuredAxeViolationClassNames) + ? configuredAxeViolationClassNames + : []; let turnAuditOff = configuredTurnAuditOff || false; // Avoid modifying the Component class if the visual audit feature is configured disabled @@ -131,8 +139,10 @@ export function initialize(appInstance) { return [VIOLATION_CLASS_MAP[`LEVEL_${visualNoiseLevel}`]]; } - return isArray(customViolationClass) ? customViolationClass : customViolationClass.trim().split(/\s+/); - } + return isArray(customViolationClass) + ? customViolationClass + : customViolationClass.trim().split(/\s+/); + }, }), didRender() { @@ -180,12 +190,17 @@ export function initialize(appInstance) { for (let j = 0, k = nodes.length; j < k; j++) { nodeData = nodes[j]; - console.error(formatViolation(violation, nodeData.html), violation); // eslint-disable-line no-console + console.error( + formatViolation(violation, nodeData.html), + violation + ); // eslint-disable-line no-console violationsHelper.push(violation); if (nodeData) { nodeElem = document.querySelector(nodeData.target.join(',')); - classNamesToAdd = isBackgroundReplacedElement(nodeElem) ? [VIOLATION_CLASS_MAP.REPLACED_ELEMENT] : violationClasses; + classNamesToAdd = isBackgroundReplacedElement(nodeElem) + ? [VIOLATION_CLASS_MAP.REPLACED_ELEMENT] + : violationClasses; nodeElem.classList.remove(...VIOLATION_CLASS_NAMES); @@ -197,11 +212,18 @@ export function initialize(appInstance) { } if (this.axeCallback) { - assert('axeCallback should be a function.', typeof this.axeCallback === 'function'); + assert( + 'axeCallback should be a function.', + typeof this.axeCallback === 'function' + ); this.axeCallback(results); } - scheduleOnce('afterRender', violationsHelper, violationsHelper.logTip); + scheduleOnce( + 'afterRender', + violationsHelper, + violationsHelper.logTip + ); }); } }, @@ -212,10 +234,12 @@ export function initialize(appInstance) { * @return {Void} */ _runAudit() { - if (this.turnAuditOff || Ember.testing) { return; } + if (this.turnAuditOff || Ember.testing) { + return; + } scheduleOnce('afterRender', this, 'audit'); - } + }, }); hasRan = true; @@ -224,5 +248,5 @@ export function initialize(appInstance) { export default { name: 'axe-component', after: 'violations-helper', - initialize + initialize, }; diff --git a/addon/instance-initializers/violations-helper.js b/addon/instance-initializers/violations-helper.js index f764c28d..343f56bb 100644 --- a/addon/instance-initializers/violations-helper.js +++ b/addon/instance-initializers/violations-helper.js @@ -7,5 +7,5 @@ export function initialize() { export default { name: 'violations-helper', before: 'axe-component', - initialize + initialize, }; diff --git a/addon/utils/concurrent-axe.js b/addon/utils/concurrent-axe.js index bfa15bb8..00000fa1 100644 --- a/addon/utils/concurrent-axe.js +++ b/addon/utils/concurrent-axe.js @@ -1,4 +1,3 @@ -/* global axe */ import { next } from '@ember/runloop'; export class ConcurrentAxe { @@ -9,7 +8,7 @@ export class ConcurrentAxe { /** * Axe v3 contains a concurrency issue which breaks the component auditing feature. - * This service defers axe.run calls on onto the next loop so that concurrent + * This service defers axe.run calls on onto the next loop so that concurrent * axe executions do not occur. * * @see(https://github.com/dequelabs/axe-core/issues/1041) diff --git a/addon/utils/format-violation.js b/addon/utils/format-violation.js index a83e8bd9..5406c899 100644 --- a/addon/utils/format-violation.js +++ b/addon/utils/format-violation.js @@ -1,15 +1,19 @@ /** * Formats the axe violation for human consumption - * + * * @param {AxeViolation} violation * @param {String} markup (optional) string of HTML relevant to the violation */ export default function formatViolation(violation, markup) { if (!violation) { - throw new Error('formatViolation called without required parameter: violation'); + throw new Error( + 'formatViolation called without required parameter: violation' + ); } if (!violation.impact || !violation.help || !violation.helpUrl) { - throw new Error('formatViolation called with improper structure of parameter: violation. Required properties: impact, help, helpUrl.'); + throw new Error( + 'formatViolation called with improper structure of parameter: violation. Required properties: impact, help, helpUrl.' + ); } let count = 1; @@ -24,7 +28,7 @@ export default function formatViolation(violation, markup) { markup = ''; } - let plural = (count === 1) ? '' : 's'; + let plural = count === 1 ? '' : 's'; let violationCount = `Violated ${count} time${plural}.`; return `[${violation.impact}]: ${violation.help} \n${violationCount}${markup}\n${violation.helpUrl}`; diff --git a/addon/utils/is-background-replaced-element.js b/addon/utils/is-background-replaced-element.js index 657b3c6b..b2ee4c97 100644 --- a/addon/utils/is-background-replaced-element.js +++ b/addon/utils/is-background-replaced-element.js @@ -1,22 +1,19 @@ /** * Tag names of replaced elements that axe might flag */ -const BG_REPLACED_ELEMENT_TAGS = [ - 'IMG', - 'VIDEO', - 'OBJECT', - 'AUDIO', - 'SOURCE' -]; +const BG_REPLACED_ELEMENT_TAGS = ['IMG', 'VIDEO', 'OBJECT', 'AUDIO', 'SOURCE']; -const BG_REPLACED_ELEMENT_TAG_PATTERN = new RegExp(BG_REPLACED_ELEMENT_TAGS.join('|'), 'i'); +const BG_REPLACED_ELEMENT_TAG_PATTERN = new RegExp( + BG_REPLACED_ELEMENT_TAGS.join('|'), + 'i' +); /** * Mapping of elements with specific "type" attributes that * might signal bg replaced */ const BG_REPLACED_ELEMENT_TYPE_PATTERNS = { - INPUT: new RegExp('range|radio', 'i') + INPUT: new RegExp('range|radio', 'i'), }; /** @@ -27,12 +24,10 @@ const BG_REPLACED_ELEMENT_TYPE_PATTERNS = { * @param element {HTMLElement} * @see: https://developer.mozilla.org/en-US/docs/Web/CSS/Replaced_element */ -export default function isBackgroundReplacedElement({tagName, type}) { +export default function isBackgroundReplacedElement({ tagName, type }) { return !!( BG_REPLACED_ELEMENT_TAG_PATTERN.test(tagName) || - ( - BG_REPLACED_ELEMENT_TYPE_PATTERNS[tagName] && - BG_REPLACED_ELEMENT_TYPE_PATTERNS[tagName].test(type) - ) + (BG_REPLACED_ELEMENT_TYPE_PATTERNS[tagName] && + BG_REPLACED_ELEMENT_TYPE_PATTERNS[tagName].test(type)) ); } diff --git a/addon/utils/violations-helper.js b/addon/utils/violations-helper.js index 2343fabe..4a14db51 100644 --- a/addon/utils/violations-helper.js +++ b/addon/utils/violations-helper.js @@ -36,7 +36,9 @@ export class ViolationsHelper { * @public * @type {Number} */ - get count() { return this.violations.length; } + get count() { + return this.violations.length; + } /** * Alias method to return the first violation @@ -44,7 +46,9 @@ export class ViolationsHelper { * @public * @type {Object} */ - get first() { return this.violations[0]; } + get first() { + return this.violations[0]; + } /** * Alias method to return the last violation @@ -52,7 +56,9 @@ export class ViolationsHelper { * @public * @type {Object} */ - get last() { return this.violations[this.count - 1]; } + get last() { + return this.violations[this.count - 1]; + } /** * Alias method to push a violation into the collection @@ -76,10 +82,12 @@ export class ViolationsHelper { * @return {Array} */ filterBy(key, value) { - if (key === "rule") { key = "id"; } + if (key === 'rule') { + key = 'id'; + } return this.violations.filter((violation) => { - if (key === "node") { + if (key === 'node') { return violation.nodes[0].target[0] === value; } return violation[key] === value; @@ -95,8 +103,12 @@ export class ViolationsHelper { logTip() { if (this.count && !this.hasLoggedTip) { /* eslint-disable no-console */ - console.info("You can inspect or filter your violations from the console with: window.violationsHelper"); - console.info("For a description of violationsHelper's API, see: https://github.com/ember-a11y/ember-a11y-testing/blob/master/addon/utils/violations-helper.js"); + console.info( + 'You can inspect or filter your violations from the console with: window.violationsHelper' + ); + console.info( + "For a description of violationsHelper's API, see: https://github.com/ember-a11y/ember-a11y-testing/blob/master/addon/utils/violations-helper.js" + ); /* eslint-enable no-console */ this.hasLoggedTip = true; } diff --git a/app/instance-initializers/axe-component.js b/app/instance-initializers/axe-component.js index ed1dc514..f7d67961 100644 --- a/app/instance-initializers/axe-component.js +++ b/app/instance-initializers/axe-component.js @@ -1 +1,4 @@ -export { default, initialize } from 'ember-a11y-testing/instance-initializers/axe-component'; +export { + default, + initialize, +} from 'ember-a11y-testing/instance-initializers/axe-component'; diff --git a/app/instance-initializers/violations-helper.js b/app/instance-initializers/violations-helper.js index e770b1d6..50cfdf66 100644 --- a/app/instance-initializers/violations-helper.js +++ b/app/instance-initializers/violations-helper.js @@ -1 +1,4 @@ -export { default, initialize } from 'ember-a11y-testing/instance-initializers/violations-helper'; +export { + default, + initialize, +} from 'ember-a11y-testing/instance-initializers/violations-helper'; diff --git a/config/ember-try.js b/config/ember-try.js index 7e078cb3..7f613153 100644 --- a/config/ember-try.js +++ b/config/ember-try.js @@ -2,67 +2,73 @@ const getChannelURL = require('ember-source-channel-url'); -module.exports = async function() { +module.exports = async function () { return { useYarn: true, scenarios: [ { name: 'ember-lts-3.4', env: { - EMBER_OPTIONAL_FEATURES: JSON.stringify({ 'jquery-integration': true }), + EMBER_OPTIONAL_FEATURES: JSON.stringify({ + 'jquery-integration': true, + }), }, npm: { devDependencies: { '@ember/jquery': '^0.5.1', - 'ember-source': '~3.4.0' - } - } + 'ember-source': '~3.4.0', + }, + }, }, { name: 'ember-lts-3.8', env: { - EMBER_OPTIONAL_FEATURES: JSON.stringify({ 'jquery-integration': true }), + EMBER_OPTIONAL_FEATURES: JSON.stringify({ + 'jquery-integration': true, + }), }, npm: { devDependencies: { - 'ember-source': '~3.8.0' - } - } + 'ember-source': '~3.8.0', + }, + }, }, { name: 'ember-lts-3.12', env: { - EMBER_OPTIONAL_FEATURES: JSON.stringify({ 'jquery-integration': true }), + EMBER_OPTIONAL_FEATURES: JSON.stringify({ + 'jquery-integration': true, + }), }, npm: { devDependencies: { - 'ember-source': '~3.12.0' - } - } + 'ember-source': '~3.12.0', + }, + }, }, { name: 'ember-release', npm: { devDependencies: { - 'ember-source': await getChannelURL('release') - } - } + 'ember-source': await getChannelURL('release'), + }, + }, }, { name: 'ember-beta', npm: { devDependencies: { - 'ember-source': await getChannelURL('beta') - } - } + 'ember-source': await getChannelURL('beta'), + }, + }, }, { name: 'ember-canary', npm: { devDependencies: { - 'ember-source': await getChannelURL('canary') - } - } + 'ember-source': await getChannelURL('canary'), + }, + }, }, // The default `.travis.yml` runs this scenario via `npm test`, // not via `ember try`. It's still included here so that running @@ -71,22 +77,22 @@ module.exports = async function() { { name: 'ember-default', npm: { - devDependencies: {} - } + devDependencies: {}, + }, }, { name: 'ember-default-with-jquery', env: { EMBER_OPTIONAL_FEATURES: JSON.stringify({ - 'jquery-integration': true - }) + 'jquery-integration': true, + }), }, npm: { devDependencies: { - '@ember/jquery': '^0.5.1' - } - } - } - ] + '@ember/jquery': '^0.5.1', + }, + }, + }, + ], }; }; diff --git a/config/environment.js b/config/environment.js index 0dfaed47..331ab30d 100644 --- a/config/environment.js +++ b/config/environment.js @@ -1,5 +1,5 @@ 'use strict'; -module.exports = function(/* environment, appConfig */) { - return { }; +module.exports = function (/* environment, appConfig */) { + return {}; }; diff --git a/config/release.js b/config/release.js index 46dd37d5..48160db3 100644 --- a/config/release.js +++ b/config/release.js @@ -4,7 +4,7 @@ // For details on each option run `ember help release` module.exports = { // local: true, - remote: 'upstream' + remote: 'upstream', // annotation: "Release %@", // message: "Bumped version to %@", // manifest: [ 'package.json', 'bower.json', 'someconfig.json' ], diff --git a/content-for/head-footer.html b/content-for/head-footer.html index ec27cde7..03447942 100644 --- a/content-for/head-footer.html +++ b/content-for/head-footer.html @@ -4,9 +4,9 @@ 135deg, transparent, transparent 10%, - hsla(0, 0%, 88%, 1.00) 10%, - hsla(0, 0%, 62%, 1.00) 15%, - hsla(0, 0%, 38%, 1.00) 20%, + hsla(0, 0%, 88%, 1) 10%, + hsla(0, 0%, 62%, 1) 15%, + hsla(0, 0%, 38%, 1) 20%, transparent 20%, transparent 35% ) !important; @@ -16,13 +16,14 @@ background-image: repeating-linear-gradient( 135deg, transparent, - transparent 25%, /* make transparent portion somewhat wider than total stripe width */ - hsla(60, 79%, 59%, 1.00) 25%, - hsla(60, 79%, 59%, 1.00) 30%, - hsla(166, 44%, 65%, 1.00) 30%, - hsla(166, 44%, 65%, 1.00) 35%, - hsla(240, 26%, 50%, 1.00) 35%, - hsla(240, 26%, 50%, 1.00) 40% + transparent 25%, + /* make transparent portion somewhat wider than total stripe width */ + hsla(60, 79%, 59%, 1) 25%, + hsla(60, 79%, 59%, 1) 30%, + hsla(166, 44%, 65%, 1) 30%, + hsla(166, 44%, 65%, 1) 35%, + hsla(240, 26%, 50%, 1) 35%, + hsla(240, 26%, 50%, 1) 40% ) !important; } @@ -31,24 +32,20 @@ 135deg, transparent, transparent 0.5em, - hsla(60, 79%, 59%, 1.00) 0.5em, - hsla(60, 79%, 59%, 1.00) 1em, - hsla(240, 26%, 50%, 1.00) 1em, - hsla(240, 26%, 50%, 1.00) 1.5em + hsla(60, 79%, 59%, 1) 0.5em, + hsla(60, 79%, 59%, 1) 1em, + hsla(240, 26%, 50%, 1) 1em, + hsla(240, 26%, 50%, 1) 1.5em ) !important; } .axe-violation--replaced-element:not(:focus):not(:hover) { - box-shadow: - 0 0 0em 0.35em hsla(240, 26%, 50%, 1.00) inset, - 0 0 0em 0.35em hsla(60, 79%, 59%, 1.00), - 0 0 0em 0.70em hsla(240, 26%, 50%, 1.00) !important; + box-shadow: 0 0 0em 0.35em hsla(240, 26%, 50%, 1) inset, + 0 0 0em 0.35em hsla(60, 79%, 59%, 1), 0 0 0em 0.7em hsla(240, 26%, 50%, 1) !important; /* Scale down slightly so box shadow is visible */ transition-duration: 0.3s !important; transition-timing-function: ease-in-out !important; transform: scale(0.9) !important; } - - diff --git a/ember-cli-build.js b/ember-cli-build.js index dc5a39e1..ba0649dc 100644 --- a/ember-cli-build.js +++ b/ember-cli-build.js @@ -2,7 +2,7 @@ const EmberAddon = require('ember-cli/lib/broccoli/ember-addon'); -module.exports = function(defaults) { +module.exports = function (defaults) { let app = new EmberAddon(defaults, { // Add options here }); diff --git a/index.js b/index.js index 6e55ed64..a7ce46e3 100644 --- a/index.js +++ b/index.js @@ -6,10 +6,7 @@ var Funnel = require('broccoli-funnel'); var VersionChecker = require('ember-cli-version-checker'); // The different types/area for which we have content for. -var ALLOWED_CONTENT_FOR = [ - 'head-footer', - 'test-head-footer' -]; +var ALLOWED_CONTENT_FOR = ['head-footer', 'test-head-footer']; module.exports = { name: require('./package').name, @@ -19,24 +16,28 @@ module.exports = { * version in case of a need to debug. * @override */ - included: function(app) { + included: function (app) { var config = this.project.config(); - var options = (config[this.name] && config[this.name].componentOptions) || {}; + var options = + (config[this.name] && config[this.name].componentOptions) || {}; var isComponentAuditOff = options.turnAuditOff || false; var shouldExcludeAxeCore = isComponentAuditOff && options.excludeAxeCore; this._super.included.apply(this, arguments); if (app.tests) { - app.import('vendor/axe-core/axe.js', shouldExcludeAxeCore ? { type: 'test' } : undefined); + app.import( + 'vendor/axe-core/axe.js', + shouldExcludeAxeCore ? { type: 'test' } : undefined + ); } }, - treeForVendor: function() { + treeForVendor: function () { var axePath = path.dirname(require.resolve('axe-core')); return new Funnel(axePath, { files: ['axe.js'], - destDir: 'axe-core' + destDir: 'axe-core', }); }, @@ -45,9 +46,14 @@ module.exports = { * contents of the files with the same name to the content-for block. * @override */ - contentFor: function(type) { - if (process.env.EMBER_ENV !== 'production' && ~ALLOWED_CONTENT_FOR.indexOf(type)) { - return fs.readFileSync(path.join(__dirname, 'content-for', type + '.html')); + contentFor: function (type) { + if ( + process.env.EMBER_ENV !== 'production' && + ~ALLOWED_CONTENT_FOR.indexOf(type) + ) { + return fs.readFileSync( + path.join(__dirname, 'content-for', type + '.html') + ); } }, @@ -56,14 +62,16 @@ module.exports = { * production build or if the version of Ember being used is less than 1.13. * @override */ - treeForApp: function(tree) { + treeForApp: function (tree) { var checker = new VersionChecker(this); var isProductionBuild = process.env.EMBER_ENV === 'production'; var isOldEmber = checker.for('ember-source').lt('1.13.0'); if (isProductionBuild || isOldEmber) { tree = new Funnel(tree, { - exclude: [/instance-initializers\/(axe-component|violations-helper)\.js/] + exclude: [ + /instance-initializers\/(axe-component|violations-helper)\.js/, + ], }); } @@ -75,7 +83,7 @@ module.exports = { * production build or if the version of Ember being used is less than 1.13. * @override */ - treeForAddon: function() { + treeForAddon: function () { var tree = this._super.treeForAddon.apply(this, arguments); var checker = new VersionChecker(this); var isProductionBuild = process.env.EMBER_ENV === 'production'; @@ -85,12 +93,11 @@ module.exports = { tree = new Funnel(tree, { exclude: [ /instance-initializers\/(axe-component|violations-helper)\.js/, - /utils\/(concurrent-axe|format-violation|is-background-replaced-element|violations-helper)\.js/ - ] + /utils\/(concurrent-axe|format-violation|is-background-replaced-element|violations-helper)\.js/, + ], }); } return tree; - } - + }, }; diff --git a/package.json b/package.json index a13ce094..9f47a1e0 100644 --- a/package.json +++ b/package.json @@ -79,7 +79,7 @@ "release-it": "^13.6.5", "release-it-lerna-changelog": "^2.3.0", "sass": "^1.26.10", - "typescript": "^4.0.2" + "typescript": "^3.9.7" }, "engines": { "node": "10.* || >= 12" diff --git a/renovate.json b/renovate.json index 705eb33b..8f37b5e2 100644 --- a/renovate.json +++ b/renovate.json @@ -1,18 +1,15 @@ { - "extends": [ - "config:base", + "extends": ["config:base", "schedule:nonOfficeHours"], ":preserveSemverRanges", - "schedule:nonOfficeHours" - ], "prConcurrentLimit": 5, "packageRules": [ { - "packagePatterns": [ "eslint" ], + "packagePatterns": ["eslint"], "groupName": "eslint", "rangeStrategy": "replace" }, { - "packagePatterns": [ "sass" ], + "packagePatterns": ["sass"], "groupName": "sass", "rangeStrategy": "replace" }, diff --git a/testem.js b/testem.js index 367f5659..4d4cfe72 100644 --- a/testem.js +++ b/testem.js @@ -1,12 +1,8 @@ module.exports = { test_page: 'tests/index.html?hidepassed', disable_watching: true, - launch_in_ci: [ - 'Chrome' - ], - launch_in_dev: [ - 'Chrome' - ], + launch_in_ci: ['Chrome'], + launch_in_dev: ['Chrome'], browser_args: { Chrome: { ci: [ @@ -17,8 +13,8 @@ module.exports = { '--disable-software-rasterizer', '--mute-audio', '--remote-debugging-port=0', - '--window-size=1440,900' - ].filter(Boolean) - } - } + '--window-size=1440,900', + ].filter(Boolean), + }, + }, }; diff --git a/tests/acceptance/a11y-audit-test.js b/tests/acceptance/a11y-audit-test.js index 4599d697..1fdb16c0 100644 --- a/tests/acceptance/a11y-audit-test.js +++ b/tests/acceptance/a11y-audit-test.js @@ -5,13 +5,13 @@ import a11yAudit from 'ember-a11y-testing/test-support/audit'; const SELECTORS = { passingComponent: '[data-test-selector="violations-page__passing-component"]', - failingComponent: '[data-test-selector="empty-button"]' + failingComponent: '[data-test-selector="empty-button"]', }; -module('Acceptance | a11y audit', function(hooks) { +module('Acceptance | a11y audit', function (hooks) { setupApplicationTest(hooks); - test('a11yAudit should catch violations as an async helper', async function(assert) { + test('a11yAudit should catch violations as an async helper', async function (assert) { assert.expect(1); await visit('/'); @@ -20,12 +20,14 @@ module('Acceptance | a11y audit', function(hooks) { await a11yAudit(); assert.ok(false, 'a11yAudit should have thrown an error on violations'); } catch (error) { - let foundExpectedError = error.message.startsWith('Assertion Failed: The page should have no accessibility violations. Violations:') + let foundExpectedError = error.message.startsWith( + 'Assertion Failed: The page should have no accessibility violations. Violations:' + ); assert.ok(foundExpectedError, 'error message is correct'); } }); - test('a11yAudit should properly scope to a specified string context selector', async function(assert) { + test('a11yAudit should properly scope to a specified string context selector', async function (assert) { assert.expect(2); await visit('/'); @@ -41,30 +43,32 @@ module('Acceptance | a11y audit', function(hooks) { await a11yAudit(SELECTORS.failingComponent); assert.ok(false, 'a11yAudit should have thrown an error on violations'); } catch (error) { - let foundExpectedError = error.message.startsWith('Assertion Failed: The page should have no accessibility violations. Violations:'); + let foundExpectedError = error.message.startsWith( + 'Assertion Failed: The page should have no accessibility violations. Violations:' + ); assert.ok(foundExpectedError, 'error message is correct'); } }); - test('a11yAudit should properly scope to a specified jquery context (not recommended)', async function(assert) { + test('a11yAudit should properly scope to a specified jquery context (not recommended)', async function (assert) { await visit('/'); await a11yAudit(SELECTORS.passingComponent); assert.ok(true, 'a11yAudit should not have discovered any issues'); }); - test('a11yAudit should properly scope to a specified html element context (not recommended)', async function(assert) { + test('a11yAudit should properly scope to a specified html element context (not recommended)', async function (assert) { await visit('/'); await a11yAudit(SELECTORS.passingComponent); assert.ok(true, 'a11yAudit should not have discovered any issues'); }); - test('a11yAudit accounts for axe.run include and exclude context parameter', async function(assert) { + test('a11yAudit accounts for axe.run include and exclude context parameter', async function (assert) { await visit('/'); await a11yAudit({ - include: [[SELECTORS.passingComponent]] + include: [[SELECTORS.passingComponent]], }); await a11yAudit({ @@ -75,41 +79,41 @@ module('Acceptance | a11y audit', function(hooks) { ['[data-test-selector="paragraph-with-blink-tag"]'], ['[data-test-selector="ungrouped-radio-inputs"]'], ['[data-test-selector="noise-level-selection"]'], - ['[data-test-selector="poor-text-contrast"]'] - ] + ['[data-test-selector="poor-text-contrast"]'], + ], }); assert.ok(true, 'no errors should have been found in a11yAudit'); }); - test('a11yAudit can accept an options hash in addition to context', async function(assert) { + test('a11yAudit can accept an options hash in addition to context', async function (assert) { await visit('/'); await a11yAudit(SELECTORS.failingComponent, { rules: { 'button-name': { - enabled: false - } - } + enabled: false, + }, + }, }); assert.ok(true, 'no errors should have been found in a11yAudit'); }); - test('a11yAudit can accept an options hash as a single argument', async function(assert) { + test('a11yAudit can accept an options hash as a single argument', async function (assert) { await visit('/'); await a11yAudit({ runOnly: { - type: "rule", - values: ["accesskeys"] - } + type: 'rule', + values: ['accesskeys'], + }, }); assert.ok(true, 'no errors should have been found in a11yAudit'); }); - test('a11yAudit loads default config if none specified', async function(assert) { + test('a11yAudit loads default config if none specified', async function (assert) { await visit('/ignored-image-alt'); // There is an error with img alt tag, but it's ignored in global config diff --git a/tests/acceptance/violations-test.js b/tests/acceptance/violations-test.js index 6a98d07c..928f5ffe 100644 --- a/tests/acceptance/violations-test.js +++ b/tests/acceptance/violations-test.js @@ -3,14 +3,17 @@ import { visit } from '@ember/test-helpers'; import { setupApplicationTest } from 'ember-qunit'; import violationsHelper from 'ember-a11y-testing/utils/violations-helper'; -module('Acceptance | temp test', function(hooks) { +module('Acceptance | temp test', function (hooks) { setupApplicationTest(hooks); - test('violationsHelper set in the global scope', async function(assert) { + test('violationsHelper set in the global scope', async function (assert) { await visit('/'); // This number will vary over time as the document updates and the axe-core // library changes, therefore we only care that it is finding violations - assert.ok(violationsHelper.count > 0, 'Violations are found in the violationsHelper'); + assert.ok( + violationsHelper.count > 0, + 'Violations are found in the violationsHelper' + ); }); }); diff --git a/tests/dummy/app/app.js b/tests/dummy/app/app.js index b3b2bd67..f08aaaf0 100644 --- a/tests/dummy/app/app.js +++ b/tests/dummy/app/app.js @@ -6,7 +6,7 @@ import config from './config/environment'; const App = Application.extend({ modulePrefix: config.modulePrefix, podModulePrefix: config.podModulePrefix, - Resolver + Resolver, }); loadInitializers(App, config.modulePrefix); diff --git a/tests/dummy/app/components/_base-demo-component.js b/tests/dummy/app/components/_base-demo-component.js index 158e284b..6f494ca4 100644 --- a/tests/dummy/app/components/_base-demo-component.js +++ b/tests/dummy/app/components/_base-demo-component.js @@ -1,5 +1,5 @@ import Component from '@ember/component'; export default Component.extend({ - attributeBindings: ['data-test-selector'] + attributeBindings: ['data-test-selector'], }); diff --git a/tests/dummy/app/components/axe-component.js b/tests/dummy/app/components/axe-component.js index 092f99ba..3f151d1b 100644 --- a/tests/dummy/app/components/axe-component.js +++ b/tests/dummy/app/components/axe-component.js @@ -1,5 +1,4 @@ import Component from '@ember/component'; // base component for testing -export default Component.extend({ -}); +export default Component.extend({}); diff --git a/tests/dummy/app/components/empty-button.js b/tests/dummy/app/components/empty-button.js index d2070d07..1f2516d8 100644 --- a/tests/dummy/app/components/empty-button.js +++ b/tests/dummy/app/components/empty-button.js @@ -2,5 +2,5 @@ import BaseDemoComponent from './_base-demo-component'; export default BaseDemoComponent.extend({ classNames: ['button'], - tagName: 'button' + tagName: 'button', }); diff --git a/tests/dummy/app/components/page-title.js b/tests/dummy/app/components/page-title.js index a9811f96..c9af70fa 100644 --- a/tests/dummy/app/components/page-title.js +++ b/tests/dummy/app/components/page-title.js @@ -17,5 +17,5 @@ export default Component.extend({ if (Ember.testing) { this.set('title', 'Clicked during tests'); } - } + }, }); diff --git a/tests/dummy/app/components/passing-component.js b/tests/dummy/app/components/passing-component.js index 97ee97a6..4b9f79d8 100644 --- a/tests/dummy/app/components/passing-component.js +++ b/tests/dummy/app/components/passing-component.js @@ -1,10 +1,9 @@ import Component from '@ember/component'; - export default Component.extend({ actions: { toggle() { this.set('isFailing', true); - } - } + }, + }, }); diff --git a/tests/dummy/app/components/violations-grid-item.js b/tests/dummy/app/components/violations-grid-item.js index c65e0dbc..446c29ed 100644 --- a/tests/dummy/app/components/violations-grid-item.js +++ b/tests/dummy/app/components/violations-grid-item.js @@ -1,11 +1,10 @@ import Component from '@ember/component'; import layout from '../templates/components/violations-grid-item'; - export default Component.extend({ layout, tagName: 'li', classNames: ['c-violations-grid-item', 'o-content-box'], - title: null + title: null, }); diff --git a/tests/dummy/app/components/x-button.js b/tests/dummy/app/components/x-button.js index a979a32d..9870bef4 100644 --- a/tests/dummy/app/components/x-button.js +++ b/tests/dummy/app/components/x-button.js @@ -1,7 +1,6 @@ import Component from '@ember/component'; - export default Component.extend({ classNames: ['c-button'], - tagName: 'button' + tagName: 'button', }); diff --git a/tests/dummy/app/components/x-div.js b/tests/dummy/app/components/x-div.js index 11020bbc..9ae38624 100644 --- a/tests/dummy/app/components/x-div.js +++ b/tests/dummy/app/components/x-div.js @@ -8,5 +8,5 @@ import layout from '../templates/components/x-div'; */ export default Component.extend({ layout, - tagName: 'div' + tagName: 'div', }); diff --git a/tests/dummy/app/components/x-image.js b/tests/dummy/app/components/x-image.js index 5050b0f7..8a9ffd60 100644 --- a/tests/dummy/app/components/x-image.js +++ b/tests/dummy/app/components/x-image.js @@ -1,7 +1,6 @@ import Component from '@ember/component'; import layout from '../templates/components/x-image'; - export default Component.extend({ layout, tagName: 'img', @@ -17,5 +16,5 @@ export default Component.extend({ src: null, srcset: null, - sizes: null + sizes: null, }); diff --git a/tests/dummy/app/components/x-paragraph.js b/tests/dummy/app/components/x-paragraph.js index 3a2b0cc4..04969a56 100644 --- a/tests/dummy/app/components/x-paragraph.js +++ b/tests/dummy/app/components/x-paragraph.js @@ -4,5 +4,5 @@ import layout from '../templates/components/x-paragraph'; export default Component.extend({ layout, tagName: 'p', - classNames: ['c-paragraph'] + classNames: ['c-paragraph'], }); diff --git a/tests/dummy/app/components/x-text-input.js b/tests/dummy/app/components/x-text-input.js index c0980ff5..17609ff8 100644 --- a/tests/dummy/app/components/x-text-input.js +++ b/tests/dummy/app/components/x-text-input.js @@ -1,6 +1,5 @@ import Component from '@ember/component'; - export default Component.extend({ - classNames: ['c-text-input'] + classNames: ['c-text-input'], }); diff --git a/tests/dummy/app/index.html b/tests/dummy/app/index.html index b29a4a0d..ed06f4f3 100644 --- a/tests/dummy/app/index.html +++ b/tests/dummy/app/index.html @@ -1,16 +1,16 @@ - - + + Dummy - - + + {{content-for "head"}} - - + + {{content-for "head-footer"}} diff --git a/tests/dummy/app/initializers/component-data-attributes.js b/tests/dummy/app/initializers/component-data-attributes.js index 3e59ba3e..7d654074 100644 --- a/tests/dummy/app/initializers/component-data-attributes.js +++ b/tests/dummy/app/initializers/component-data-attributes.js @@ -2,11 +2,11 @@ import Component from '@ember/component'; export function initialize(/* application */) { Component.reopen({ - attributeBindings: ['data-test-selector'] + attributeBindings: ['data-test-selector'], }); } export default { name: 'component-data-attributes', - initialize + initialize, }; diff --git a/tests/dummy/app/router.js b/tests/dummy/app/router.js index 9030b899..0a37675f 100644 --- a/tests/dummy/app/router.js +++ b/tests/dummy/app/router.js @@ -3,10 +3,10 @@ import config from './config/environment'; const Router = EmberRouter.extend({ location: config.locationType, - rootURL: config.rootURL + rootURL: config.rootURL, }); -Router.map(function() { +Router.map(function () { this.route('violations', { path: '/' }); this.route('ignored-image-alt'); }); diff --git a/tests/dummy/app/routes/ignored-image-alt.js b/tests/dummy/app/routes/ignored-image-alt.js index 6c74252a..d09f667b 100644 --- a/tests/dummy/app/routes/ignored-image-alt.js +++ b/tests/dummy/app/routes/ignored-image-alt.js @@ -1,4 +1,3 @@ import Route from '@ember/routing/route'; -export default Route.extend({ -}); +export default Route.extend({}); diff --git a/tests/dummy/app/routes/index.js b/tests/dummy/app/routes/index.js index 6c74252a..d09f667b 100644 --- a/tests/dummy/app/routes/index.js +++ b/tests/dummy/app/routes/index.js @@ -1,4 +1,3 @@ import Route from '@ember/routing/route'; -export default Route.extend({ -}); +export default Route.extend({}); diff --git a/tests/dummy/app/routes/violations.js b/tests/dummy/app/routes/violations.js index 52da9eb5..9467423b 100644 --- a/tests/dummy/app/routes/violations.js +++ b/tests/dummy/app/routes/violations.js @@ -1,12 +1,11 @@ import Route from '@ember/routing/route'; import { set } from '@ember/object'; - export default Route.extend({ model() { return { currentNoiseLevel: 1, - currentFruit: 'Strawberrries' + currentFruit: 'Strawberrries', }; }, @@ -17,11 +16,15 @@ export default Route.extend({ * the exisiting classes set so that axe will perfom its check without our styles * having influenced the results */ - document.querySelectorAll('[class*="axe-violation--"]').forEach(elem => { - elem.classList.remove(...[elem.className.match(/axe-violation--[^\s]*/g)]); - }); + document + .querySelectorAll('[class*="axe-violation--"]') + .forEach((elem) => { + elem.classList.remove( + ...[elem.className.match(/axe-violation--[^\s]*/g)] + ); + }); set(this.currentModel, 'currentNoiseLevel', level); - } - } + }, + }, }); diff --git a/tests/dummy/app/styles/app.scss b/tests/dummy/app/styles/app.scss index 79a6952b..c0ad825b 100644 --- a/tests/dummy/app/styles/app.scss +++ b/tests/dummy/app/styles/app.scss @@ -1,10 +1,10 @@ -@import "variables/variables"; +@import 'variables/variables'; -@import "components/components"; -@import "object-patterns/object-patterns"; -@import "pages/pages"; -@import "typography/typography"; -@import "utilities/utilities"; +@import 'components/components'; +@import 'object-patterns/object-patterns'; +@import 'pages/pages'; +@import 'typography/typography'; +@import 'utilities/utilities'; html { font-size: 100%; @@ -25,7 +25,6 @@ ul { padding: 0; } - .application { position: relative; width: 100%; @@ -41,6 +40,4 @@ ul { .application__main-content { min-width: $min-width__main-content; } - - } diff --git a/tests/dummy/app/styles/components/_components.scss b/tests/dummy/app/styles/components/_components.scss index 107686c5..9b2ddd8d 100644 --- a/tests/dummy/app/styles/components/_components.scss +++ b/tests/dummy/app/styles/components/_components.scss @@ -1,5 +1,5 @@ -@import "button"; -@import "image"; -@import "menu-link-item"; -@import "radio-track"; -@import "violations-grid-item"; +@import 'button'; +@import 'image'; +@import 'menu-link-item'; +@import 'radio-track'; +@import 'violations-grid-item'; diff --git a/tests/dummy/app/styles/components/_radio-track.scss b/tests/dummy/app/styles/components/_radio-track.scss index efc5b2a7..e0c1e57a 100644 --- a/tests/dummy/app/styles/components/_radio-track.scss +++ b/tests/dummy/app/styles/components/_radio-track.scss @@ -1,16 +1,26 @@ $height__radio-selector-track-container: 4rem; -$height__radio-selector-track-circle: $height__radio-selector-track-container * 0.5; -$offset__title-below-circle: 0.40em; +$height__radio-selector-track-circle: $height__radio-selector-track-container * + 0.5; +$offset__title-below-circle: 0.4em; $color__circle--primary: $theme-color__primary-1--700; $color__circle--accent: $theme-color__primary-1--100; $color__label--checked: $theme-color__primary-1--300; -$color__track: hsla(0, 0%, 59%, 1.00); +$color__track: hsla(0, 0%, 59%, 1); $color__track-heading: $theme-color__primary-1--700; - -$animation-easing__to-checked: cubic-bezier(0.00, 0.300, 0.00, 1.480); /* ease-out-cubic with 8% bounce */ -$animation-easing__to-unchecked: cubic-bezier(0.470, 0.000, 0.745, 0.715); /* ease-in-sine */ +$animation-easing__to-checked: cubic-bezier( + 0, + 0.3, + 0, + 1.48 +); /* ease-out-cubic with 8% bounce */ +$animation-easing__to-unchecked: cubic-bezier( + 0.47, + 0, + 0.745, + 0.715 +); /* ease-in-sine */ $animation-duration__circle-toggle: 0.37s; .c-radio-track { @@ -42,7 +52,6 @@ $animation-duration__circle-toggle: 0.37s; display: flex; align-items: center; justify-content: space-around; - } /** @@ -87,16 +96,16 @@ $animation-duration__circle-toggle: 0.37s; //pointer-events: none; /* Have the pointer-events handled by the ::before element */ /* Push the title down below the psuedo-elements */ - top: calc(#{$offset__title-below-circle} + #{$height__radio-selector-track-circle}); + top: calc( + #{$offset__title-below-circle} + #{$height__radio-selector-track-circle} + ); transition-property: color; } .c-radio-track__item-pointer { position: absolute; color: $color__label--checked; - margin-top: calc( - -1 * ( #{$height__radio-selector-track-circle / 2} + 1.5em ) - ); + margin-top: calc(-1 * (#{$height__radio-selector-track-circle / 2} + 1.5em)); } .c-radio-track__item-pointer::after { @@ -119,7 +128,9 @@ $animation-duration__circle-toggle: 0.37s; width: $height__radio-selector-track-circle; height: $height__radio-selector-track-circle; border-radius: 50%; - margin-top: calc(-1 * #{$height__radio-selector-track-circle} - #{$offset__title-below-circle}); + margin-top: calc( + -1 * #{$height__radio-selector-track-circle} - #{$offset__title-below-circle} + ); } /** @@ -141,13 +152,15 @@ $animation-duration__circle-toggle: 0.37s; opacity: 0; transform: scale(0); cursor: default; - background-image: radial-gradient(circle, $color__circle--primary 0%, $color__circle--primary); - box-shadow: - 0 0 0 0.25em $color__circle--accent, + background-image: radial-gradient( + circle, + $color__circle--primary 0%, + $color__circle--primary + ); + box-shadow: 0 0 0 0.25em $color__circle--accent, 0 0 0 0.5em $color__circle--primary; } - /* --------------------- Animations & event handling ----------------- */ .c-radio-track__item-pointer::after, .c-radio-track__item-node::after, @@ -184,6 +197,7 @@ $animation-duration__circle-toggle: 0.37s; /** * Hovering over circle when it's not focused or checked */ -.c-radio-track__item-input:hover:not(:focus):not(:checked) + .c-radio-track__item-node::before { +.c-radio-track__item-input:hover:not(:focus):not(:checked) + + .c-radio-track__item-node::before { background-color: $theme-color__primary-1--500; } diff --git a/tests/dummy/app/styles/components/_violations-grid-item.scss b/tests/dummy/app/styles/components/_violations-grid-item.scss index 1c2ddbb0..ab8a919b 100644 --- a/tests/dummy/app/styles/components/_violations-grid-item.scss +++ b/tests/dummy/app/styles/components/_violations-grid-item.scss @@ -1,5 +1,4 @@ .c-violations-grid-item { - box-shadow: $box-shadow__card; .c-violations-grid-item__header { @@ -26,5 +25,4 @@ //border-bottom: 1px solid; margin-bottom: 2em; } - } diff --git a/tests/dummy/app/styles/object-patterns/_object-patterns.scss b/tests/dummy/app/styles/object-patterns/_object-patterns.scss index 2d485470..4a1c73ac 100644 --- a/tests/dummy/app/styles/object-patterns/_object-patterns.scss +++ b/tests/dummy/app/styles/object-patterns/_object-patterns.scss @@ -4,5 +4,5 @@ * @see: https://www.google.com/search?q=object+orieinted+css&oq=object+orieinted+css&aqs=chrome..69i57j0l5.3247j0j7&sourceid=chrome&ie=UTF-8 */ -@import "content-box"; -@import "menu-link"; +@import 'content-box'; +@import 'menu-link'; diff --git a/tests/dummy/app/styles/pages/_pages.scss b/tests/dummy/app/styles/pages/_pages.scss index 1e1f09a4..138bc9e3 100644 --- a/tests/dummy/app/styles/pages/_pages.scss +++ b/tests/dummy/app/styles/pages/_pages.scss @@ -1 +1 @@ -@import "violations"; +@import 'violations'; diff --git a/tests/dummy/app/styles/pages/_violations.scss b/tests/dummy/app/styles/pages/_violations.scss index 83e62da9..22f9f5c7 100644 --- a/tests/dummy/app/styles/pages/_violations.scss +++ b/tests/dummy/app/styles/pages/_violations.scss @@ -3,7 +3,6 @@ $height__grid-item: $width__grid-item * 0.55; $margin__grid-item--vertical: 0.5em; $margin__grid-item--horizontal: 0.75em; - .p-violations__header, .p-violations__noise-selectors, .p-violations__body { @@ -47,8 +46,6 @@ $margin__grid-item--horizontal: 0.75em; } } - - .p-violations__grid-item-content--low-contrast-text { color: yellow; } diff --git a/tests/dummy/app/styles/typography/_fonts.scss b/tests/dummy/app/styles/typography/_fonts.scss index dad3fa5b..ac4b4f0a 100644 --- a/tests/dummy/app/styles/typography/_fonts.scss +++ b/tests/dummy/app/styles/typography/_fonts.scss @@ -4,18 +4,7 @@ */ html { - font-family: - -apple-system, - BlinkMacSystemFont, - 'Segoe UI', - Roboto, - 'Oxygen', - 'Ubuntu', - 'Cantarell', - 'Fira Sans', - 'Droid Sans', - Avenir, - Geneva, - Tahoma, + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Oxygen', + 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', Avenir, Geneva, Tahoma, san-serif; } diff --git a/tests/dummy/app/styles/typography/_headings.scss b/tests/dummy/app/styles/typography/_headings.scss index 9a825689..909f34ae 100644 --- a/tests/dummy/app/styles/typography/_headings.scss +++ b/tests/dummy/app/styles/typography/_headings.scss @@ -1,4 +1,9 @@ -h1, h2, h3, h4, h5, h6 { +h1, +h2, +h3, +h4, +h5, +h6 { margin: 0; color: $theme-color__primary-1--500; line-height: 2.25; diff --git a/tests/dummy/app/styles/typography/_typography.scss b/tests/dummy/app/styles/typography/_typography.scss index a82204b0..0c8f1753 100644 --- a/tests/dummy/app/styles/typography/_typography.scss +++ b/tests/dummy/app/styles/typography/_typography.scss @@ -1,2 +1,2 @@ -@import "fonts"; -@import "headings"; +@import 'fonts'; +@import 'headings'; diff --git a/tests/dummy/app/styles/utilities/_utilities.scss b/tests/dummy/app/styles/utilities/_utilities.scss index 239a8ff2..08efc572 100644 --- a/tests/dummy/app/styles/utilities/_utilities.scss +++ b/tests/dummy/app/styles/utilities/_utilities.scss @@ -1,13 +1,25 @@ -.u-relative { position: relative; } -.u-fill-height { height: 100%; } -.u-fill-width { width: 100%; } +.u-relative { + position: relative; +} +.u-fill-height { + height: 100%; +} +.u-fill-width { + width: 100%; +} .u-fill { height: 100%; width: 100%; } -.u-align-center { text-align: center; } +.u-align-center { + text-align: center; +} -.u-margin-auto { margin: auto; } -.u-block { display: block; } +.u-margin-auto { + margin: auto; +} +.u-block { + display: block; +} diff --git a/tests/dummy/app/styles/variables/_variables.scss b/tests/dummy/app/styles/variables/_variables.scss index 3bd0aef3..1cf4afaa 100644 --- a/tests/dummy/app/styles/variables/_variables.scss +++ b/tests/dummy/app/styles/variables/_variables.scss @@ -3,18 +3,19 @@ * COLORS * ----------------------------------------- */ -$theme-color__primary-1--100: hsla(251, 72%, 81%, 1.00); -$theme-color__primary-1--300: hsla(261, 43%, 55%, 1.00); -$theme-color__primary-1--500: hsla(261, 43%, 45%, 1.00); -$theme-color__primary-1--700: hsla(251, 42%, 31%, 1.00); -$theme-color__primary-1--900: hsla(256, 22%, 10%, 1.00); +$theme-color__primary-1--100: hsla(251, 72%, 81%, 1); +$theme-color__primary-1--300: hsla(261, 43%, 55%, 1); +$theme-color__primary-1--500: hsla(261, 43%, 45%, 1); +$theme-color__primary-1--700: hsla(251, 42%, 31%, 1); +$theme-color__primary-1--900: hsla(256, 22%, 10%, 1); -$theme-color__nearWhite: hsla(0, 0%, 98%, 1.00); -$theme-color__offWhite: hsla(0, 0%, 91%, 1.00); +$theme-color__nearWhite: hsla(0, 0%, 98%, 1); +$theme-color__offWhite: hsla(0, 0%, 91%, 1); $color__box-shadow: hsla(0, 0%, 0%, 0.43); -$box-shadow__card: 0 3px 12px rgba(0,0,0,0.23), 0 3px 12px rgba(0,0,0,0.16); +$box-shadow__card: 0 3px 12px rgba(0, 0, 0, 0.23), + 0 3px 12px rgba(0, 0, 0, 0.16); /** * ----------------------------------------- @@ -23,10 +24,8 @@ $box-shadow__card: 0 3px 12px rgba(0,0,0,0.23), 0 3px 12px rgba(0,0,0,0.16); */ $duration__fade-toggle: 0.25s; -$easing__ease-in-quad: cubic-bezier(0.550, 0.085, 0.680, 0.530); -$easing__ease-out-cubic: cubic-bezier(0.215, 0.610, 0.355, 1.000); - - +$easing__ease-in-quad: cubic-bezier(0.55, 0.085, 0.68, 0.53); +$easing__ease-out-cubic: cubic-bezier(0.215, 0.61, 0.355, 1); /** * ----------------------------------------- @@ -38,7 +37,7 @@ $easing__ease-out-cubic: cubic-bezier(0.215, 0.610, 0.355, 1.000); * 180:130 padding ratio to align content aspect ratio with human FOV */ $padding__content-box: 0.75em 1.05em; -$padding__content-box--lg: 1.5em 2.10em; +$padding__content-box--lg: 1.5em 2.1em; /* This could be a breakpoint in, you know, a real app 😜 */ $min-width__main-content: 40rem; diff --git a/tests/dummy/config/environment.js b/tests/dummy/config/environment.js index d35a82fb..707e6d0e 100644 --- a/tests/dummy/config/environment.js +++ b/tests/dummy/config/environment.js @@ -1,6 +1,6 @@ 'use strict'; -module.exports = function(environment) { +module.exports = function (environment) { let ENV = { modulePrefix: 'dummy', environment, @@ -13,8 +13,8 @@ module.exports = function(environment) { }, EXTEND_PROTOTYPES: { // Prevent Ember Data from overriding Date.parse. - Date: false - } + Date: false, + }, }, APP: { @@ -28,11 +28,11 @@ module.exports = function(environment) { rules: { // Disabled to test whether the config is // properly loaded in test environment - 'image-alt': { enabled: false } - } - } - } - } + 'image-alt': { enabled: false }, + }, + }, + }, + }, }; if (environment === 'development') { diff --git a/tests/dummy/config/targets.js b/tests/dummy/config/targets.js index 8ffae363..cc553928 100644 --- a/tests/dummy/config/targets.js +++ b/tests/dummy/config/targets.js @@ -3,7 +3,7 @@ const browsers = [ 'last 1 Chrome versions', 'last 1 Firefox versions', - 'last 1 Safari versions' + 'last 1 Safari versions', ]; const isCI = !!process.env.CI; @@ -14,5 +14,5 @@ if (isCI || isProduction) { } module.exports = { - browsers + browsers, }; diff --git a/tests/index.html b/tests/index.html index 5209b852..df218888 100644 --- a/tests/index.html +++ b/tests/index.html @@ -1,25 +1,22 @@ - - + + Dummy Tests - - + + - {{content-for "head"}} - {{content-for "test-head"}} + {{content-for "head"}} {{content-for "test-head"}} - - - + + + - {{content-for "head-footer"}} - {{content-for "test-head-footer"}} + {{content-for "head-footer"}} {{content-for "test-head-footer"}} - {{content-for "body"}} - {{content-for "test-body"}} + {{content-for "body"}} {{content-for "test-body"}} @@ -27,7 +24,6 @@ - {{content-for "body-footer"}} - {{content-for "test-body-footer"}} + {{content-for "body-footer"}} {{content-for "test-body-footer"}} diff --git a/tests/integration/helpers/a11y-audit-if-test.js b/tests/integration/helpers/a11y-audit-if-test.js index 3b683524..5ca86f9f 100644 --- a/tests/integration/helpers/a11y-audit-if-test.js +++ b/tests/integration/helpers/a11y-audit-if-test.js @@ -5,10 +5,10 @@ import hbs from 'htmlbars-inline-precompile'; import utils from 'ember-a11y-testing/test-support/utils'; import a11yAuditIf from 'ember-a11y-testing/test-support/audit-if'; -module('Integration | Helper | a11yAuditIf', function(hooks) { +module('Integration | Helper | a11yAuditIf', function (hooks) { setupRenderingTest(hooks); - test('a11yAuditIf should not execute a11yAudit', async function(assert) { + test('a11yAuditIf should not execute a11yAudit', async function (assert) { await render(hbs`{{#axe-component}}{{/axe-component}}`); await a11yAuditIf(this.element); @@ -16,21 +16,23 @@ module('Integration | Helper | a11yAuditIf', function(hooks) { assert.ok(true, 'a11yAuditIf should not run a11yAudit'); }); - test('a11yAudit should execute a11yAudit if enableA11yAudit=ture is passed as query param', async function(assert) { + test('a11yAudit should execute a11yAudit if enableA11yAudit=ture is passed as query param', async function (assert) { await render(hbs`{{#axe-component}}{{/axe-component}}`); // TODO - utils.getLocation = function() { + utils.getLocation = function () { return { - search: '?enableA11yAudit=true' - } + search: '?enableA11yAudit=true', + }; }; try { await a11yAuditIf(this.element); assert.ok(false, 'audit should have failed'); } catch (error) { - let foundExpectedError = error.message.startsWith('Assertion Failed: The page should have no accessibility violations.'); + let foundExpectedError = error.message.startsWith( + 'Assertion Failed: The page should have no accessibility violations.' + ); assert.ok(foundExpectedError); } }); diff --git a/tests/integration/helpers/a11y-audit-test.js b/tests/integration/helpers/a11y-audit-test.js index 336751e5..b9c381bc 100644 --- a/tests/integration/helpers/a11y-audit-test.js +++ b/tests/integration/helpers/a11y-audit-test.js @@ -4,50 +4,52 @@ import { render } from '@ember/test-helpers'; import hbs from 'htmlbars-inline-precompile'; import a11yAudit from 'ember-a11y-testing/test-support/audit'; -module('Integration | Helper | a11yAudit', function(hooks) { +module('Integration | Helper | a11yAudit', function (hooks) { setupRenderingTest(hooks); - test('a11yAudit runs successfully with element context', async function(assert) { + test('a11yAudit runs successfully with element context', async function (assert) { await render(hbs`{{#axe-component}}{{/axe-component}}`); await a11yAudit(this.element); - assert.ok(true, 'a11yAudit ran and didn\'t find any issues'); + assert.ok(true, "a11yAudit ran and didn't find any issues"); }); - test('a11yAudit catches violations successfully', async function(assert) { + test('a11yAudit catches violations successfully', async function (assert) { await render(hbs`{{#axe-component}}{{/axe-component}}`); try { await a11yAudit(this.element); assert.ok(false, 'should have failed'); } catch (error) { - let found = error.message.startsWith('Assertion Failed: The page should have no accessibility violations. Violations:'); + let found = error.message.startsWith( + 'Assertion Failed: The page should have no accessibility violations. Violations:' + ); assert.ok(found, 'error message is correct'); } }); - test('a11yAudit can use custom axe options', async function(assert) { + test('a11yAudit can use custom axe options', async function (assert) { await render(hbs`{{#axe-component}}{{/axe-component}}`); await a11yAudit(this.element, { rules: { 'button-name': { - enabled: false - } - } + enabled: false, + }, + }, }); assert.ok(true, 'a11yAudit ran and used the custom options'); }); - test('a11yAudit can use custom axe options as single argument', async function(assert) { + test('a11yAudit can use custom axe options as single argument', async function (assert) { await render(hbs`{{#axe-component}}{{/axe-component}}`); - await a11yAudit( { + await a11yAudit({ rules: { 'button-name': { - enabled: false - } - } + enabled: false, + }, + }, }); assert.ok(true, 'a11yAudit ran and used the custom options'); diff --git a/tests/integration/instance-initializers/axe-component-test.js b/tests/integration/instance-initializers/axe-component-test.js index 48a2532a..03c1c825 100644 --- a/tests/integration/instance-initializers/axe-component-test.js +++ b/tests/integration/instance-initializers/axe-component-test.js @@ -1,4 +1,4 @@ -/* global sinon, axe */ +/* global sinon */ import { module, test } from 'qunit'; import { setupRenderingTest } from 'ember-qunit'; import { render } from '@ember/test-helpers'; @@ -6,9 +6,7 @@ import hbs from 'htmlbars-inline-precompile'; import Component from '@ember/component'; import Ember from 'ember'; import { initialize } from 'dummy/instance-initializers/axe-component'; -import { - initialize as initializeViolationsHelper -} from 'dummy/instance-initializers/violations-helper'; +import { initialize as initializeViolationsHelper } from 'dummy/instance-initializers/violations-helper'; const ID_TEST_DOM_NODE = 'sign-up-button'; @@ -24,7 +22,7 @@ const VIOLATION_CLASS_MAP = { LEVEL_1: VIOLATION_CLASS__LEVEL_1, LEVEL_2: VIOLATION_CLASS__LEVEL_2, LEVEL_3: VIOLATION_CLASS__LEVEL_3, - REPLACED_ELEMENT: VIOLATION_CLASS__REPLACED + REPLACED_ELEMENT: VIOLATION_CLASS__REPLACED, }; let sandbox; @@ -39,22 +37,22 @@ function setupDOMNode(id = ID_TEST_DOM_NODE, tagName = 'div') { } function stubA11yCheck(sandbox, callbackPayload) { - sandbox.stub(axe, 'run').callsFake(function(el, options, callback) { + sandbox.stub(axe, 'run').callsFake(function (el, options, callback) { callback(undefined, callbackPayload); }); } function stubViolationOnDOMNode(sandbox, selector) { stubA11yCheck(sandbox, { - violations: [{ - name: 'test', - impact: 'critical', - help: 'it should be better', - helpUrl: 'http://example.com', - nodes: [ - { target: [selector] } - ] - }] + violations: [ + { + name: 'test', + impact: 'critical', + help: 'it should be better', + helpUrl: 'http://example.com', + nodes: [{ target: [selector] }], + }, + ], }); } @@ -71,18 +69,22 @@ async function setupVisualNoiseLevel(visualNoiseLevel) { function assertVisualNoiseLevel(assert, visualNoiseLevel, dummyDOMNode) { [1, 2, 3].forEach((_noiseLevel) => { - const assertFunc = (_noiseLevel === visualNoiseLevel) ? 'ok' : 'notOk'; - assert[assertFunc](dummyDOMNode.classList.contains(VIOLATION_CLASS_MAP[`LEVEL_${_noiseLevel}`], `assert ${assertFunc} for level ${_noiseLevel}`)); + const assertFunc = _noiseLevel === visualNoiseLevel ? 'ok' : 'notOk'; + assert[assertFunc]( + dummyDOMNode.classList.contains( + VIOLATION_CLASS_MAP[`LEVEL_${_noiseLevel}`], + `assert ${assertFunc} for level ${_noiseLevel}` + ) + ); }); dummyDOMNode.remove(); } - -module('Integration | Instance Initializer | axe-component', function(hooks) { +module('Integration | Instance Initializer | axe-component', function (hooks) { setupRenderingTest(hooks); - hooks.beforeEach(function(){ + hooks.beforeEach(function () { // In order for the audit to run, we have to act like we're not in testing Ember.testing = false; // eslint-disable-line ember/no-ember-testing-in-module-scope @@ -90,14 +92,14 @@ module('Integration | Instance Initializer | axe-component', function(hooks) { sandbox = sinon.createSandbox(); }); - hooks.afterEach(function(){ + hooks.afterEach(function () { sandbox.restore(); // Turn testing mode back on to ensure validity of other tests Ember.testing = true; // eslint-disable-line ember/no-ember-testing-in-module-scope }); - test('initializer should not re-open Component more than once', function(assert) { + test('initializer should not re-open Component more than once', function (assert) { // Since the initializer has already ran, we expect reopen to not be called let reopenSpy = sandbox.spy(Component, 'reopen'); @@ -106,58 +108,63 @@ module('Integration | Instance Initializer | axe-component', function(hooks) { assert.ok(reopenSpy.notCalled); }); - test('audit is run on didRender when not in testing mode', async function(assert) { + test('audit is run on didRender when not in testing mode', async function (assert) { let auditSpy = sandbox.spy(); this.set('auditSpy', auditSpy); this.set('content', 'derp'); - await render(hbs`{{#axe-component audit=auditSpy}}{{content}}{{/axe-component}}`); + await render( + hbs`{{#axe-component audit=auditSpy}}{{content}}{{/axe-component}}` + ); assert.ok(auditSpy.calledOnce, 'audit is called on render'); }); - test('audit is not run on didRender when in testing mode', async function(assert) { + test('audit is not run on didRender when in testing mode', async function (assert) { Ember.testing = true; // eslint-disable-line ember/no-ember-testing-in-module-scope let auditSpy = sandbox.spy(); this.set('auditSpy', auditSpy); this.set('content', 'derp'); - await render(hbs`{{#axe-component audit=auditSpy}}{{content}}{{/axe-component}}`); + await render( + hbs`{{#axe-component audit=auditSpy}}{{content}}{{/axe-component}}` + ); assert.ok(auditSpy.notCalled); }); /* Component.turnAuditOff */ - test('turnAuditOff prevents audit from running on didRender', async function(assert) { + test('turnAuditOff prevents audit from running on didRender', async function (assert) { let auditSpy = sandbox.spy(); this.set('auditSpy', auditSpy); this.set('content', 'derp'); - await render(hbs`{{#axe-component audit=auditSpy turnAuditOff=true}}{{content}}{{/axe-component}}`); + await render( + hbs`{{#axe-component audit=auditSpy turnAuditOff=true}}{{content}}{{/axe-component}}` + ); assert.ok(auditSpy.notCalled); }); /* Component.audit */ - test('audit should log any violations found', async function(assert) { + test('audit should log any violations found', async function (assert) { initializeViolationsHelper(); stubA11yCheck(sandbox, { - violations: [{ - name: 'test', - impact: 'critical', - help: 'it should be better', - helpUrl: 'http://example.com', - nodes: [ - { - target: - [ - '#ember-testing' - ] - } - ] - }] + violations: [ + { + name: 'test', + impact: 'critical', + help: 'it should be better', + helpUrl: 'http://example.com', + nodes: [ + { + target: ['#ember-testing'], + }, + ], + }, + ], }); const logSpy = sandbox.spy(console, 'error'); @@ -166,17 +173,19 @@ module('Integration | Instance Initializer | axe-component', function(hooks) { assert.ok(logSpy.calledOnce); }); - test('audit should log any violations found if no nodes are found', async function(assert) { + test('audit should log any violations found if no nodes are found', async function (assert) { initializeViolationsHelper(); stubA11yCheck(sandbox, { - violations: [{ - name: 'test', - impact: 'critical', - help: 'it should be better', - helpUrl: 'http://example.com', - nodes: [] - }] + violations: [ + { + name: 'test', + impact: 'critical', + help: 'it should be better', + helpUrl: 'http://example.com', + nodes: [], + }, + ], }); const logSpy = sandbox.spy(console, 'error'); @@ -184,7 +193,7 @@ module('Integration | Instance Initializer | axe-component', function(hooks) { assert.ok(logSpy.calledOnce); }); - test('audit should do nothing if no violations found', async function(assert) { + test('audit should do nothing if no violations found', async function (assert) { initializeViolationsHelper(); stubA11yCheck(sandbox, { violations: [] }); @@ -197,7 +206,7 @@ module('Integration | Instance Initializer | axe-component', function(hooks) { /* Component.axeCallback */ - test('axeCallback receives the results of the audit', async function(assert) { + test('axeCallback receives the results of the audit', async function (assert) { initializeViolationsHelper(); const results = { violations: [] }; @@ -206,58 +215,78 @@ module('Integration | Instance Initializer | axe-component', function(hooks) { const axeCallbackSpy = sandbox.spy(); this.set('axeCallbackSpy', axeCallbackSpy); - await render(hbs`{{#axe-component axeCallback=axeCallbackSpy}}{{content}}{{/axe-component}}`); + await render( + hbs`{{#axe-component axeCallback=axeCallbackSpy}}{{content}}{{/axe-component}}` + ); assert.ok(axeCallbackSpy.calledOnce); assert.ok(axeCallbackSpy.calledWith(results)); }); - test('axeCallback throws an error if it is not a function', async function(assert) { + test('axeCallback throws an error if it is not a function', async function (assert) { const results = { violations: [] }; - const a11yCheckStub = sandbox.stub(axe, 'run').callsFake(function(el, options, callback) { - assert.throws(() => callback(undefined, results), /axeCallback should be a function./); - }); - - await render(hbs`{{#axe-component axeCallback='axeCallbackSpy'}}{{content}}{{/axe-component}}`); + const a11yCheckStub = sandbox + .stub(axe, 'run') + .callsFake(function (el, options, callback) { + assert.throws( + () => callback(undefined, results), + /axeCallback should be a function./ + ); + }); + + await render( + hbs`{{#axe-component axeCallback='axeCallbackSpy'}}{{content}}{{/axe-component}}` + ); assert.ok(a11yCheckStub.calledOnce); }); /* Component.axeOptions */ - test('axeOptions are passed in as the second param to a11yCheck', async function(assert) { + test('axeOptions are passed in as the second param to a11yCheck', async function (assert) { const a11yCheckStub = sandbox.stub(axe, 'run'); const axeOptions = { test: 'test' }; this.set('axeOptions', axeOptions); - await render(hbs`{{axe-component class="component" axeOptions=axeOptions}}`); + await render( + hbs`{{axe-component class="component" axeOptions=axeOptions}}` + ); assert.ok(a11yCheckStub.calledOnce); assert.ok(a11yCheckStub.calledWith(sinon.match.any, axeOptions)); }); - test('#violationClass is computed from `visualNoiseLevel` 1', async function(assert) { + test('#violationClass is computed from `visualNoiseLevel` 1', async function (assert) { const visualNoiseLevel = 1; - const dummyDOMNode = await setupVisualNoiseLevel.call(this, visualNoiseLevel); + const dummyDOMNode = await setupVisualNoiseLevel.call( + this, + visualNoiseLevel + ); assertVisualNoiseLevel(assert, visualNoiseLevel, dummyDOMNode); }); - test('#violationClass is computed from `visualNoiseLevel` 2', async function(assert) { + test('#violationClass is computed from `visualNoiseLevel` 2', async function (assert) { const visualNoiseLevel = 2; - const dummyDOMNode = await setupVisualNoiseLevel.call(this, visualNoiseLevel); + const dummyDOMNode = await setupVisualNoiseLevel.call( + this, + visualNoiseLevel + ); assertVisualNoiseLevel(assert, visualNoiseLevel, dummyDOMNode); }); - test('#violationClass is computed from `visualNoiseLevel` 3', async function(assert) { + test('#violationClass is computed from `visualNoiseLevel` 3', async function (assert) { const visualNoiseLevel = 3; - const dummyDOMNode = await setupVisualNoiseLevel.call(this, visualNoiseLevel); + const dummyDOMNode = await setupVisualNoiseLevel.call( + this, + visualNoiseLevel + ); assertVisualNoiseLevel(assert, visualNoiseLevel, dummyDOMNode); }); - test('`axeViolationClassNames` can be passed as a space-separated string (to aid template usage)', async function(assert) { + test('`axeViolationClassNames` can be passed as a space-separated string (to aid template usage)', async function (assert) { initializeViolationsHelper(); stubViolationOnDOMNode(sandbox, `#${ID_TEST_DOM_NODE}`); @@ -265,13 +294,19 @@ module('Integration | Instance Initializer | axe-component', function(hooks) { const dummyDOMNode = setupDOMNode(ID_TEST_DOM_NODE); this.set('axeViolationClassNames', 'spark 🐋 foo '); - await render(hbs`{{axe-component axeViolationClassNames=axeViolationClassNames}}`); - - assert.deepEqual([].slice.call(dummyDOMNode.classList), ['spark', '🐋', 'foo']); + await render( + hbs`{{axe-component axeViolationClassNames=axeViolationClassNames}}` + ); + + assert.deepEqual([].slice.call(dummyDOMNode.classList), [ + 'spark', + '🐋', + 'foo', + ]); dummyDOMNode.remove(); }); - test('#violationClasses will always give precedence to a `axeViolationClassNames`, if it is set', async function(assert) { + test('#violationClasses will always give precedence to a `axeViolationClassNames`, if it is set', async function (assert) { initializeViolationsHelper(); stubViolationOnDOMNode(sandbox, `#${ID_TEST_DOM_NODE}`); @@ -280,20 +315,26 @@ module('Integration | Instance Initializer | axe-component', function(hooks) { const axeViolationClassNames = ['a11y-tomster', 'a11y-zoey']; this.set('axeViolationClassNames', axeViolationClassNames); - await render(hbs`{{axe-component axeViolationClassNames=axeViolationClassNames}}`); + await render( + hbs`{{axe-component axeViolationClassNames=axeViolationClassNames}}` + ); - axeViolationClassNames.forEach(className => { + axeViolationClassNames.forEach((className) => { assert.ok(dummyDOMNode.classList.contains(className)); }); - [1, 2, 3].forEach(noiseLevel => { - assert.notOk(dummyDOMNode.classList.contains(VIOLATION_CLASS_MAP[`LEVEL_${noiseLevel}`])); + [1, 2, 3].forEach((noiseLevel) => { + assert.notOk( + dummyDOMNode.classList.contains( + VIOLATION_CLASS_MAP[`LEVEL_${noiseLevel}`] + ) + ); }); dummyDOMNode.remove(); }); - test('using default class names for violations when no `axeViolationClassNames` is provided', async function(assert) { + test('using default class names for violations when no `axeViolationClassNames` is provided', async function (assert) { initializeViolationsHelper(); stubViolationOnDOMNode(sandbox, `#${ID_TEST_DOM_NODE}`); @@ -306,7 +347,7 @@ module('Integration | Instance Initializer | axe-component', function(hooks) { dummyDOMNode.remove(); }); - test(`smartly detects replaced elements and applies a special \`border-box\` style instead of the styles from the current setting`, async function(assert) { + test(`smartly detects replaced elements and applies a special \`border-box\` style instead of the styles from the current setting`, async function (assert) { initializeViolationsHelper(); stubViolationOnDOMNode(sandbox, `#${ID_TEST_DOM_NODE}`); @@ -315,9 +356,13 @@ module('Integration | Instance Initializer | axe-component', function(hooks) { const dummyDOMNode = setupDOMNode(ID_TEST_DOM_NODE, 'img'); this.set('axeViolationClassNames', [customViolationClass]); - await render(hbs`{{axe-component axeViolationClassNames=axeViolationClassNames}}`); + await render( + hbs`{{axe-component axeViolationClassNames=axeViolationClassNames}}` + ); - assert.ok(dummyDOMNode.classList.contains(VIOLATION_CLASS_MAP.REPLACED_ELEMENT)); + assert.ok( + dummyDOMNode.classList.contains(VIOLATION_CLASS_MAP.REPLACED_ELEMENT) + ); assert.notOk(dummyDOMNode.classList.contains(customViolationClass)); dummyDOMNode.remove(); diff --git a/tests/unit/instance-initializers/violations-helper-test.js b/tests/unit/instance-initializers/violations-helper-test.js index 0e8c60bc..60e05dc8 100644 --- a/tests/unit/instance-initializers/violations-helper-test.js +++ b/tests/unit/instance-initializers/violations-helper-test.js @@ -7,19 +7,19 @@ import { run } from '@ember/runloop'; let sandbox; -module('Unit | Instance Initializer | violations-helper', function(hooks) { - hooks.beforeEach(function() { +module('Unit | Instance Initializer | violations-helper', function (hooks) { + hooks.beforeEach(function () { this.TestApplication = Application.extend(); this.TestApplication.instanceInitializer({ name: 'initializer under test', - initialize + initialize, }); this.application = this.TestApplication.create({ autoboot: false }); this.instance = this.application.buildInstance(); sandbox = sinon.createSandbox(); }); - hooks.afterEach(function() { + hooks.afterEach(function () { run(this.application, 'destroy'); run(this.instance, 'destroy'); @@ -27,7 +27,7 @@ module('Unit | Instance Initializer | violations-helper', function(hooks) { }); // Replace this with your real tests. - test('it works', async function(assert) { + test('it works', async function (assert) { await this.instance.boot(); assert.ok(window.violationsHelper); diff --git a/tests/unit/utils/concurrent-axe-test.js b/tests/unit/utils/concurrent-axe-test.js index d97cc5ab..6f7dcee3 100644 --- a/tests/unit/utils/concurrent-axe-test.js +++ b/tests/unit/utils/concurrent-axe-test.js @@ -1,4 +1,4 @@ -/* global sinon, axe */ +/* global sinon */ import { module, test } from 'qunit'; import { ConcurrentAxe } from 'ember-a11y-testing/utils/concurrent-axe'; import { settled } from '@ember/test-helpers'; @@ -9,43 +9,57 @@ function setupDOMNode() { return node; } -module('Unit | Utils | ConcurrentAxe', function(hooks) { - hooks.before(function() { +module('Unit | Utils | ConcurrentAxe', function (hooks) { + hooks.before(function () { this.testOptions = { test: 'test' }; - this.testCallback = function(){}; + this.testCallback = function () {}; }); - hooks.beforeEach(function() { + hooks.beforeEach(function () { this.subject = new ConcurrentAxe(); this.sandbox = sinon.createSandbox(); this.axeRunStub = this.sandbox.stub(axe, 'run'); this.testNode = setupDOMNode(); }); - hooks.afterEach(function() { + hooks.afterEach(function () { this.sandbox.restore(); this.axeRunStub = null; this.testNode.remove(); }); - test('util calls axe.run with the correct arguments', async function(assert) { + test('util calls axe.run with the correct arguments', async function (assert) { assert.expect(1); this.subject.run(this.testNode, this.testOptions, this.testCallback); await settled(); - assert.ok(this.axeRunStub.calledOnceWith(this.testNode, this.testOptions, this.testCallback), 'called once with all arguments'); + assert.ok( + this.axeRunStub.calledOnceWith( + this.testNode, + this.testOptions, + this.testCallback + ), + 'called once with all arguments' + ); }); - test('all concurrent axe.run calls are executed', async function(assert) { + test('all concurrent axe.run calls are executed', async function (assert) { assert.expect(5); - for (let i=0; i<3; i++) { + for (let i = 0; i < 3; i++) { this.subject.run(this.testNode, this.testOptions, this.testCallback); } - assert.equal(this.subject._queue.length, 2, 'subsequent calls are placed in the queue'); - assert.ok(this.subject._timer, 'subsequent calls are scheduled for the next run loop'); + assert.equal( + this.subject._queue.length, + 2, + 'subsequent calls are placed in the queue' + ); + assert.ok( + this.subject._timer, + 'subsequent calls are scheduled for the next run loop' + ); await settled(); @@ -54,7 +68,7 @@ module('Unit | Utils | ConcurrentAxe', function(hooks) { assert.notOk(this.subject._timer, 'timer is cleared'); }); - test('axe does not audit invalid DOM node', async function(assert) { + test('axe does not audit invalid DOM node', async function (assert) { assert.expect(1); const div = document.createElement('div'); diff --git a/tests/unit/utils/format-violation-test.js b/tests/unit/utils/format-violation-test.js index 0bdf50fa..0bdec5fa 100644 --- a/tests/unit/utils/format-violation-test.js +++ b/tests/unit/utils/format-violation-test.js @@ -1,8 +1,8 @@ import { module, test } from 'qunit'; import formatViolation from 'ember-a11y-testing/utils/format-violation'; -module('Unit | Utils | formatViolation', function() { - test('formats a well-formed violation and relevant html', function(assert) { +module('Unit | Utils | formatViolation', function () { + test('formats a well-formed violation and relevant html', function (assert) { let violation = { name: 'test', impact: 'critical', @@ -11,9 +11,9 @@ module('Unit | Utils | formatViolation', function() { nodes: [ { target: ['.some-class'], - html: '' - } - ] + html: '', + }, + ], }; let message = formatViolation(violation, violation.nodes[0].html); @@ -21,12 +21,12 @@ module('Unit | Utils | formatViolation', function() { assert.equal(message, expected); }); - test('formats a well-formed violation', function(assert) { + test('formats a well-formed violation', function (assert) { let violation = { name: 'test', impact: 'critical', help: 'it should be better', - helpUrl: 'http://example.com' + helpUrl: 'http://example.com', }; let message = formatViolation(violation); @@ -34,35 +34,29 @@ module('Unit | Utils | formatViolation', function() { assert.equal(message, expected); }); - test('validates violation parameter structure', function(assert) { + test('validates violation parameter structure', function (assert) { let violation = { name: 'test', nodes: [ { target: ['.some-class'], - html: '' - } - ] + html: '', + }, + ], }; let expected = /formatViolation called with improper structure of parameter: violation. Required properties: impact, help, helpUrl./; - assert.throws( - function() { - formatViolation(violation, violation.nodes[0].html); - }, - expected - ); + assert.throws(function () { + formatViolation(violation, violation.nodes[0].html); + }, expected); }); - test('validates violation parameter exists', function(assert) { + test('validates violation parameter exists', function (assert) { let expected = /formatViolation called without required parameter: violation/; - assert.throws( - function() { - formatViolation(); - }, - expected - ); + assert.throws(function () { + formatViolation(); + }, expected); }); }); diff --git a/tests/unit/utils/is-background-replaced-element-test.js b/tests/unit/utils/is-background-replaced-element-test.js index 4d6bc169..337c4cef 100644 --- a/tests/unit/utils/is-background-replaced-element-test.js +++ b/tests/unit/utils/is-background-replaced-element-test.js @@ -8,7 +8,7 @@ const BACKGROUND_REPLACED_ELEMENTS = [ { tagName: 'SOURCE' }, { tagName: 'IMG' }, { tagName: 'INPUT', type: 'radio' }, - { tagName: 'INPUT', type: 'range' } + { tagName: 'INPUT', type: 'range' }, ]; const STANDARD_ELEMENTS = [ @@ -16,20 +16,22 @@ const STANDARD_ELEMENTS = [ { tagName: 'LI' }, { tagName: 'A' }, { tagName: 'INPUT', type: 'text' }, - { tagName: 'INPUT', type: 'number' } + { tagName: 'INPUT', type: 'number' }, ]; function makeMessage({ tagName, type }, expected) { - return `Element with tagName "${tagName}" ${type ? `with type "${type}" ` : ''}evaluates to ${expected}`; + return `Element with tagName "${tagName}" ${ + type ? `with type "${type}" ` : '' + }evaluates to ${expected}`; } -module('Unit | Utility | is replaced element', function() { - test(`it determines whether or not an HTMLElement is of the variety that will have its background content be unstylable`, function(assert) { +module('Unit | Utility | is replaced element', function () { + test(`it determines whether or not an HTMLElement is of the variety that will have its background content be unstylable`, function (assert) { let expected; let actual; let message; - BACKGROUND_REPLACED_ELEMENTS.forEach(element => { + BACKGROUND_REPLACED_ELEMENTS.forEach((element) => { expected = true; actual = isBackgroundReplacedElement(element); message = makeMessage(element, expected); @@ -37,7 +39,7 @@ module('Unit | Utility | is replaced element', function() { assert.equal(actual, expected, message); }); - STANDARD_ELEMENTS.forEach(element => { + STANDARD_ELEMENTS.forEach((element) => { expected = false; actual = isBackgroundReplacedElement(element); message = makeMessage(element, expected); diff --git a/tests/unit/utils/violations-helper-test.js b/tests/unit/utils/violations-helper-test.js index 5f45cc9f..3cfa8e5b 100644 --- a/tests/unit/utils/violations-helper-test.js +++ b/tests/unit/utils/violations-helper-test.js @@ -4,16 +4,16 @@ import { ViolationsHelper } from 'ember-a11y-testing/utils/violations-helper'; let sandbox; -module('Unit | Utils | ViolationsHelper', function(hooks) { - hooks.beforeEach(function() { +module('Unit | Utils | ViolationsHelper', function (hooks) { + hooks.beforeEach(function () { sandbox = sinon.createSandbox(); }); - hooks.afterEach(function(){ + hooks.afterEach(function () { sandbox.restore(); }); - test('initializes with a violations array', function(assert) { + test('initializes with a violations array', function (assert) { let violationsHelper = new ViolationsHelper(); let violationsHelperWithArguments = new ViolationsHelper('error'); @@ -23,25 +23,25 @@ module('Unit | Utils | ViolationsHelper', function(hooks) { /* Alias methods */ - test('count', function(assert) { + test('count', function (assert) { let violationsHelper = new ViolationsHelper('error'); assert.equal(violationsHelper.count, 1); }); - test('first', function(assert) { + test('first', function (assert) { let violationsHelper = new ViolationsHelper('error', 'failure'); assert.equal(violationsHelper.first, 'error'); }); - test('last', function(assert) { + test('last', function (assert) { let violationsHelper = new ViolationsHelper('error', 'failure'); assert.equal(violationsHelper.last, ['failure']); }); - test('push', function(assert) { + test('push', function (assert) { let violationsHelper = new ViolationsHelper(); violationsHelper.push('error'); @@ -50,37 +50,54 @@ module('Unit | Utils | ViolationsHelper', function(hooks) { /* filterBy */ - test('filterBy rule', function(assert) { + test('filterBy rule', function (assert) { let colorContrastViolation = { id: 'color-contrast' }; let violationsHelper = new ViolationsHelper(colorContrastViolation); - assert.deepEqual(violationsHelper.filterBy('rule', 'color-contrast'), [colorContrastViolation], "converts 'rule' key to 'id'"); + assert.deepEqual( + violationsHelper.filterBy('rule', 'color-contrast'), + [colorContrastViolation], + "converts 'rule' key to 'id'" + ); }); - test('filterBy impact', function(assert) { + test('filterBy impact', function (assert) { let colorContrastViolation = { id: 'color-contrast', impact: 'critical' }; let buttonNameViolation = { id: 'button-name', impact: 'critical' }; - let violationsHelper = new ViolationsHelper(colorContrastViolation, buttonNameViolation); - - assert.deepEqual(violationsHelper.filterBy('impact', 'critical'), [colorContrastViolation, buttonNameViolation], "returns all violations that match the key-value pair"); + let violationsHelper = new ViolationsHelper( + colorContrastViolation, + buttonNameViolation + ); + + assert.deepEqual( + violationsHelper.filterBy('impact', 'critical'), + [colorContrastViolation, buttonNameViolation], + 'returns all violations that match the key-value pair' + ); }); - test('filterBy node', function(assert) { - let sloppyInput = { nodes: [ { target: ['#sloppy-input'] } ] }; + test('filterBy node', function (assert) { + let sloppyInput = { nodes: [{ target: ['#sloppy-input'] }] }; let violationsHelper = new ViolationsHelper(sloppyInput); - assert.deepEqual(violationsHelper.filterBy('node', '#sloppy-input'), [sloppyInput], "returns violations attached to the matching node"); + assert.deepEqual( + violationsHelper.filterBy('node', '#sloppy-input'), + [sloppyInput], + 'returns violations attached to the matching node' + ); }); - /* logTip */ - test('only logs tip if there are violations', function(assert) { + test('only logs tip if there are violations', function (assert) { let violationsHelper = new ViolationsHelper(); let loggerInfoSpy = sandbox.spy(console, 'info'); violationsHelper.logTip(); - assert.ok(!loggerInfoSpy.called, "Nothing is logged if there are no violations"); + assert.ok( + !loggerInfoSpy.called, + 'Nothing is logged if there are no violations' + ); violationsHelper.push('violation'); @@ -88,7 +105,7 @@ module('Unit | Utils | ViolationsHelper', function(hooks) { assert.ok(loggerInfoSpy.called); }); - test('will not log tip more than once', function(assert) { + test('will not log tip more than once', function (assert) { let violationsHelper = new ViolationsHelper('violation'); let loggerInfoSpy = sandbox.spy(console, 'info'); @@ -98,6 +115,10 @@ module('Unit | Utils | ViolationsHelper', function(hooks) { let firstCallCount = loggerInfoSpy.callCount; violationsHelper.logTip(); - assert.equal(loggerInfoSpy.callCount, firstCallCount, "does not log anymore after the first time"); + assert.equal( + loggerInfoSpy.callCount, + firstCallCount, + 'does not log anymore after the first time' + ); }); }); diff --git a/tsconfig.json b/tsconfig.json index 506844a4..8e2e5098 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -21,28 +21,13 @@ "module": "es6", "experimentalDecorators": true, "paths": { - "dummy/tests/*": [ - "tests/*" - ], - "dummy/*": [ - "tests/dummy/app/*", - "app/*" - ], - "ember-a11y-testing": [ - "addon" - ], - "ember-a11y-testing/*": [ - "addon/*" - ], - "ember-a11y-testing/test-support": [ - "addon-test-support" - ], - "ember-a11y-testing/test-support/*": [ - "addon-test-support/*" - ], - "*": [ - "types/*" - ] + "dummy/tests/*": ["tests/*"], + "dummy/*": ["tests/dummy/app/*", "app/*"], + "ember-a11y-testing": ["addon"], + "ember-a11y-testing/*": ["addon/*"], + "ember-a11y-testing/test-support": ["addon-test-support"], + "ember-a11y-testing/test-support/*": ["addon-test-support/*"], + "*": ["types/*"] } }, "include": [ diff --git a/types/dummy/index.d.ts b/types/dummy/index.d.ts index 8b137891..e69de29b 100644 --- a/types/dummy/index.d.ts +++ b/types/dummy/index.d.ts @@ -1 +0,0 @@ - diff --git a/yarn.lock b/yarn.lock index f73b6c19..be3d050c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -10297,10 +10297,10 @@ typedarray-to-buffer@^3.1.5: dependencies: is-typedarray "^1.0.0" -typescript@^4.0.2: - version "4.0.2" - resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.0.2.tgz#7ea7c88777c723c681e33bf7988be5d008d05ac2" - integrity sha512-e4ERvRV2wb+rRZ/IQeb3jm2VxBsirQLpQhdxplZ2MEzGvDkkMmPglecnNDfSUBivMjP93vRbngYYDQqQ/78bcQ== +typescript@^3.9.7: + version "3.9.7" + resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.9.7.tgz#98d600a5ebdc38f40cb277522f12dc800e9e25fa" + integrity sha512-BLbiRkiBzAwsjut4x/dsibSTB6yWpwT5qWmC2OfuCg3GgVQCSgMs4vEctYPhsaGtd0AeuuHMkjZ2h2WG8MSzRw== uc.micro@^1.0.1, uc.micro@^1.0.5: version "1.0.6"