Add aria-controls and aria-describedby attribute options to the button component
#3088
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
johnny-m-young
force-pushed
the
add-aria-attribute-to-button
branch
from
ca16283 to
0c2ca0b
Compare
johnny-m-young
force-pushed
the
add-aria-attribute-to-button
branch
from
0c2ca0b to
29b8463
Compare
johnny-m-young
changed the title
johnny-m-young
force-pushed
the
add-aria-attribute-to-button
branch
from
29b8463 to
1ca5616
Compare
johnny-m-young
changed the title
johnny-m-young
changed the title
johnny-m-young
force-pushed
the
add-aria-attribute-to-button
branch
from
1ca5616 to
d1e1c40
Compare
johnny-m-young
force-pushed
the
add-aria-attribute-to-button
branch
from
d1e1c40 to
de89a07
Compare
johnny-m-young
force-pushed
the
add-aria-attribute-to-button
branch
from
de89a07 to
3b8d31e
Compare
andysellick
reviewed
Nov 29, 2022
app/views/govuk_publishing_components/components/docs/button.yml
Outdated
Show resolved
Hide resolved
app/views/govuk_publishing_components/components/docs/button.yml
Outdated
Show resolved
Hide resolved
johnny-m-young
force-pushed
the
add-aria-attribute-to-button
branch
from
b14a4f5 to
73a6c0a
Compare
johnny-m-young
changed the title
aria-controls and aria-describedby options to button component
johnny-m-young
force-pushed
the
add-aria-attribute-to-button
branch
from
73a6c0a to
b4cc68a
Compare
johnny-m-young
changed the title
aria-controls and aria-describedby options to button componentaria-controls and aria-describedby attribute options to the button component
This commit adds the aria-controls and aria-describedby attribute options to the button presenter. This will improve the usability of the button component for users of screenreaders. It also adds associated tests.
johnny-m-young
force-pushed
the
add-aria-attribute-to-button
branch
from
b4cc68a to
a7c6035
Compare
|
@andysellick thanks for the review, I've made the changes you flagged. Could you re-review this? |
andysellick
approved these changes
Nov 29, 2022
Merged
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What
Trello ticket link
Add aria-controls and aria-describedby attribute options to the button presenter.
Why
If aria-label is updated without changing focus it is not read out and so consequently cannot be used, instead the text of the button is read which is in some cases is not verbose enough for screenreaders. Adding aria-describedby makes the function of the button more clear.
The aria-controls attribute is used to signal to the screenreader the section of the page that is relevant when the button is pressed, enhancing screenreader user experience.