Skip to content

[Enhancement][a11y][Footer]: Добавить role="contentinfo" #4692

@eugpoloz

Description

@eugpoloz

Из аудита невизуальной доступности VKUI:

Нужно тегу <footer /> задать role="contentinfo". В принципе теги семантических областей лучше дублировать ролями, потому что в некоторых ситуациях они просто не считываются.

Поскольку Footer у нас используется как минимум внутри Group и role="contentinfo" повторяется, то каждый Footer требует обязательного aria-label. Соответственно, нужен какой-то временный пропс для Group, использующийся вместе с description.
UPD(@mendrew): это не верно, в Group Footer не используется, там используется Footnote, так что такой проблемы нету.

{hasReactNode(description) && (
<Footnote className={styles['Group__description']}>{description}</Footnote>
)}

Что я вижу как решение:

  • Footer: добавляем дефолтную role="contentinfo", даем возможность переопределять ее вместе с Component
  • Group: создаем подкомпонент Group.Description, описываем, как его использовать и как сделать доступным [Feature]: Декомпозировать Group #5758
  • Group: депрекейтим проп description в пользу Group.Description.

Metadata

Metadata

Labels

a11yДоступность (цифровая)a11y:auditПроблемы, найденные в ходе аудита невизуальной доступности VKUIcmp:footercmp:grouptype:enhancement

Type

Projects

Status

✅ Done

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions