diff --git a/dist/core/rules/alt-require.js b/dist/core/rules/alt-require.js index 5532b39db..24a4d0eb6 100644 --- a/dist/core/rules/alt-require.js +++ b/dist/core/rules/alt-require.js @@ -5,11 +5,14 @@ exports.default = { description: 'The alt attribute of an element must be present and alt attribute of area[href] and input[type=image] must have a value.', init(parser, reporter) { parser.addListener('tagstart', (event) => { + var _a; const tagName = event.tagName.toLowerCase(); const mapAttrs = parser.getMapAttrs(event.attrs); const col = event.col + tagName.length + 1; let selector; - if (tagName === 'img' && !('alt' in mapAttrs)) { + if (tagName === 'img' && + !('alt' in mapAttrs) && + ((_a = mapAttrs['aria-hidden']) === null || _a === void 0 ? void 0 : _a.trim().toLowerCase()) !== 'true') { reporter.warn('An alt attribute must be present on elements.', event.line, col, this, event.raw); } else if ((tagName === 'area' && 'href' in mapAttrs) || @@ -22,4 +25,4 @@ exports.default = { }); }, }; -//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWx0LXJlcXVpcmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvY29yZS9ydWxlcy9hbHQtcmVxdWlyZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOztBQUVBLGtCQUFlO0lBQ2IsRUFBRSxFQUFFLGFBQWE7SUFDakIsV0FBVyxFQUNULGdJQUFnSTtJQUNsSSxJQUFJLENBQUMsTUFBTSxFQUFFLFFBQVE7UUFDbkIsTUFBTSxDQUFDLFdBQVcsQ0FBQyxVQUFVLEVBQUUsQ0FBQyxLQUFLLEVBQUUsRUFBRTtZQUN2QyxNQUFNLE9BQU8sR0FBRyxLQUFLLENBQUMsT0FBTyxDQUFDLFdBQVcsRUFBRSxDQUFBO1lBQzNDLE1BQU0sUUFBUSxHQUFHLE1BQU0sQ0FBQyxXQUFXLENBQUMsS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFBO1lBQ2hELE1BQU0sR0FBRyxHQUFHLEtBQUssQ0FBQyxHQUFHLEdBQUcsT0FBTyxDQUFDLE1BQU0sR0FBRyxDQUFDLENBQUE7WUFDMUMsSUFBSSxRQUFRLENBQUE7WUFFWixJQUFJLE9BQU8sS0FBSyxLQUFLLElBQUksQ0FBQyxDQUFDLEtBQUssSUFBSSxRQUFRLENBQUMsRUFBRSxDQUFDO2dCQUM5QyxRQUFRLENBQUMsSUFBSSxDQUNYLHFEQUFxRCxFQUNyRCxLQUFLLENBQUMsSUFBSSxFQUNWLEdBQUcsRUFDSCxJQUFJLEVBQ0osS0FBSyxDQUFDLEdBQUcsQ0FDVixDQUFBO1lBQ0gsQ0FBQztpQkFBTSxJQUNMLENBQUMsT0FBTyxLQUFLLE1BQU0sSUFBSSxNQUFNLElBQUksUUFBUSxDQUFDO2dCQUMxQyxDQUFDLE9BQU8sS0FBSyxPQUFPLElBQUksUUFBUSxDQUFDLE1BQU0sQ0FBQyxLQUFLLE9BQU8sQ0FBQyxFQUNyRCxDQUFDO2dCQUNELElBQUksQ0FBQyxDQUFDLEtBQUssSUFBSSxRQUFRLENBQUMsSUFBSSxRQUFRLENBQUMsS0FBSyxDQUFDLEtBQUssRUFBRSxFQUFFLENBQUM7b0JBQ25ELFFBQVEsR0FBRyxPQUFPLEtBQUssTUFBTSxDQUFDLENBQUMsQ0FBQyxZQUFZLENBQUMsQ0FBQyxDQUFDLG1CQUFtQixDQUFBO29CQUNsRSxRQUFRLENBQUMsSUFBSSxDQUNYLHdCQUF3QixRQUFRLHFCQUFxQixFQUNyRCxLQUFLLENBQUMsSUFBSSxFQUNWLEdBQUcsRUFDSCxJQUFJLEVBQ0osS0FBSyxDQUFDLEdBQUcsQ0FDVixDQUFBO2dCQUNILENBQUM7WUFDSCxDQUFDO1FBQ0gsQ0FBQyxDQUFDLENBQUE7SUFDSixDQUFDO0NBQ00sQ0FBQSJ9 \ No newline at end of file +//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWx0LXJlcXVpcmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvY29yZS9ydWxlcy9hbHQtcmVxdWlyZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOztBQUVBLGtCQUFlO0lBQ2IsRUFBRSxFQUFFLGFBQWE7SUFDakIsV0FBVyxFQUNULGdJQUFnSTtJQUNsSSxJQUFJLENBQUMsTUFBTSxFQUFFLFFBQVE7UUFDbkIsTUFBTSxDQUFDLFdBQVcsQ0FBQyxVQUFVLEVBQUUsQ0FBQyxLQUFLLEVBQUUsRUFBRTs7WUFDdkMsTUFBTSxPQUFPLEdBQUcsS0FBSyxDQUFDLE9BQU8sQ0FBQyxXQUFXLEVBQUUsQ0FBQTtZQUMzQyxNQUFNLFFBQVEsR0FBRyxNQUFNLENBQUMsV0FBVyxDQUFDLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQTtZQUNoRCxNQUFNLEdBQUcsR0FBRyxLQUFLLENBQUMsR0FBRyxHQUFHLE9BQU8sQ0FBQyxNQUFNLEdBQUcsQ0FBQyxDQUFBO1lBQzFDLElBQUksUUFBUSxDQUFBO1lBRVosSUFDRSxPQUFPLEtBQUssS0FBSztnQkFDakIsQ0FBQyxDQUFDLEtBQUssSUFBSSxRQUFRLENBQUM7Z0JBQ3BCLENBQUEsTUFBQSxRQUFRLENBQUMsYUFBYSxDQUFDLDBDQUFFLElBQUksR0FBRyxXQUFXLEVBQUUsTUFBSyxNQUFNLEVBQ3hELENBQUM7Z0JBQ0QsUUFBUSxDQUFDLElBQUksQ0FDWCxxREFBcUQsRUFDckQsS0FBSyxDQUFDLElBQUksRUFDVixHQUFHLEVBQ0gsSUFBSSxFQUNKLEtBQUssQ0FBQyxHQUFHLENBQ1YsQ0FBQTtZQUNILENBQUM7aUJBQU0sSUFDTCxDQUFDLE9BQU8sS0FBSyxNQUFNLElBQUksTUFBTSxJQUFJLFFBQVEsQ0FBQztnQkFDMUMsQ0FBQyxPQUFPLEtBQUssT0FBTyxJQUFJLFFBQVEsQ0FBQyxNQUFNLENBQUMsS0FBSyxPQUFPLENBQUMsRUFDckQsQ0FBQztnQkFDRCxJQUFJLENBQUMsQ0FBQyxLQUFLLElBQUksUUFBUSxDQUFDLElBQUksUUFBUSxDQUFDLEtBQUssQ0FBQyxLQUFLLEVBQUUsRUFBRSxDQUFDO29CQUNuRCxRQUFRLEdBQUcsT0FBTyxLQUFLLE1BQU0sQ0FBQyxDQUFDLENBQUMsWUFBWSxDQUFDLENBQUMsQ0FBQyxtQkFBbUIsQ0FBQTtvQkFDbEUsUUFBUSxDQUFDLElBQUksQ0FDWCx3QkFBd0IsUUFBUSxxQkFBcUIsRUFDckQsS0FBSyxDQUFDLElBQUksRUFDVixHQUFHLEVBQ0gsSUFBSSxFQUNKLEtBQUssQ0FBQyxHQUFHLENBQ1YsQ0FBQTtnQkFDSCxDQUFDO1lBQ0gsQ0FBQztRQUNILENBQUMsQ0FBQyxDQUFBO0lBQ0osQ0FBQztDQUNNLENBQUEifQ== \ No newline at end of file diff --git a/src/core/rules/alt-require.ts b/src/core/rules/alt-require.ts index cc51c4a9a..4f0d69d95 100644 --- a/src/core/rules/alt-require.ts +++ b/src/core/rules/alt-require.ts @@ -11,7 +11,11 @@ export default { const col = event.col + tagName.length + 1 let selector - if (tagName === 'img' && !('alt' in mapAttrs)) { + if ( + tagName === 'img' && + !('alt' in mapAttrs) && + mapAttrs['aria-hidden']?.trim().toLowerCase() !== 'true' + ) { reporter.warn( 'An alt attribute must be present on elements.', event.line, diff --git a/test/rules/alt-require.spec.js b/test/rules/alt-require.spec.js index 31ce8ee2a..d1eccd774 100644 --- a/test/rules/alt-require.spec.js +++ b/test/rules/alt-require.spec.js @@ -18,6 +18,34 @@ describe(`Rules: ${ruleId}`, () => { expect(messages.length).toBe(0) }) + it('Img tag with aria-hidden="true" and no alt attribute should not result in an error', () => { + const code = '' + const messages = HTMLHint.verify(code, ruleOptions) + expect(messages.length).toBe(0) + }) + + it('Img tag with aria-hidden="TRUE" and no alt attribute should not result in an error', () => { + const code = '' + const messages = HTMLHint.verify(code, ruleOptions) + expect(messages.length).toBe(0) + }) + + it('Img tag with aria-hidden=" true " and no alt attribute should not result in an error', () => { + const code = '' + const messages = HTMLHint.verify(code, ruleOptions) + expect(messages.length).toBe(0) + }) + + it('Img tag with aria-hidden="false" and no alt attribute should result in an error', () => { + const code = '' + const messages = HTMLHint.verify(code, ruleOptions) + expect(messages.length).toBe(1) + expect(messages[0].rule.id).toBe(ruleId) + expect(messages[0].line).toBe(1) + expect(messages[0].col).toBe(5) + expect(messages[0].type).toBe('warning') + }) + it('Img tag have not alt attribute should result in an error', () => { const code = '' const messages = HTMLHint.verify(code, ruleOptions) diff --git a/website/src/content/docs/rules/alt-require.mdx b/website/src/content/docs/rules/alt-require.mdx index 85566c90d..3dc41ab91 100644 --- a/website/src/content/docs/rules/alt-require.mdx +++ b/website/src/content/docs/rules/alt-require.mdx @@ -10,7 +10,7 @@ keywords: import { Badge } from '@astrojs/starlight/components'; -Alt of `img` must be present and alt of `area[href]` and `input[type=image]` must be set with a value. +Alt of `img` must be present unless the image is hidden from assistive technologies with `aria-hidden="true"`. Alt of `area[href]` and `input[type=image]` must be set with a value. Level: @@ -23,6 +23,7 @@ Level: ```html test + test ```