"Skip to content" does not bring me to the content

[moorscode]

Issue Overview

Using "tab" to open the "Skip to content" and using this feature does not bring me to the content.
There are 4 hidden/unknown tabs before the "undo" button is selected.
After 7 tabs the Title block is finally selected.

Steps to Reproduce (for bugs)

1. Create a new post
2. Press "tab" to open the "Skip to content" feature
3. Press enter to skip to the content
4. Press "tab" until the title is focussed

Expected Behavior

As the element tells you, you will skip to the content, which in this case would be the blocks.

Related Issues and/or PRs

Related #1414
Related #1649

Gutenberg version: 0.5.0

[afercia]

Yep one of the issues here is that some controls don't have a focus style yet, so pressing Tab seems it doesn't do anything... a review on #1414 would be greatly appreciated 🙂

[hedgefield]

Worth noting that the extra hidden/unknown tabs at the beginning you mention are when the focus is moved to the WP notifications that are hiding behind the gutenberg top bar. This problem is described in #1964.

[hedgefield]

Also related: #1376

[afercia]

As the element tells you, you will skip to the content, which in this case would be the blocks.

The word "content" is a bit misleading, maybe. Actually, the "Skip to main content" link works consistently across all the admin screens and points to the focusable div element wrapping the "content" section:
<div id="wpbody-content" aria-label="Main content" tabindex="0">

[jasmussen]

@afercia just to make sure I'm reading you correctly — it sounds to me like the Skip to Content link actually works, but it just doesn't show a focus color on the main content area. Is that a correct reading?

And if that is correct, would the same focus color we use for the region navigation keyboard shortcut, ctrl + [button above tab] be sufficient in order to address this ticket?

[afercia]

@jasmussen I think this can be closed now, the main issue here was about some controls in the previous toolbar implementation not having a focus style and the notifications being additional (invisible) tab stops. To me, seems the skip to content link it's working as expected. No need for a focus color.

A side issue is that, to replicate what happens in the classic editor, only when creating a new post the title field should be focused automatically. To see the current behavior:

• create a new post with the classic editor
• observe the post title field gets autofocused
• edit an existing post with the classic editor
• observe the post title doesn't get autofocused

The above behavior makes sense to me and ideally should be implemented in Gutenberg too. Not sure if there's already an issue for this.

[jasmussen]

I think this can be closed now, the main issue here was about some controls in the previous toolbar implementation not having a focus style and the notifications being additional (invisible) tab stops. To me, seems the skip to content link it's working as expected. No need for a focus color.

Cool, closing, thanks.

The above behavior makes sense to me and ideally should be implemented in Gutenberg too. Not sure if there's already an issue for this.

This is a very interesting and unique behavior — it seems if I edit an existing draft, the title is still focused, whereas if I edit a previously published post, the title is not focused.

I don't fully understand or appreciate why it works this way, but I assume there must be years of background to it. If you would, can you create a new ticket for this? Be sure to emphasize the difference in behavior between editing a draft vs. a published vs. a scheduled post. Thanks.