Skip to content

[Bug]: MenuItem is not correctly focused when expanded within ComposedModal #16861

Description

Package

@carbon/react

Browser

Chrome

Package version

v1.60.0

React version

v18.2

Description

We are trying to use MenuButton within ComposedModal and found a strange bug. When you click the MenuButton to expand the menu, it should focus on the first menu item. However, the other button is being focused which is triggered by ComposedModal.

See the call stack below. (handleBlur and wrapFocus are from ComposedModal.)
image

Reproduction/example

https://stackblitz.com/edit/github-yzyrus?file=src%2FApp.jsx

Steps to reproduce

Click the MenuButton (Click me and you will see above button being focused!) and you will see the above button is focused. The console prints out the call stack too.

Suggested Severity

Severity 2 = User cannot complete task, and/or no workaround within the user experience of a given component.

Application/PAL

IBM SOAR

Code of Conduct

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

Metadata

Assignees

Type

Projects

  • Status

    🏗 In Progress

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions