Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Docusaurus: Set focus on main section when choosing a section in the tutorial navigation #91

Open
7mary4 opened this issue Nov 16, 2021 · 0 comments

Comments

@7mary4
Copy link
Contributor

7mary4 commented Nov 16, 2021

Expected Behavior

When a section is chosen in the tutorial navigation, focus is set in the main section. This triggers a screen reader to begin announcing contnent and keyboard users can begin navigating the tutorial content

Current Behavior

When selecting a section and hitting enter, the focus is lost and starts over from the top of the page. Keyboard users must hit the tab key many times before entering the main section. Screen reader users may not know the content has been updated.

Steps to reproduce

  1. Load the tutorial page
  2. Press tab key until you reach Section 2. Writing code. Hit enter, tab to 2.2 Headings. Press enter.
  3. Press the tab key.
    If you focus on the "skip to main content" link, the focus management is broken.
    skip to main content is the first link in the body

The first element to receive focus should be the "#" link that allows you to create a deep link on the Semantic Heading header.
Preferred focus location - semantic header

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants