Skip to content

HeaderLabel: set accessible description#725

Merged
danirabbit merged 5 commits intomainfrom
danirabbit/headerlabel-accessibledescription
Jun 28, 2024
Merged

HeaderLabel: set accessible description#725
danirabbit merged 5 commits intomainfrom
danirabbit/headerlabel-accessibledescription

Conversation

@danirabbit
Copy link
Copy Markdown
Member

Properly set secondary text as a description

@danirabbit danirabbit requested a review from a team June 19, 2024 17:50
Copy link
Copy Markdown
Contributor

@zeebok zeebok left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This works as advertised though I wonder if it is better for the secondary text to become the description of the primary label, so it would be Name: Username and Description: Must be at least 8 characters long. Not sure how it all appears for the end user.

@danirabbit
Copy link
Copy Markdown
Member Author

@zeebok the labels themselves aren't actually available to the screen reader. So what happens is you have to set a mnemonic widget and then when that widget gets focus it reads out the accessible name, the type of widget, then the accessible description. So for example if the mnemonic widget was a text entry it would say:

"Username Text. Must be at least 8 characters long"

@zeebok
Copy link
Copy Markdown
Contributor

zeebok commented Jun 24, 2024

Gotcha. Looking via the Inspector it has the secondary text as a different label that is a sibling of the primary and so each one has its own name in the accessibility data tab, so I wasn't sure if that is how it will appear with the screen reader

@danirabbit
Copy link
Copy Markdown
Member Author

Oh hm yeah I'm not sure how the whole a11y tree stuff works, but I'll take a look at it!

@danirabbit
Copy link
Copy Markdown
Member Author

I'm gonna go ahead and merge this for now since after double checking with Florian it seems the label order is correct here

@danirabbit danirabbit merged commit c304382 into main Jun 28, 2024
@danirabbit danirabbit deleted the danirabbit/headerlabel-accessibledescription branch June 28, 2024 18:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: Done

Development

Successfully merging this pull request may close these issues.

2 participants