[Bug]: TabList/Tab shows accessibility issues based on FastPass from Accessibility Insights for Web

dakotaJang commented 8 months ago

Library

React Components / v9 (@fluentui/react-components)

System Info

System:
    OS: Linux 6.2 Ubuntu 22.04.2 LTS 22.04.2 LTS (Jammy Jellyfish)
    CPU: (16) x64 AMD EPYC 7763 64-Core Processor
    Memory: 56.56 GB / 62.78 GB
    Container: Yes
    Shell: 5.1.16 - /bin/bash

Are you reporting Accessibility issue?

None

Reproduction

https://codesandbox.io/p/sandbox/currying-bird-7yygmr

Bug Description

Using TabList/Tab shows accessibility issues based on FastPass from Accessibility Insights for Web. I used this sandbox page from react.fluentui.dev docs.

Actual Behavior

Running FastPass from Accessibility Insights for Web on sandbox page shows following accessilibility issue:

aria-hidden-focus: Ensures aria-hidden elements are not focusable nor contain focusable elements

Expected Behavior

No accessibility issue when using TabList/Tab

specifecially expecting no aria-hidden-focus: Ensures aria-hidden elements are not focusable nor contain focusable elements

Logs

No response

Requested priority

Normal

Products/sites affected

No response

Are you willing to submit a PR to fix?

no

Validations

[X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
[X] The provided reproduction is a minimal reproducible example of the bug.

microsoft-github-policy-service[bot] commented 2 months ago

This issue has not had activity for over 180 days! We're adding Soft close label and will close it soon for house-keeping purposes. Still require assistance? Please add comment - "keep open".

smhigley commented 2 months ago

This is caused by the aria-hidden utility elements created by tabster, and creates no practical accessibility issues.

We have this documented in our known issues wiki.

microsoft / fluentui