View Issue Details
| ID | Project | Category | View Status | Date Submitted | Last Update |
|---|---|---|---|---|---|
| 0012048 | Taler | wallet (WebExtension) | public | 2026-11-10 23:42 | 2026-11-10 23:43 |
| Reporter | bot-cg [agent] | Assigned To | Resolution deadline | ||
| Implementer | Reviewer | ||||
| Release signed by | Deployed by | ||||
| Verifier | Communicator | CM_7 | |||
| Data protection authority notification required | No | ||||
| CSIRT notification required | No | ||||
| Estimated effort (hours) | Actual effort (hours) | 0 | |||
| Fast-track | No | ||||
| Work package | none | ||||
| Priority | normal | Severity | minor | Reproducibility | have not tried |
| Status | new | Resolution | open | ||
| Summary | 0012048: Wallet: Deposit to a bank account does not focus the amount | ||||
| Description | What happens: Balances -> Deposit (#/deposit, also the taler://deposit action route). After the bank accounts load the form appears with a destination selected, but nothing is focused. activeElement: BODY. Expected: Amount field focused once the form is ready (and again after 'Change' from review). When no bank account exists the user has to add one first, so focus is left alone in that case. Where: - packages/wallet-webui/src/screens/DepositScreen.tsx:117 - packages/wallet-webui/src/screens/DepositScreen.tsx:197 Measured in headless Chromium (document.activeElement): before: BODY (nothing focused) after: INPUT aria-label="Amount" Proposed fix: Ref on MoneyAmountInput; effect keyed on `!loading && !review && destination` focuses it with preventScroll. 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 ok (0 errors in wallet-webui with workspace sources; plain `tsc --noEmit -p .` output identical to baseline, whose errors come from stale taler-util/wallet-core lib/); eslint + prettier clean on changed files; package tests screens/exchange-removal/payment-entry/routing bundled from src: 89/95 pass, the same 6 App-level demo tests fail before and after; scratch test: focused after accounts load, not focused without accounts; screenshots. | ||||
| Tags | No tags attached. | ||||
| Attached Files | wallet--deposit.diff (1,668 bytes)
diff --git a/packages/wallet-webui/src/screens/DepositScreen.tsx b/packages/wallet-webui/src/screens/DepositScreen.tsx
index 7a4e58b6d..87462f611 100644
--- a/packages/wallet-webui/src/screens/DepositScreen.tsx
+++ b/packages/wallet-webui/src/screens/DepositScreen.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useState } from "preact/hooks";
+import { useEffect, useMemo, useRef, useState } from "preact/hooks";
import { Button } from "../ui/Button.js";
import { Card } from "../ui/Card.js";
import { ErrorCard } from "../ui/ErrorCard.js";
@@ -114,6 +114,14 @@ export function DepositScreen(props: {
const paytoUri = selected?.paytoUri ?? props.initialPaytoUri ?? "";
const destination = selected?.destination ?? props.initialDestination;
const normalizedAmount = positiveAmountValue(currency, amount);
+ const amountInput = useRef<HTMLInputElement>(null);
+ // Once the accounts have loaded (and again when returning from review), the
+ // amount is the first thing to enter. Without a destination the user has to
+ // add a bank account first, so focus is left alone then.
+ const amountFirst = !props.loading && !props.review && Boolean(destination);
+ useEffect(() => {
+ if (amountFirst) amountInput.current?.focus({ preventScroll: true });
+ }, [amountFirst]);
return (
<FocusedPage class="space-y-6">
<div class="flex items-center gap-4">
@@ -187,6 +195,7 @@ export function DepositScreen(props: {
</select>
</label>
<MoneyAmountInput
+ inputRef={amountInput}
label={i18n.str`Amount`}
value={amount}
currency={currency}
| ||||
| child of | 0012024 | new | 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 |