finos / a11y-theme-builder

DesignOps toolchain theme builder for accessibility inclusion using Atomic Design.
Apache License 2.0
44 stars 69 forks source link

[TB] Homepage left nav - Accessibility Insights - WCAG 1.3.1: Ensures that lists are structured correctly (ul) #903

Open kburk1997 opened 5 months ago

kburk1997 commented 5 months ago

Problem/Concern

When running Accessibility Insights for Web's automated checker on the homepage, the following issue occurs:

Issue

Ensures that lists are structured correctly (list)

Target application

A11y ThemeBuilder

Element path

ul

Snippet

<ul class="MuiList-root MuiList-padding css-14945rh">

How to fix

Fix all of the following:
  List element has direct children that are not allowed: [role=button]

Environment

Microsoft Edge version 125.0.0.0 This accessibility issue was found using Accessibility Insights for Web 2.41.0 (axe-core 4.7.2), a tool that helps find and fix accessibility issues. Get more information & download this tool at http://aka.ms/AccessibilityInsights.

Screenshot

Screenshot of ul element with button as direct child

Proposed Solution

Likely need to fix structure so that direct children are <li> elements, e.g. wrap the left nav buttons in <li> elems

ShadabImran07 commented 5 months ago

i wanted to work on this