Ensure that lists are structured correctly (.cards_vwnq): A11y_Playwright_AI4W #1761
Description
"Check out Accessibility Insights! - Identify accessibility bugs before check-in and make bug fixing faster and easier."
GitHub Tags:
#A11yMAS;#A11yTCS;#Playwright OSS Releases;#BM_PlaywrightOSSReleases_Web_Dec2024;#A11ySev2;#ChromiumEdge;#DesktopWeb;#FTP;#Win11;#link-name;#WCAG1.3.1;#Info and Relationships;#AI4W;#WCP;#CELA P1; #Closed;
Environmental Details:
App Name: Playwright OSS releases
#URL: https://playwright.dev/
OS & Browser Details:
Microsoft Windows 11 Enterprise
Version 26100.3915
Microsoft Edge
Version 136.0.0 (Official build) (64-bit)
Repro Steps:
1.Hit the Url: https://playwright.dev/community/ambassadors
2. Playwright page will get open.
3. Run accessibility insights for web and toggle fastpass.
4. Observe that links have discernible text (.header-github-link) or not.
Issue: Ensure that lists are structured correctly (list - https://accessibilityinsights.io/info-examples/web/list)
Target application:
Ambassadors | Playwright - https://playwright.dev/community/ambassadors
Element path:
.cards_vwnq
Snippet:
(https://github.com/AutomationPanda%22%3E%3C/a%3E)
Related paths:
.cards_vwnq > div:nth-child(1)
.cards_vwnq > div:nth-child(2)
.cards_vwnq > div:nth-child(3)
.cards_vwnq > div:nth-child(4)
.cards_vwnq > div:nth-child(5)
div:nth-child(6)
div:nth-child(7)
div:nth-child(8)
div:nth-child(9)
div:nth-child(10)
div:nth-child(11)
How to fix:
Fix all of the following:
List element has direct children that are not allowed: div
Environment:
Microsoft Edge version 136.0.0.0
====
This accessibility issue was found using Accessibility Insights for Web 2.46.0 (axe-core 4.10.2), a tool that helps find and fix accessibility issues. Get more information & download this tool at http://aka.ms/AccessibilityInsights.
Attachments:
