Skip to content

Block list appender no longer reachable with the keyboard from the settings panel #61391

Open

Description

Description

Reported by @alexstine on Slack.

It appears an important keyboard interaction affordance changed from WordPress 6.5 to Gutenberg latest trunk 18.3.0-rc.1, I'm assuming the change is not intentional thus marking this issue as regression.

Previously, on WordPress 6.5, with the post editor in 'Select' mode (also known as 'navigation mode'), pressing Shift + Tab from the Settings panel brought users to the 'block list appender' at the bottom of the blocks list, which provided the ability to reach:

  • the 'Add block' plus icon button
  • the 'Add default block'

This used to be one of the easiest ways for keyboard users and screen reader users to reach the bottom of the post content and add blocks there.

On latest Gutenberg trunk this doesn't work any longer. Pressing Shift + Tab from the Settings panel brings users directly to the last block, skipping entirely the 'Add block' and 'Add default block'.

These kind of changes that impact keyboard interaction are extremely impactful for keyboard users. Suddenly, a known affordance and user flow to add block disappears, making adding blocks a way longer and tedious process.

When fixed, it would be nice to add e2e tests to prevent such unexpected changes in the future.

When developing, manually testing the editor with the keyboard would be gretly appreciated to prevent such keyboard usability regressions.

See attached GIFs to better illustrate.

Expected keyboard interaction on WordPress 6.5:

6 5

Changed interaction on Gutenberg trunk:

gb trunk

Step-by-step reproduction instructions

  • Test on WordPress 6.5.
  • Edit a post that contains at least one block.
  • Switch the editor to 'Select mode' from the top toolbar > Tools dropdown menu.
  • Press Tab as much as necessary to reach the Settings panel (open it if necessary).
  • From the Settings Panel, press Shift + Tab to navigate backwards.
  • Observe it is possible to reach the block list appender at the bottom of the post, so that focus goes to the 'Add block' plus icon button and then to the 'Add default block'.
  • Test on latest Gutenberg trunk.
  • Repeat the steps above.
  • Observe the 'Add block' plus icon button and the 'Add default block' are not reachable. Observe they're not even rendered when using this keyboard flow.

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Assignees

No one assigned

    Labels

    [Feature] InserterThe main way to insert blocks using the + button in the editing interface[Focus] Accessibility (a11y)Changes that impact accessibility and need corresponding review (e.g. markup changes).[Package] Block editor/packages/block-editor[Type] RegressionRelated to a regression in the latest release

    Type

    No type

    Projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions