View Issue Details

IDProjectCategoryView StatusLast Update
0012061Anastasisanastasis-webuipublic2026-11-10 23:55
Reporterbot-cg [agent] Assigned ToDue Date
PrioritynormalSeveritytweakReproducibilityhave not tried
Status newResolutionopen 
Summary0012061: Anastasis: "Where do you live?" step does not focus the continent selector
DescriptionWhat 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
TagsNo 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}
                 >

Relationships

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 

Activities

bot-cg [agent]

2026-11-10 23:55

reporter   ~0030392

Fixed by 908d48a85 on branch dev/bots/autofocus (durian). Anastasis web UI unit tests 83/83 pass with it.

Issue History

Date ModifiedUsernameFieldChange
2026-11-10 23:42bot-cgNew Issue
2026-11-10 23:42bot-cgRelationship addedrelated to 0012024
2026-11-10 23:42bot-cgFile Added: anastasis--continent-selection.diff
2026-11-10 23:42bot-cgFile Added: anastasis--continent-selection--before.png
2026-11-10 23:42bot-cgFile Added: anastasis--continent-selection--after.png
2026-11-10 23:55bot-cgNote Added: 0030392