Problem/Motivation
When creating a modal dialog (e.g., via an AJAX-enabled link), Drupal duplicates any form actions found within the modal content for display in a button pane at the bottom of the dialog. At present, only the following attributes are copied:
class
data-once
(see #3396887: Once is reset for ajax dialog buttons when dialog is opened)value
(or the element's inner HTML where available)
This poses a significant hurdle to providing accessible form actions, especially since HTML cannot be used within the value
attribute produced by submit/button render elements.
Steps to reproduce
- Create a form with an action that has one or more attributes listed below.
- Create a page with a link to the form which will open in a modal dialog.
- Click the link from the last step and observe that the duplicated button is missing the attribute(s) from the first step.
Proposed resolution
We should additionally copy the following attributes to the duplicated buttons:
aria-description
aria-details
aria-label
disabled
(allows the button to be disabled, which implicitly confers applicable accessibility information)title
(additionally allows a tool-tip to be displayed)
I've omitted aria-describedby
and aria-labelledby
for now since I don't think developers would intentionally create code that leaves dangling content in the modal content. The assumption is that developers would avoid using the button pane entirely in this case. I would be happy to include these, however, if the community believes they're also useful.
I've included aria-details
because the detail text could ostensibly apply to other things than just form actions.
Remaining tasks
Update core/misc/dialog/dialog.ajax.js
, specifically prepareDialogButtons()
in the dialog behavior.
User interface changes
Modal dialog buttons will be more accurately duplicated.
API changes
None.
Data model changes
None?
Release notes snippet
TBD