Skip to content

ContextualMenu cannot be closed with ESCAPE key when inside a Modal #1305

@jmuzina

Description

@jmuzina

The ContextualMenu, when rendered inside a modal (see story) cannot be closed with the Escape key. In other ContextualMenu stories, pressing Escape closes the menu; however this is not the case inside Modals.

To reproduce

  1. Open a page with a contextual menu rendered inside of a modal.
  2. Open the contextual menu.
  3. Press Escape.
  4. Notice that the contextual menu does not close.

Expected behavior

Pressing the escape button when inside a focus trapped element (whether it be a modal, context menu, etc) causes the focus-trapped element to be dismissed (and ideally, for focus to be returned to the element that was triggered to open the focus trap per WCAG).

The above likely implies we would need some sort of global focus stack so that we can dismiss the right element and return focus to the correct element whenever focus-trap elements are closed (otherwise components that register Escape-to-close keylisteners will enter a race condition). I'm not sure if we have such a solution in place at the moment.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions