Skip to content

fix(VOverlay): always return focus to activator on Escape key#22755

Open
mixelburg wants to merge 4 commits intovuetifyjs:masterfrom
mixelburg:fix/menu-escape-focus-22560
Open

fix(VOverlay): always return focus to activator on Escape key#22755
mixelburg wants to merge 4 commits intovuetifyjs:masterfrom
mixelburg:fix/menu-escape-focus-22560

Conversation

@mixelburg
Copy link
Copy Markdown
Contributor

Fixes #22560

Problem

Keyboard focus was lost after closing a v-menu (or any overlay) with the Escape key in certain scenarios:

  • Menu opened by clicking a button but focus was not yet captured inside the content (e.g. before the user tabbed in)
  • Coordinate-based menus where the activator element is not keyboard-focusable

Root cause: The focus-return logic in VOverlay.onKeydown was gated behind a check that the active element was inside the overlay content at the time Escape was pressed:

// Before
if (contentEl.value?.contains(document.activeElement)) {
  activatorEl.value?.focus()
}

When focus was outside the content (e.g. still on the page body), the activator was never re-focused.

Fix

Remove the conditional so focus always returns to the activator when Escape closes an overlay:

// After
activatorEl.value?.focus()

If the activator is not focusable (e.g. a plain <div> used for coordinate-based menus), the focus() call is a silent no-op — same behaviour as before for those cases. For button-based activators this ensures focus is reliably returned.

Also adds a browser test covering this scenario.

mixelburg and others added 4 commits March 24, 2026 22:17
Previously, focus was only returned to the activator element when the
active element was inside the overlay content at the time Escape was pressed.
This caused focus to be lost when:
- The menu was opened via click but focus was not captured into the content
- The activator is not keyboard-focusable (e.g. coordinate-positioned menus)

Always attempt to return focus to the activator on Escape. If the activator
is not focusable (no tabIndex), the focus() call is a no-op, preserving
existing behaviour for coordinate-based menus.

Fixes vuetifyjs#22560
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Keyboard focus is getting lost after closing the menu control using escape key in windows.

1 participant