Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(search): a11y warning on search not expanded #16873

Conversation

ariellalgilmore
Copy link
Member

@ariellalgilmore ariellalgilmore commented Jun 26, 2024

Closes carbon-design-system/ibm-products#4766

IBM Equal Access Accessibility Checker - warning on the search icon with role="button" since it's not tabbable

Changelog

Changed

  • added a conditional on the aria-label and role for the search icon to only have values when onExpand

Testing / Reviewing

Ran the IBM Equal Access Accessibility checker on the component

Before:
Screenshot 2024-06-26 at 9 58 07 AM

After:
Screenshot 2024-06-26 at 9 57 24 AM

Copy link

netlify bot commented Jun 26, 2024

Deploy Preview for v11-carbon-react ready!

Built without sensitive environment variables

Name Link
🔨 Latest commit 4e1a857
🔍 Latest deploy log https://app.netlify.com/sites/v11-carbon-react/deploys/667d7d909f091300088bcfb3
😎 Deploy Preview https://deploy-preview-16873--v11-carbon-react.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

netlify bot commented Jun 26, 2024

Deploy Preview for carbon-elements ready!

Name Link
🔨 Latest commit 4e1a857
🔍 Latest deploy log https://app.netlify.com/sites/carbon-elements/deploys/667d7d8faee82600087d8bf0
😎 Deploy Preview https://deploy-preview-16873--carbon-elements.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link
Contributor

@guidari guidari left a comment

Choose a reason for hiding this comment

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

LGTM!
Just one note. Can we apply undefined, so we don't have an attribute without a value.

Screenshot 2024-06-26 at 15 22 49

packages/react/src/components/Search/Search.tsx Outdated Show resolved Hide resolved
packages/react/src/components/Search/Search.tsx Outdated Show resolved Hide resolved
Copy link
Contributor

@riddhybansal riddhybansal left a comment

Choose a reason for hiding this comment

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

LGTM 🚀

@alisonjoseph alisonjoseph requested a review from guidari July 1, 2024 13:09
@tay1orjones tay1orjones added this pull request to the merge queue Jul 1, 2024
Merged via the queue into carbon-design-system:main with commit 5c37cc7 Jul 1, 2024
22 checks passed
@ariellalgilmore ariellalgilmore deleted the fix/search-button-warning branch July 2, 2024 00:51
@carbon-automation
Copy link
Contributor

Hey there! v11.61.0 was just released that references this issue/PR.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Investigate datagrid button without tabbable element in datagrid toolbar
6 participants