💅 Error no-noninteractive-element-to-interactive-role in svg

[RoyMcCrain]

Environment information

CLI:
  Version:                      1.4.1
  Color support:                true

Platform:
  CPU Architecture:             x86_64
  OS:                           linux

Environment:
  BIOME_LOG_DIR:                unset
  NO_COLOR:                     unset
  TERM:                         "xterm-256color"
  JS_RUNTIME_VERSION:           "v18.18.2"
  JS_RUNTIME_NAME:              "node"
  NODE_PACKAGE_MANAGER:         "bun/1.0.15"

Biome Configuration:
  Status:                       Loaded successfully
  Formatter disabled:           false
  Linter disabled:              false
  Organize imports disabled:    false
  VCS disabled:                 true

Workspace:
  Open Documents:               0

Rule name

noInteractiveElementToNoninteractiveRole

Playground link

https://biomejs.dev/playground/?code=PABkAGkAdgA%2BAAoAIAAgADwAaAAyAD4AUgBvAGwAZQAgAG4AbwBuAGUAPAAvAGgAMgA%2BAAoAIAAgAAoAIAAgADwAcwB2AGcAPgAKACAAIAAgACAAPAB0AGkAdABsAGUAPgBwAGEAcwBzADwALwB0AGkAdABsAGUAPgAKACAAIAA8AC8AcwB2AGcAPgAKACAAIAAKACAAIAA8AGgAMgA%2BAEEAZABkACAAcgBvAGwAZQAgAGkAbQBnADwALwBoADIAPgAKACAAIAA8AHMAdgBnACAAcgBvAGwAZQA9ACIAaQBtAGcAIgA%2BAAoAIAAgACAAIAA8AHQAaQB0AGwAZQA%2BAHAAYQBzAHMAPAAvAHQAaQB0AGwAZQA%2BAAoAIAAgADwALwBzAHYAZwA%2BAAoACgAgACAACgA8AC8AZABpAHYAPgA%3D

Expected result

role="img" is passed in svg.
The noInteractiveElementToNoninteractiveRole description does not include svg.
However, specifying a role for svg results in an error for this rule.

Code of Conduct

• I agree to follow Biome's Code of Conduct

[ematipico]

The diagnostic is correct (I just checked if <svg> is interactive, and it's not), but the documentation is not exhaustive. Mainly because we copied from the original rule.

Fix: to add svg to the list of non-interactive roles.

[RoyMcCrain]

https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/img_role#svg_and_roleimg
I thought it was a bug because it was recommended to add role="img" to the SVG as shown above.
Thanks for confirming.

[ematipico]

That's interesting 🤔

[chansuke]

I'd like to work on this issue.