Description

Discovered while working on #68602

The Cover block placeholder now shows a color palette users can use to set a background color:

Navigating the color options with the keyboard isn't fully functional and at some point users may end up in a state where it is impossible to change the selected color option with the keyboard.

It appears this UI change hasn't been tested at all with keyboard, as the non-functional keyboard navigation is very clear and apparent. I would like to remind that any new UI should be tested for at least basic keyboard interaction before being merged and released.

Step-by-step reproduction instructions

• Add a Cover block.
• Navigate the block placeholder with the keyboard: Press the Tab key three times to move focus to the first color option.
• At this point:
  • Tab: focus moves to the block settings panel
  • Right arrow: doesn't do anything
  • Left arrow: moves focus to the previous buttons in the placeholder
  • Down arrow: moves focus to the following color options, so this is the only keyboard navigation that works
  • Up arrow: moves focus to the wrapper block, so this doesn't work, although I guess it's the expected behavior for nested blocks

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

Please confirm which theme type you used for testing.

• Block
• Classic
• Hybrid (e.g. classic with theme.json)
• Not sure