Thanks to visit codestin.com
Credit goes to github.com

Skip to content

[TSDoc> Building the project]:: Ensures elements with an ARIA role that require parent roles are contained by them (a[role="tab"]) #267

@vagpt

Description

@vagpt

Test Environment:
Version: Version 24H2 (OS Build 26257.5000)
Browser Version: 129.0.2779.0 (Official build) dev (64-bit)
URL: https://tsdoc.org/pages/contributing/building/
Tool: Accessibility Insight For Web

Pre-requisites:
Login with v-id
Run AI tool

Repro Steps:

  1. Open the above URL and login with valid credentials.
  2. ‘TSDoc play’ page opens.
  3. Verify issue with accessibility insights for web tool.

Actual Result:
The a element with role="tab" (‘HTML’, ‘DOM’, ‘Lines’, etc) are not contained within an element with role="tablist", which is required by ARIA specifications.

Expected Result:
Ensures elements with an ARIA role that require parent roles are contained by them (aria-required-parent - https://accessibilityinsights.io/info-examples/web/aria-required-parent)
The a[role="tab"] element should be contained within a parent element with role="tablist" to ensure proper semantic structure and to aid assistive technologies in correctly interpreting the component

Element path:
iframe;.playground-tab-pane-inactive-tab:nth-child(1) > a[role="tab"]

Snippet:
HTML

How to fix:
Fix any of the following:
Required ARIA parent role not present: tablist

User impact:
An ARIA role attribute can be added to an element to instruct assistive technologies to treat the element as something other than its native HTML element type. For example, an

  • element with role="option" is to be treated as a selectable option in a listbox control, not as a static list item.
    Some ARIA "child" roles identify managed controls that are always part of a larger composite control, identified by a "parent" role. For example, role="option" identifies a child control that is managed by a parent control identified by role="listbox". People who use assistive technologies might find it difficult or impossible to use a child control if its managing control lacks the required parent role.

    MAS Reference Link:
    Info and Relationships - Liquid (microsoft.com)

    Have feedback to share on Bugs ? please tag bug as “A11yRCA” and add your feedback in the comment section

    issue_with_AI_tool_mas1 3 1_ The a element with role=tab (‘HTML’, ‘DOM’, ‘Lines’, etc) are not contained within an element with role=tablist,
  • Metadata

    Metadata

    Assignees

    No one assigned

      Labels

      A11ySev3Accessibility severityA11yWcagWcag accessibility violationHCL-TSDocproduct tag tracking accessibility testingTSDoc_Webms accessibilityIssues filed by Microsoft as part of an effort to audit websites and improve their accessibility

      Type

      No type

      Projects

      No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions