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

'Always open list view' preference sets initial focus and starts tab sequence from the List View #57013

Open
afercia opened this issue Dec 13, 2023 · 4 comments
Labels
[Feature] List View Menu item in the top toolbar to select blocks from a list of links. [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Type] Bug An existing feature does not function as intended

Comments

@afercia
Copy link
Contributor

afercia commented Dec 13, 2023

Description

When the 'Always open list view' preference is enabled, initial keyboard focus in both the Post Editor and in the Site Editor is set to the first item within the List view.

This is clrearly unexpected and makes the tab sequence start from the wrong place, as a relevant part of the UI is just 'skipped',

Expected:

  • initial focs to not be set on any specific element.
  • The tab sequence should start from the document root.
  • Only when creating a new post, initial focus is set to the post title.

I do realize initial focus is a behaevior that is built-in in the List view component. With the default preferences, it is good that when the List view opens, fofucs is set to the List view. I'd argue that focus shold be set to the List view role="region" instead of to the first item but that's a separate issue. However, the List view should not get focus on editor load when 'Always open list view' is enabled.

Screenshot of initial focus in the Post editor (same happens in the SIte editor):

Screenshot 2023-12-13 at 10 41 36

Step-by-step reproduction instructions

  • First test with default preferences.
  • Edit a post.
  • Observe that when the post editor loads, initial focus is not set anywhere.
  • Press the Tav key and observe the first element that gets focus is the 'View Posts' link.
  • Enable the 'Always open list view' preference.
  • Exit the editor and edit a post again.
  • Observe that when the post editor loads, initial focus is set to the List view first item.
  • The same thing happens in the site editor.

Note: initial focus in the Site editor > edit mode is set to the editor canvas. That's wrong, see #51570

Screenshots, screen recording, code snippet

No response

Environment info

No response

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

@afercia afercia added [Type] Bug An existing feature does not function as intended [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). labels Dec 13, 2023
@afercia
Copy link
Contributor Author

afercia commented Dec 13, 2023

To my understanding, this is one more case where some components behaviors (or behaviors of hooks attached to components) need to depend on the context rather than being built-in. Cc @ciampo

@ciampo
Copy link
Contributor

ciampo commented Dec 13, 2023

the List view should not get focus on editor load when 'Always open list view' is enabled.

That's a good find, thank you for flagging it.

this is one more case where some components behaviors (or behaviors of hooks attached to components) need to depend on the context rather than being built-in

This scenario is quite different from what discussed in #56217 (comment), mostly because the component responsible for rendering the list view and moving keyboard focus is not part of the @wordpress/components package, but is instead part of the edit-post package (see code), which means that it's probably ok for it to access the editor preferences and behave accordingly.
The same behavior is also implemented for the site editor in the edit-site package (see code).

I don't currently have the capacity to work on this at the moment, but I'm happy to help with the PR review.

@flootr
Copy link
Contributor

flootr commented Dec 13, 2023

I don't currently have the capacity to work on this at the moment, but I'm happy to help with the PR review.

I'm gonna work on this! 👍🏻

@flootr flootr self-assigned this Dec 13, 2023
@flootr
Copy link
Contributor

flootr commented Jan 3, 2024

I'm sorry, unfortunately I won't have the bandwidth to tackle this issue in the near future

@flootr flootr removed their assignment Jan 3, 2024
@andrewserong andrewserong added the [Feature] List View Menu item in the top toolbar to select blocks from a list of links. label Jan 10, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] List View Menu item in the top toolbar to select blocks from a list of links. [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

No branches or pull requests

4 participants