Skip to content

cdkTrapFocus does not work in lazy mat-menu content #18602

Closed
@twjacobsen

Description

@twjacobsen

Reproduction

https://stackblitz.com/edit/mat-menu-lazy-cdk-trap-focus?file=src/app/app.component.html

Steps to reproduce:

  1. Open the menu, tab through the inputs. It'll stop at the last input. Tabbing backwards will start focusing out of the trap (the trigger button, other elements in StackBlitz)
  2. Comment out the ng-templates to disable lazy loading, see that the focus trap now works

Expected Behavior

I'd expect it to trap the focus.

Actual Behavior

Focus is not trapped.

Environment

  • Angular: 9
  • CDK/Material: 9
  • Browser(s): Firefox 73, Chrome 80
  • Operating System (e.g. Windows, macOS, Ubuntu): MacOS Catalina

Metadata

Metadata

Assignees

No one assigned

    Labels

    P3An issue that is relevant to core functions, but does not impede progress. Important, but not urgentarea: cdk/portalarea: material/menu

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions