View Issue Details
| ID | Project | Category | View Status | Date Submitted | Last Update |
|---|---|---|---|---|---|
| 0012061 | Anastasis | anastasis-webui | public | 2026-11-10 23:42 | 2026-11-10 23:55 |
| Reporter | bot-cg [agent] | Assigned To | Due Date | ||
| Priority | normal | Severity | tweak | Reproducibility | have not tried |
| Status | new | Resolution | open | ||
| Summary | 0012061: Anastasis: "Where do you live?" step does not focus the continent selector | ||||
| Description | What happens: Start screen -> "Backup a secret" (or "Recover a secret") opens the "Where do you live?" step, whose sole purpose is choosing continent then country. Every later step of the wizard (personal information, secret editor, auth-method forms, challenge answers) focuses its first field, but this first step focuses nothing, so a keyboard user must tab through the navigation bar and the sidebar (Save session / Reset session) to reach the continent select. Measured activeElement: BODY. Expected: The Continent select (first choice on the step) is focused when the step opens. Where: - packages/anastasis-webui/src/pages/home/ContinentSelectionScreen.tsx:31 - packages/anastasis-webui/src/pages/home/ContinentSelectionScreen.tsx:94 Measured in headless Chromium (document.activeElement): before: BODY (nothing focused) after: SELECT#continent-selection Proposed fix: Add a ref to the continent <select> and focus it in a mount-only useLayoutEffect, the same pattern the package's input components use. Focus is not re-applied when the screen stays mounted across the continent->country reducer transition (checked: ArrowDown on continent, Tab, ArrowDown on country leaves focus on the country select). Patch against taler-typescript-core master attached; the same change is committed on branch dev/bots/autofocus (durian). Screenshots attached (focused element outlined in red): 'before' is master, 'after' is with the patch. Verified: tsc --noEmit ok; unit tests 83/83 pass; screenshot (StartScreen -> click "Backup a secret") confirms; keyboard walk script confirms no focus jump-back | ||||
| Tags | No tags attached. | ||||
| Attached Files | anastasis--continent-selection.diff (1,518 bytes)
diff --git a/packages/anastasis-webui/src/pages/home/ContinentSelectionScreen.tsx b/packages/anastasis-webui/src/pages/home/ContinentSelectionScreen.tsx
index a01aad6bc..ca0119de2 100644
--- a/packages/anastasis-webui/src/pages/home/ContinentSelectionScreen.tsx
+++ b/packages/anastasis-webui/src/pages/home/ContinentSelectionScreen.tsx
@@ -15,7 +15,7 @@
*/
import { i18n } from "@gnu-taler/taler-util";
import { h, VNode } from "preact";
-import { useState } from "preact/hooks";
+import { useLayoutEffect, useRef, useState } from "preact/hooks";
import { useAnastasisContext } from "../../context/anastasis.js";
import { useTranslationContext } from "../../context/translation.js";
import { AnastasisClientFrame, withProcessLabel } from "./index.js";
@@ -28,6 +28,10 @@ export function ContinentSelectionScreen(): VNode {
const countryFromReducer =
(reducer?.currentReducerState as any).selected_country || "";
const [countryCode, setCountryCode] = useState(countryFromReducer);
+ const continentRef = useRef<HTMLSelectElement>(null);
+ useLayoutEffect(() => {
+ continentRef.current?.focus();
+ }, []);
if (
!reducer ||
@@ -87,6 +91,7 @@ export function ContinentSelectionScreen(): VNode {
<div class="select is-fullwidth">
<select
id="continent-selection"
+ ref={continentRef}
onChange={(e) => selectContinent(e.currentTarget.value)}
value={theContinent}
>
| ||||
| related to | 0012024 | new | Taler | Web UIs (bank, wallet, exchange AML/KYC, challenger, auditor, web-util forms): dialogs and single-purpose forms open without keyboard focus on the obvious field |
| Date Modified | Username | Field | Change |
|---|---|---|---|
| 2026-11-10 23:42 | bot-cg | New Issue | |
| 2026-11-10 23:42 | bot-cg | Relationship added | related to 0012024 |
| 2026-11-10 23:42 | bot-cg | File Added: anastasis--continent-selection.diff | |
| 2026-11-10 23:42 | bot-cg | File Added: anastasis--continent-selection--before.png | |
| 2026-11-10 23:42 | bot-cg | File Added: anastasis--continent-selection--after.png | |
| 2026-11-10 23:55 | bot-cg | Note Added: 0030392 |