@instructure/ui-test-utils
Version:
A UI testing library made by Instructure Inc.
109 lines (105 loc) • 4.34 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.generateA11yTests = generateA11yTests;
var _react = _interopRequireDefault(require("react"));
var _uiTestSandbox = require("@instructure/ui-test-sandbox");
var _expect = require("./expect");
var _index = require("../index");
var _generateComponentExamples = require("./generateComponentExamples");
/*
* The MIT License (MIT)
*
* Copyright (c) 2015 - present Instructure, Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in all
* copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
* SOFTWARE.
*/
const renderExample = ({
Component,
componentProps,
key
}) => /*#__PURE__*/_react.default.createElement(Component, Object.assign({
key: key
}, componentProps));
/**
*
* This function will generate a11y tests based on the component and the component
* example definition json.
* It will enumerate over the generated component examples and will call the
* `.accessible()` function on it.
*
* ```js
* const subject = await mount(<Example />)
const element = within(subject.getDOMNode())
expect(await element.accessible()).to.be.true()
* ```
* @param Component - The base Component
* @param componentExample - The example definition json, this will be the basis for the prop
* combination generation.
* @param ariaRulesToIgnore - ARIA rules to ignore. these must be one of the
* rules described here: https://dequeuniversity.com/rules/axe/4.4
*
* @module generateA11yTests
* @private
*/
function generateA11yTests(Component, componentExample, ariaRulesToIgnore) {
const sections = (0, _generateComponentExamples.generateComponentExamples)(Component, componentExample);
describe(`${Component.displayName} should meet accessibility standards`, async () => {
sections.forEach(({
pages,
propName,
propValue
}, i) => {
const description = propName ? `rendered with prop '${String(propName)}' = '${propValue}'` : 'rendered';
describe(`${description}`, async () => {
let rendered = 0;
let j = 0;
pages.forEach(({
examples
}) => {
examples.forEach(example => {
var _Example;
const Example = renderExample.bind(null, example);
const description = process.env.DEBUG ? `with prop combination: ${JSON.stringify(example.componentProps, null, 2)} [${i},${j}]` : `${j}`;
it(description, async () => {
const subject = await (0, _uiTestSandbox.mount)(_Example || (_Example = /*#__PURE__*/_react.default.createElement(Example, null)));
const element = (0, _index.within)(subject.getDOMNode());
let axeOptions = void 0;
if (ariaRulesToIgnore) {
axeOptions = {
ignores: ariaRulesToIgnore
};
}
const result = await element.accessible(axeOptions);
if (result !== true) {
// \n is needed because chai cuts the log in two with a
// expected - actual message.
_expect.expect.fail('\n' + result.message);
}
});
j++;
});
rendered = rendered + examples.length;
});
});
});
});
}