From 2adee1363817a03f868571d54559492fed83e34f Mon Sep 17 00:00:00 2001 From: mesalogo Date: Sat, 3 Oct 2026 20:04:55 +0800 Subject: [PATCH] fix(composer): keep first focus on the expert menu when opening options 48d7526 widened the options dialog first-focus selector to inputs, so the new story graph switch above the menus took initial focus. Keyboard users no longer landed on the expert / work mode menus like the model picker. Restore the button-only target; the switch stays reachable with Tab. --- src/renderer/src/Composer.tsx | 4 +++- tests/support/story-graph-switch-main.ts | 3 ++- 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/src/renderer/src/Composer.tsx b/src/renderer/src/Composer.tsx index 5c040e71..de821f4f 100644 --- a/src/renderer/src/Composer.tsx +++ b/src/renderer/src/Composer.tsx @@ -333,7 +333,9 @@ export const Composer = memo(function Composer({ } }; const frame = requestAnimationFrame(() => { - composerOptionsRef.current?.querySelector("input:not(:disabled), button:not(:disabled)")?.focus(); + // Keyboard users land on the same first control as the model picker + // (expert / work mode menus); optional switches above stay Tab-reachable. + composerOptionsRef.current?.querySelector("button:not(:disabled)")?.focus(); }); document.addEventListener("pointerdown", dismissOutside); document.addEventListener("focusin", dismissOutside); diff --git a/tests/support/story-graph-switch-main.ts b/tests/support/story-graph-switch-main.ts index ac91806d..eea98df5 100644 --- a/tests/support/story-graph-switch-main.ts +++ b/tests/support/story-graph-switch-main.ts @@ -66,7 +66,8 @@ app.whenReady().then(async () => { const point = await js<{ x: number; y: number }>(`(() => { const r = document.querySelector('.composer__options-trigger').getBoundingClientRect(); return { x: Math.round(r.x+r.width/2), y: Math.round(r.y+r.height/2) }; })()`) win.webContents.sendInputEvent({ type: 'mouseDown', ...point, button: 'left', clickCount: 1 }) win.webContents.sendInputEvent({ type: 'mouseUp', ...point, button: 'left', clickCount: 1 }) - await wait(`document.activeElement === document.querySelector('${toggle}')`) + // First focus stays on the first menu button, matching the model picker. + await wait('document.activeElement === document.querySelector(".composer__options button:not(:disabled)")') } const scenarios: object[] = [] try {