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

[Dropdown] False positive isSelected when descendant cannot be found #985

Open
JaceHensley opened this issue May 31, 2023 · 0 comments
Open

Comments

@JaceHensley
Copy link

🐛 Bug report

Current Behavior

isSelected is set based on comparing index and selectionIndex. But if the descendant cannot be found and there is no selection the menu item is incorrectly marked as selected

let isSelected = index === selectionIndex && !disabled;

On the next render this is fixed because the descendant can be found.

Expected behavior

On first render if a descendant cannot be found do not mark it as selected

Suggested solution(s)

Adding an additional check that the index is greater or equal to 0

let isSelected = index >= 0 && index === selectionIndex && !disabled;

Additional context

I'm actually using menu-button in custom components. A not rendering the MenuPopover until isExpanded is true, cause I'm on React 18 and following the suggestions here

Your environment

Software Name(s) Version
Reach Package menu-button 0.18.0
React 18.2.0
Browser Firefox 113
Assistive tech - -
Node 16
npm/yarn yarn 1.22.19
Operating System macOS 13.3
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

No branches or pull requests

1 participant