fix(web): hand focus to the enlarged text area, and name each button per field

Copilot review round 1 on #2109.

- Activating Enlarge from the keyboard unmounted the focused button and left
  focus on the document body, so the next Tab restarted at the top of the page.
  The text area now takes focus on mount, caret after the text already typed.
- Every field's enlarge button carried the same "Enlarge" name, so a form with
  several string arguments exposed indistinguishable controls. Each now reads
  "Enlarge <field label>". Queries that matched a field by its label alone are
  scoped to the textbox role, since the button's name now contains it too.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01JTHVxSu8AUgHRLvo1ntZ8H
Signed-off-by: cliffhall <cliff@futurescale.com>
This commit is contained in:
cliffhall 2026-08-24 09:25:50 -04:00
commit 925ff4de2f

View file

@ -111,7 +111,7 @@ describe("ToolsScreen", () => {
const rows = screen.getAllByText("get_weather");
await user.click(rows[1] as HTMLElement);
// The second copy's own field renders — the first copy's does not.
expect(screen.getByLabelText(/zip/i)).toBeInTheDocument();
expect(screen.getByRole("textbox", { name: /zip/i })).toBeInTheDocument();
expect(screen.queryByLabelText(/city/i)).toBeNull();
await user.click(screen.getByRole("button", { name: /Execute/ }));
@ -137,7 +137,7 @@ describe("ToolsScreen", () => {
renderWithMantine(<ControlledToolsScreen onCallTool={onCallTool} />);
await user.click(screen.getByText("gamma"));
// gamma seeds { mode: "fast" }; editing the field flows through onUiChange.
const field = screen.getByLabelText(/mode/i);
const field = screen.getByRole("textbox", { name: /mode/i });
await user.clear(field);
await user.type(field, "slow");
await user.click(screen.getByRole("button", { name: /Execute/ }));