You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Fixes a critical keyboard accessibility bug in <sp-menu selects="multiple">: Double-toggle bug: Space/Enter keys toggled selection twice, making items appear unselectable
Problem
Users reported that keyboard interaction was broken for multiple selection menus:
Pressing Space/Enter would select then immediately deselect items
Pattern effectively unusable for keyboard-only users
Changes
1. Fixed double-toggle in Menu.ts
File:packages/menu/src/Menu.ts
The keyboard handler was calling selectOrToggleItem() twice - once through .click() and once directly:
if (key === ' ' || key === 'Enter') {
event.preventDefault();
+ // The click() method already triggers selection via handlePointerBasedSelection+ // so we don't need to call selectOrToggleItem again here.
root?.focusElement?.click();
- if (root) this.selectOrToggleItem(root);
return;
}
Motivation and context
Related issue(s)
fixes [Issue Number]
Screenshots (if appropriate)
Author's checklist
I have read the CONTRIBUTING and PULL_REQUESTS documents.
I have reviewed at the Accessibility Practices for this feature, see: Aria Practices
I have added automated tests to cover my changes.
I have included a well-written changeset if my change needs to be published.
I have included updated documentation if my change required it.
Reviewer's checklist
Includes a Github Issue with appropriate flag or Jira ticket number without a link
Includes thoughtfully written changeset if changes suggested include patch, minor, or major features
Automated tests cover all use cases and follow best practices for writing
Validated on all supported browsers
All VRTs are approved before the author can update Golden Hash
Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.
This PR includes no changesets
When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types
If the changes are expected, update the current_golden_images_cache hash in the circleci config to accept the new images. Instructions are included in that file.
If the changes are unexpected, you can investigate the cause of the differences and update the code accordingly.
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
Fixes a critical keyboard accessibility bug in
<sp-menu selects="multiple">:Double-toggle bug: Space/Enter keys toggled selection twice, making items appear unselectable
Problem
Users reported that keyboard interaction was broken for multiple selection menus:
Changes
1. Fixed double-toggle in Menu.ts
File:
packages/menu/src/Menu.tsThe keyboard handler was calling
selectOrToggleItem()twice - once through.click()and once directly:if (key === ' ' || key === 'Enter') { event.preventDefault(); + // The click() method already triggers selection via handlePointerBasedSelection + // so we don't need to call selectOrToggleItem again here. root?.focusElement?.click(); - if (root) this.selectOrToggleItem(root); return; }Motivation and context
Related issue(s)
Screenshots (if appropriate)
Author's checklist
Reviewer's checklist
patch,minor, ormajorfeaturesManual review test cases
Descriptive Test Statement
Device review