Keyboard escape hides focus on Button ContextMenu

[prakhar241]

Hello, I see a behavior where the focus is hidden when I press escape through keyboard - the button that has contextual menu.

This hides the focus may be because this is treated as button, but keyboard escape should not hide the focus, and make it visible. Actually if I remove js-focus-visible CSS, the mentioned button/contextual menu works fine.

Before writing additional CSS to gain focus, I want to confirm if you want to see this behavior and suggest if there is any resolution.

[Justineo]

I believe this issue is related to your problem: https://github.com/WICG/focus-visible/issues/88

[prakhar241]

Thanks @Justineo for mentioning the issue. This seems old thread where many things are fixed. Checking threads. We are using "focus-visible": "^5.2.0".

Given that, is there a way to fix this issue for button contextual menu? The desired experience is that the keyboard escape button should not hide focus. It should skip overriding outline style for buttons for keyboard navigations. Attaching the override CSS -

[prakhar241]

Writing new CSS override for outline, would trigger it for mouse events as well. Also, writing the code to detect the key 'escape', and then change focus on button, might be more than what could be done here.