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

@W-12627159 - Use aria-disabled in pagination prev and next buttons #1570

Merged
merged 2 commits into from
Nov 28, 2023

Conversation

adamraya
Copy link
Collaborator

@adamraya adamraya commented Nov 28, 2023

Description

The previous and next pagination buttons must have the attribute aria-disabled='true' when disabled to enable users who cannot perceive color to determine that these links are disabled.

Types of Changes

  • Bug fix (non-breaking change that fixes an issue)
  • New feature (non-breaking change that adds functionality)
  • Documentation update
  • Breaking change (could cause existing functionality to not work as expected)
  • Other changes (non-breaking changes that does not fit any of the above)

Breaking changes include:

  • Removing a public function or component or prop
  • Adding a required argument to a function
  • Changing the data type of a function parameter or return value
  • Adding a new peer dependency to package.json

Changes

  • Added aria-disabled='true' to prev and next buttons.

How to Test-Drive This PR

  • Enable VoiceOver
  • Start template-retail-react-app locally, load http://localhost:3000/ and navigate to the PLP.
  • Confirm the Prev button disabled includes the aria-disabled=true label and VoiceOver indicates the item is dimmed.
  • Navigate to the last page and confirm the Next button also includes the aria-disabled=true label and VoiceOver indicates the item is dimmed.
Screenshot 2023-11-28 at 10 01 45 AM

Checklists

General

  • Changes are covered by test cases
  • CHANGELOG.md updated with a short description of changes (not required for documentation updates)

Accessibility Compliance

You must check off all items in one of the follow two lists:

  • There are no changes to UI

or...

Localization

  • Changes include a UI text update in the Retail React App (which requires translation)

@adamraya adamraya requested a review from a team as a code owner November 28, 2023 17:20
@adamraya adamraya merged commit b86e225 into develop Nov 28, 2023
20 checks passed
@adamraya adamraya deleted the a11y-prev-next-buttons branch November 28, 2023 18:28
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants