[Dotcom shell]: React VO does not announce location to user after using Skip to content button

[oliviaflory]

Description

When the user selects the Skip to content button from the masthead, the screen reader does not announce the new location. User must tab to get the VO to announce anything, skipping directly to the first TOC item, and misses the "You are in a list" announcement.

masthead-location-not-announced.mov

Present in Production

Component(s) impacted

Masthead (assuming it affects masthead)
Dotcom shell

Browser

Chrome

Carbon for IBM.com version

1.30.0 rc 0

Severity

Severity 2 = Aspects of design is broken, and impedes users in a significant way, but there is a way to complete their tasks. Affects major functionality, has a workaround.

Application/website

carbon for IBM.com

Package

@carbon/ibmdotcom-react

CodeSandbox example

https://carbon-design-system.github.io/carbon-for-ibm-dotcom/next/react/?path=/story/components-dotcom-shell--default

Steps to reproduce the issue (if applicable)

No response

Release date (if applicable)

No response

Code of Conduct

• I agree to follow this project's Code of Conduct
• I checked the current issues for duplicate issues

[jeffchew]

Need to ask accessibility team for guidance on this.

[ljcarot]

Try testing on Codesandbox. If still exists there, assign severity and pipeline.

skip-to-content in web components also has inconsistent tabindex from React version - need to investigate.

@oliviaflory

[oliviaflory]

Retested in both React production and React 1.31.0 rc1

React v1.30
When I select the Skip to main content button the VO does not announce where I am within the main content.
https://user-images.githubusercontent.com/45692622/154540146-a9229a23-7a84-4dd4-80c2-c23bce7eaae4.mov

React v1.31.0 rc 1
https://user-images.githubusercontent.com/45692622/154540101-c61df891-cfc8-45e0-98a5-3ef64846cb5d.mov

Web components v1.16.0 rc1
Web components does not have Skip to main content button enabled
I believe all navigation needs a Skip to main content option if the user does not wish to go through the main navigation.

Web.components.v1.16.0.rc1.Screen.Recording.2022-02-17.at.10.41.35.AM.mov

[kennylam]

@oliviaflory I'm not sure it needs to announce the main content area, based on the accessibility documentation.
https://www.carbondesignsystem.com/components/UI-shell-header/usage/#interactions
https://www.w3.org/TR/2016/NOTE-WCAG20-TECHS-20161007/G1

Since the link itself already announces it is for skipping to the main content, it seems this is behaving correctly?

[oliviaflory]

@oliviaflory I'm not sure it needs to announce the main content area, based on the accessibility documentation. https://www.carbondesignsystem.com/components/UI-shell-header/usage/#interactions https://www.w3.org/TR/2016/NOTE-WCAG20-TECHS-20161007/G1

Since the link itself already announces it is for skipping to the main content, it seems this is behaving correctly?

@kennylam hmm ok, I guess I assumed you'd want to hear what you landed on, but to does sound like we might be ok to close.

I swear there was another example that announced "you are currently on a list" when you land on the TOC, but I don't hear it in that example

[stale]

We've marked this issue as stale because there hasn't been any activity for 60 days. If there's no further activity on this issue in the next three days then we'll close it. You can keep the conversation going with just a short comment. Thanks for your contributions.