fix(ListBoxTrigger): support title on ListBoxTrigger
#8094
Conversation
|
Deploy preview for carbon-elements ready! Built with commit ea91eda |
|
Deploy preview for carbon-components-react ready! Built without sensitive environment variables with commit ea91eda https://deploy-preview-8094--carbon-components-react.netlify.app |
| @@ -36,6 +36,7 @@ const ListBoxTrigger = ({ isOpen, translateWithId: t, ...rest }) => { | |||
| <button | |||
| {...rest} | |||
| aria-label={description} | |||
| title={description} | |||
There was a problem hiding this comment.
I think for the trigger we removed title based on one of Carolyn's suggestions. It seems like having both would basically repeat the same information twice for a screen reader user. I think an alternative she suggested was to use only title if we need to offer it (remove the `aria-label in this case). This was the comment IIRC: #6938 (comment)
There was a problem hiding this comment.
it is ok to keep the
<title>Close menu</title>for sighted mouse users, but please change it to<title>Close</title>(which is less verbose, and removes the confusing word "menu")
are you referring to this point?
on a side note, she and I briefly discussed this for #4185 / #8090 and from testing the combobox, multiselect, number input, etc it doesn't seem to be double speaking (in VO at least)
the current multiselect places the title under the SVG rather than the button itself, so that may be an option as well but right now it doesn't seem like either approach is causing VO to read twice
There was a problem hiding this comment.
@emyarod I'm not sure which screen reader it shows up in, just was going off of what Carolyn shared. Just was sharing that if we needed the title then we could just drop the aria-label altogether based on what she shared.
andreancardona
added
status: ready to merge 🎉
and removed
status: ready for review 👀
labels
related #8091
This PR adds
titlesupport to the ComboBoxListBoxTriggerand adds Storybook knobs to Dropdown and ComboBox for usingtranslateWithId(matching the multiselect story)Changelog
New
titleon ListBoxTriggerTesting / Reviewing
Ensure the
translateWithIdstorybook knobs work correctly for the listbox components