SalesforceCommerceCloud / pwa-kit

React-based JavaScript frontend framework to create a progressive web app (PWA) storefront for Salesforce B2C Commerce.
https://developer.salesforce.com/docs/commerce/pwa-kit-managed-runtime/guide/pwa-kit-overview.html
BSD 3-Clause "New" or "Revised" License
283 stars 130 forks source link

[BUG][Accessibility] Fix Tab index Size Swatches on Product Detail Page #1832

Closed bendvc closed 3 months ago

bendvc commented 3 months ago

Description

There have been some changes with the swatch components. This resulted in some side effects on the product detail page where you could not select a "size" based on the swatch components not having a tab index. This happened because we weren't by default setting the tabIndex of the first swatch if there was no selection. This PR fixes this issue.

Types of Changes

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

How to Test-Drive This PR

Checklists

General

Accessibility Compliance

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

or...

Localization

vcua-mobify commented 3 months ago

I can tab and focus on the first size swatch but it took me a bit to realize that I should be using the left/right buttons to switch sizes rather than trying to tab to a different size 😅

alexvuong commented 3 months ago

Please add changlog for this PR.