Popovers with form controls for settings should use Cancel and Save buttons #63310
Labels
[Focus] Accessibility (a11y)
Changes that impact accessibility and need corresponding review (e.g. markup changes).
[Package] Editor
/packages/editor
[Type] Bug
An existing feature does not function as intended
Description
In the new Post summary panel, some settings previously placed within collapsible panels have been moved to Popovers.
This made more evident some pre-existing accessibility issues with this pattern, especially in terms of keyboard interaction.
There are some long established conventions when it comes to keyboard interaction and UI dialogs / popovers. To me, the two most important ones in this case are. As a user:
Instead, when usign the keyboard in most of these popovers the only way to close the popover is to press the Escape key or the X close button but that doesn't reverts or cancel. The changed values are already saved on the
onChange
event. This isn;t what I would expect.I'd like to collect some feedback from more accessibility specialists cc @joedolson. In my opinion, in this kind of popovers saving should always performed after an explicit user action. This is different from an input or other controls placed 'inline' in the UI, where it may make sense to save on change. The expectation in a popover or dialog is to explicitly Cancel or Save and I'd think the only way to improve the user experience and interaction is by adding Cancel and Save buttons.
A few screenshots of this design pattern in some of the editor popovers:
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.
Yes
Please confirm that you have tested with all plugins deactivated except Gutenberg.
Yes
The text was updated successfully, but these errors were encountered: