`no-redundant-roles` should allow (SVG) images with `role="img"`

[saskaak]

Hello!

As far as I know<img src="some-image.svg" role="img"> is an actual pattern that can be used to increase browser/screenreader support for SVG images specifically.

Thus, no-redundant-roles should allow images with role="img".

See the difference here comparing pattern 1 (no explicit role) and pattern 2 (with explicit role): https://www.smashingmagazine.com/2021/05/accessible-svg-patterns-comparison/

[preetsahil]

Is someone working on this issue ?
can you assign it to me.

[ljharb]

@preetsahil that's not how things work on github; issues aren't assigned like that. just make a PR if you want to work on it.

[preetsahil]

Okay I will try to work on it

[lb-]

Looks like there is a Safari bug that's the cause of this recommendation, Safari have said it's fixed but it appears to be an issue still.

• See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#identifying_svg_as_an_image
• See https://bugs.webkit.org/show_bug.cgi?id=216364

I will see if I can prepare a PR that changes the implicit role for img if src contains svg. This will not work for variables but may be good enough.

[lb-]

PR up #1026