Extend alt-text rule to check for any element with role="img" as well

[anuvenkatesh1]

This is not a bug but rather looking for some guidance on how can I extend the alt-text rule to include elements that have role="img" as well. Guidance is highly appreciated.

[ljharb]

You can designate a specific custom component to act as an image: https://github.com/jsx-eslint/eslint-plugin-jsx-a11y#configurations

You can also use https://github.com/jsx-eslint/eslint-plugin-jsx-a11y#polymorphic-components, although that kind of design is not recommended (iow, using "role" on an HTML element).

[anuvenkatesh1]

Thank you @ljharb . I attempted to try the above but was unsuccessful, Sorry am a novice to React and jsx-a11y. I was wondering if I can extend the alt-text rule in the estlintrc config to include div role="img" kind of elements also. Pretty much the same kind of check for aria-label/aria-labelledby needs to be done for any element with role="img" too "jsx-a11y/alt-text":[2,{ "elements": ["img","div[role=\"img\"]"] }

[ljharb]

no, but you can use the polymorphic components setting to make divs with a role of "img" be treated like img.