fix(ui): dialogs, menus and busy buttons keep the keyboard focus where it belongs
Measured in Chrome before each change: - A dialog opened from a menu lost its focus: the menu row ran its action and closed in one batch, and floating-ui's focus return (a microtask) moved the focus to the row BEHIND the confirm dialog's scrim 7 ms after it opened, where Enter activated the row. MenuItemList now closes first and runs the action a task later; the dialog also captures the row, not a dying menu item, as its restore target. - A side panel opened as a flyout collapsed the moment a dialog opened from inside it, unmounting the row the dialog hands the focus back to. useHoverFocusWithin holds while the focus is inside an aria-modal dialog. - ui/Button's loading state set native disabled; Chrome moved the focus of the pressed button to <body> and never gave it back. Loading is now aria-disabled with a click guard that also cancels implicit submission. - Escape/Enter in the playlist rail's rename field dropped the focus on <body>. The row refocuses from its ref callback when it re-attaches (a post-commit focus sticks; the earlier attempt ran before the button existed). - PlayerModal was the one aria-modal shell without the dialog contract: it is now named by its title, traps Tab, restores the focus to its opener and shares one counted body scroll lock with every dialog.
This commit is contained in:
@@ -108,13 +108,13 @@ describe("useContextMenu / ContextMenu", () => {
|
||||
expect(menuitems()).toEqual([]);
|
||||
});
|
||||
|
||||
it("selecting an item fires it and closes the menu", () => {
|
||||
it("selecting an item closes the menu, then fires it (see ActionMenu's order test)", async () => {
|
||||
const onSelect = vi.fn();
|
||||
renderList(() => [{ id: "a", label: "Remove", onSelect }]);
|
||||
fireEvent.contextMenu(row("alpha"));
|
||||
fireEvent.click(item("Remove"));
|
||||
expect(onSelect).toHaveBeenCalledTimes(1);
|
||||
expect(menuitems()).toEqual([]);
|
||||
await vi.waitFor(() => expect(onSelect).toHaveBeenCalledTimes(1));
|
||||
});
|
||||
|
||||
it("Shift+F10 opens it from the keyboard", () => {
|
||||
@@ -217,7 +217,7 @@ describe("useContextMenu / ContextMenu", () => {
|
||||
expect(menuitems()).toEqual(["Play", "Move to", "Watch later", "Homelab"]);
|
||||
});
|
||||
|
||||
it("choosing inside a submenu closes the WHOLE stack, not just the submenu", () => {
|
||||
it("choosing inside a submenu closes the WHOLE stack, not just the submenu", async () => {
|
||||
const chosen = vi.fn();
|
||||
renderList(() => [
|
||||
{ id: "play", label: "Play", onSelect: vi.fn() },
|
||||
@@ -226,8 +226,8 @@ describe("useContextMenu / ContextMenu", () => {
|
||||
fireEvent.contextMenu(row("alpha"));
|
||||
fireEvent.click(item("Move to"));
|
||||
fireEvent.click(item("Homelab"));
|
||||
expect(chosen).toHaveBeenCalledTimes(1);
|
||||
expect(menuitems()).toEqual([]);
|
||||
await vi.waitFor(() => expect(chosen).toHaveBeenCalledTimes(1));
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user