* Bump the npm group with 3 updates Bumps the npm group with 3 updates: [@typescript-eslint/parser](https://github.com/typescript-eslint/typescript-eslint/tree/HEAD/packages/parser), [eslint-plugin-github](https://github.com/github/eslint-plugin-github) and [nock](https://github.com/nock/nock). Updates `@typescript-eslint/parser` from 7.1.0 to 7.1.1 - [Release notes](https://github.com/typescript-eslint/typescript-eslint/releases) - [Changelog](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/parser/CHANGELOG.md) - [Commits](https://github.com/typescript-eslint/typescript-eslint/commits/v7.1.1/packages/parser) Updates `eslint-plugin-github` from 4.10.1 to 4.10.2 - [Release notes](https://github.com/github/eslint-plugin-github/releases) - [Commits](https://github.com/github/eslint-plugin-github/compare/v4.10.1...v4.10.2) Updates `nock` from 13.5.3 to 13.5.4 - [Release notes](https://github.com/nock/nock/releases) - [Changelog](https://github.com/nock/nock/blob/main/CHANGELOG.md) - [Commits](https://github.com/nock/nock/compare/v13.5.3...v13.5.4) --- updated-dependencies: - dependency-name: "@typescript-eslint/parser" dependency-type: direct:development update-type: version-update:semver-patch dependency-group: npm - dependency-name: eslint-plugin-github dependency-type: direct:development update-type: version-update:semver-patch dependency-group: npm - dependency-name: nock dependency-type: direct:development update-type: version-update:semver-patch dependency-group: npm ... Signed-off-by: dependabot[bot] <support@github.com> * Update checked-in dependencies --------- Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
45 lines
1.7 KiB
JavaScript
45 lines
1.7 KiB
JavaScript
const {hasProp} = require('jsx-ast-utils')
|
|
const {getElementType} = require('../utils/get-element-type')
|
|
|
|
module.exports = {
|
|
meta: {
|
|
docs: {
|
|
description: 'SVGs must have an accessible name',
|
|
url: require('../url')(module),
|
|
},
|
|
schema: [],
|
|
},
|
|
|
|
create(context) {
|
|
return {
|
|
JSXOpeningElement: node => {
|
|
const elementType = getElementType(context, node)
|
|
if (elementType !== 'svg') return
|
|
|
|
// Check if there is a nested title element that is the first non-whitespace child of the `<svg>`
|
|
const childrenWithoutWhitespace = node.parent.children?.filter(({type, value}) =>
|
|
type === 'JSXText' ? value.trim() !== '' : type !== 'JSXText',
|
|
)
|
|
|
|
const hasNestedTitleAsFirstChild =
|
|
childrenWithoutWhitespace?.[0]?.type === 'JSXElement' &&
|
|
childrenWithoutWhitespace?.[0]?.openingElement?.name?.name === 'title'
|
|
|
|
// Check if `aria-label` or `aria-labelledby` is set
|
|
const hasAccessibleName = hasProp(node.attributes, 'aria-label') || hasProp(node.attributes, 'aria-labelledby')
|
|
|
|
// Check if SVG is decorative
|
|
const isDecorative =
|
|
hasProp(node.attributes, 'role', 'presentation') || hasProp(node.attributes, 'aria-hidden', 'true')
|
|
|
|
if (elementType === 'svg' && !hasAccessibleName && !isDecorative && !hasNestedTitleAsFirstChild) {
|
|
context.report({
|
|
node,
|
|
message:
|
|
'`<svg>` must have an accessible name. Set `aria-label` or `aria-labelledby`, or nest a `<title>` element. However, if the `<svg>` is purely decorative, hide it with `aria-hidden="true"` or `role="presentation"`.',
|
|
})
|
|
}
|
|
},
|
|
}
|
|
},
|
|
}
|