Improve consistency and accessibility of the Block placeholder variations picker #66062
Open
2 tasks done
Labels
[Focus] Accessibility (a11y)
Changes that impact accessibility and need corresponding review (e.g. markup changes).
[Package] Block editor
/packages/block-editor
[Package] Block library
/packages/block-library
[Type] Bug
An existing feature does not function as intended
Description
See conversation on #60206 and #60217
Re: the importance of having consistent block placeholders, see also #59275
Blocks that require some initial input / user choice for their initial configuration use a 'placeholder' UI. The design pattern for these placeholders is made of:
Also blocks that present a 'variations picker' in the placeholder (e.g. Columns and Query Loop) use this design pattern, except the Group block.
Why?
I'm not sure this inconsistency helps users in any way and I don't see any reason why the Group placeholder should not use the same design pattern of other blocks. Screenshot:
Additionally:
The variations picker for Columns, Query Loop, and Group have some long standing accessibility problems that need to be addressed. Most notably: the visible text mismatches the actual accessible name of the controls.
Labels and descriptions are used incorrectly on these variations pickers, mostly vor visual purposes. For semantics and accessibility, all interactive controls should:
aria-describedby
).Step-by-step reproduction instructions
Screenshots, screen recording, code snippet
No response
Environment info
No response
Please confirm that you have searched existing issues in the repo.
Please confirm that you have tested with all plugins deactivated except Gutenberg.
The text was updated successfully, but these errors were encountered: