Description
Describe the bug
According to the spec. the alt attribute is not allowed for <svg> elements:
https://www.w3.org/TR/html52/semantics-embedded-content.html#the-img-element
https://www.w3.org/TR/SVG2/struct.html#elementdef-svg
According to this stack-overflow answer, the best approach seems to be usage of a mixture of <title>,<desc> and the aria-label attribute.
Steps to reproduce the bug
- Go to https://bootstrap-vue.org/docs/icons
- Use "Inspect Element" on one of the icons, selecting the
<svg>tag - Check if an
altattribute is set
Expected behavior
No alt attribute is set, instead an aria-label attribute is set and optionally the <title> and <desc> are included in the SVG contents.
Versions
Libraries:
- BootstrapVue: 2.15.0
- Bootstrap: 4.5.0
- Vue: 2.6.11
Environment:
- Device: Desktop PC
- OS: Arch Linux
- Browser: Firefox
- Version: 78
Demo link
Can be reproduced on https://bootstrap-vue.org/docs/icons
Additional context
As additional note, I'd like to ask if it is possible to also use the icon name in the label? by default right now the value of alt is just "icon" which provides very little context to a screen reader user.