Skip to content

[Bug]: unable to set focus to a MenuButton via the Modal launcherButtonRef prop #18992

@rileydanejohnston

Description

@rileydanejohnston

Package

@carbon/react

Browser

Chrome

Package version

1.56.0

React version

19.X

Description

I'm unable to set focus to a MenuButton via the Modal launcherButtonRef prop. (although it works if I set focus to other carbon components like a Button). The AVT team opened an issue saying the actions menu which opened a modal should receive focus when that modal closes. Here's the description from the AVT team:

Issue description: On closing the dialogs, the focus is moving back to the SIDE navigation links

Recommended fix: On closing the dialogs, the focus should return to the 'Actions' menu only as it is the element which triggered the dialogs

User impact: When the focus is not set on a logical point in the page after a user action, it creates a great deal of confusion. The whole process of navigating back to the relevant element can be tedious. note this defect mainly impacts keyboard-only users and those with cognitive disabilities.

This issue also impacts CPC components like the PageHeaderActionsPanel as it is a wrapper for the MenuButton component.

Reproduction/example

https://stackblitz.com/edit/vitejs-vite-n6qycnhx?file=src%2FApp.jsx

Steps to reproduce

  1. open stackblitz
  2. click actions menu
  3. click first action
  4. click cancel or the close button
  5. actions menu is not in focus

Suggested Severity

Severity 3 = User can complete task, and/or has a workaround within the user experience of a given component.

Application/PAL

No response

Code of Conduct

Metadata

Metadata

Assignees

No one assigned

    Type

    Severity

    None yet

    Projects

    Status
    ✅ Done

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions