Ensures interactive controls are not nested as they are not always announced by screen readers or can cause focus problems for assistive technologies (.DocSearch-Container):A11y_Playwright OSS releases_Saerch_AI4W

[kupatkar99]

"Check out Accessibility Insights! - Identify accessibility bugs before check-in and make bug fixing faster and easier."

GitHub Tags:

#A11yAuto;#A11yMAS;#A11yTCS;#Playwright OSS Releases;#BM_PlaywrightOSSReleases_Web_Dec2024;#A11ySev2;#Chrome;#DesktopWeb;#FTP;#Win11;#nested-interactive;#WCAG4.1.2;#Name Role Value;#AI4W;#Rev:Yaja;

Environmental Details:

App Name: Playwright OSS releases
#URL: https://playwright.dev/

OS & Browser Details:

Microsoft Windows 11 Enterprise
Version 26100.2605
Microsoft Edge
Version 131.0.2903.99 (Official build) (64-bit)

Repro Steps:

1.Hit the Url: https://playwright.dev/
2. Playwright page will get open.
3. Tab till search button and press enter.
4. Observe that interactive controls are not nested as they are not always announced by screen readers or can cause focus problems for assistive technologies

Issue:

Ensures interactive controls are not nested as they are not always announced by screen readers or can cause focus problems for assistive technologies (nested-interactive - https://dequeuniversity.com/rules/axe/4.9/nested-interactive?application=msftAI)

Target application:

Fast and reliable end-to-end testing for modern web apps | Playwright - https://playwright.dev/

Element path:

.DocSearch-Container

Snippet:

Related paths:

#docsearch-input
a[href$="class-teststep"]
.DocSearch-Logo > a[rel="noopener noreferrer"][target="_blank"]

How to fix:

Fix any of the following:
Element has focusable descendants

Environment: Chrome version 131.0.0.0

====

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

Attachments: