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

bug(mat-menu): Don't focus first element on open menu programmatically. #25869

Closed
1 task
infacto opened this issue Oct 26, 2022 · 2 comments
Closed
1 task
Labels
needs triage This issue needs to be triaged by the team

Comments

@infacto
Copy link

infacto commented Oct 26, 2022

Is this a regression?

  • Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

demo

Ref. #15936 (closed but not accepted.) Allow an option for this if you insist. You can focus the mat-menu without focus an item.

Reproduction

Steps to reproduce:

  1. Create mat-menu.
  2. Open it in ts file with ViewChild on MatMenuTrigger.

Demo

Expected Behavior

Never focus an item on menu open. There is no primary item we want. You can always use the keyboard to focus. There is no need to focus an item. And if you really want it, why are no items focused when open via button matMenuTriggerFor? The first focused item looks ugly and confused the user.

Actual Behavior

When I click on a button with matMenuTriggerFor the menu opens without any item is focused. Great.
But if I open the same menu via the MatMenuTrigger from ts-file (openMenu), the first item is focused.

Environment

  • Angular: 14
  • CDK/Material: 14
  • Browser(s): Chrome 106
  • Operating System: Windows 10
@infacto infacto added the needs triage This issue needs to be triaged by the team label Oct 26, 2022
@zarend
Copy link
Contributor

zarend commented Oct 27, 2022

Hello @infacto ,

This is a duplicate of #15936, which was already closed. That's because ARIA requires focusing the first menu item when opening. I checked the ARIA WAI best practices for menu interaction pattern again:

When a menu opens, or when a menubar receives focus, keyboard focus is placed on the first item.

We're required to follow ARIA, and there is no requirement to not focus anything when the menu opens. For that reason, this is working as intended.

We hope the menu meets your needs. If you have specific requirements that are not satisfied, considering using the select component or a CDK primitive and building your own custom menu.

Please do not open another issue for this. If you believe this is closed in error, you can create a discussion and we can reconsider if there is enough feedback from the community.

-Zach

@zarend zarend closed this as completed Oct 27, 2022
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Nov 27, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
needs triage This issue needs to be triaged by the team
Projects
None yet
Development

No branches or pull requests

2 participants