View Issue Details
| ID | Project | Category | View Status | Date Submitted | Last Update |
|---|---|---|---|---|---|
| 0012062 | 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 | 0012062: Anastasis: "New/Edit recovery policy" form does not focus its first provider selector | ||||
| Description | What happens: Backup flow, "Review recovery policies": clicking "Add new policy" (or a policy's edit button) replaces the page with the "New recovery policy" / "Edit recovery policy" form (one provider <select> per authorization method, Cancel/Reset/Confirm). The clicked button is unmounted and nothing is focused. Measured activeElement: BODY. Expected: The first provider select is focused, so the user can start choosing providers from the keyboard (create/edit form rule: first field). Where: - packages/anastasis-webui/src/pages/home/EditPoliciesScreen.tsx:50 - packages/anastasis-webui/src/pages/home/EditPoliciesScreen.tsx:161 Measured in headless Chromium (document.activeElement): before: BODY (nothing focused) after: SELECT (provider for the first authorization method) Proposed fix: Attach a ref to the select of the first authorization method and focus it in a mount-only useLayoutEffect. No-op when there are no authorization methods. 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 (story EditingAPolicy renders); screenshot (ReviewPoliciesScreen -> click "Add new policy") confirms | ||||
| Tags | No tags attached. | ||||
| Attached Files | anastasis--edit-policy.diff (1,444 bytes)
diff --git a/packages/anastasis-webui/src/pages/home/EditPoliciesScreen.tsx b/packages/anastasis-webui/src/pages/home/EditPoliciesScreen.tsx
index 49c7deea2..674cf0b7e 100644
--- a/packages/anastasis-webui/src/pages/home/EditPoliciesScreen.tsx
+++ b/packages/anastasis-webui/src/pages/home/EditPoliciesScreen.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 { authMethods, KnownAuthMethods } from "./authMethod/index.js";
import { AnastasisClientFrame } from "./index.js";
@@ -47,6 +47,10 @@ export function EditPoliciesScreen({
confirm,
}: Props): VNode {
const [changedProvider, setChangedProvider] = useState<Array<string>>([]);
+ const firstSelectRef = useRef<HTMLSelectElement>(null);
+ useLayoutEffect(() => {
+ firstSelectRef.current?.focus();
+ }, []);
const reducer = useAnastasisContext();
if (!reducer) {
@@ -154,6 +158,7 @@ export function EditPoliciesScreen({
<span>
<span class="select ">
<select
+ ref={index === 0 ? firstSelectRef : undefined}
onChange={(e) => changeProviderTo(e.currentTarget.value)}
value={providerURL ?? ""}
>
| ||||
| 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--edit-policy.diff | |
| 2026-11-10 23:42 | bot-cg | File Added: anastasis--edit-policy--before.png | |
| 2026-11-10 23:42 | bot-cg | File Added: anastasis--edit-policy--after.png | |
| 2026-11-10 23:55 | bot-cg | Note Added: 0030393 |