View Issue Details

IDProjectCategoryView StatusLast Update
0012008Talermerchant portal webuipublic2026-11-10 23:43
Reporterbot-cg [agent] Assigned ToResolution deadline
ImplementerReviewer 
Release signed byDeployed by 
VerifierCommunicatorCM_7  
Data protection authority notification requiredNo  
CSIRT notification requiredNo  
Estimated effort (hours)Actual effort (hours)0 
Fast-trackNo
Work packagenone
PrioritynormalSeveritytweakReproducibilityhave not tried
Status newResolutionopen 
Summary0012008: Merchant: first-run 'Set up this merchant server' form does not focus Business name
DescriptionWhat happens:
Standalone first-run page (no instances yet) with one form; the account ID field is fixed ('admin', disabled) and nothing is focused (BODY).

Expected:
Focus Business name, the first field to fill.

Where:
  - packages/taler-merchant-webui/src/screens/BootstrapInstanceScreen.tsx:46

Measured in headless Chromium (document.activeElement):
  before: BODY
  after: INPUT#bootstrap-business-name

Proposed fix:
Ref on #bootstrap-business-name focused on mount.

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; eslint clean; screenshot confirms
TagsNo tags attached.
Attached Files
merchant-a--bootstrap-instance.diff (1,617 bytes)   
diff --git a/packages/taler-merchant-webui/src/screens/BootstrapInstanceScreen.tsx b/packages/taler-merchant-webui/src/screens/BootstrapInstanceScreen.tsx
index 2cea2f2f6..7541a60f0 100644
--- a/packages/taler-merchant-webui/src/screens/BootstrapInstanceScreen.tsx
+++ b/packages/taler-merchant-webui/src/screens/BootstrapInstanceScreen.tsx
@@ -9,7 +9,7 @@
 
 import { ActionFooter } from "../ui/FormActionFooter.js";
 import type { VNode } from "preact";
-import { useRef, useState } from "preact/hooks";
+import { useEffect, useRef, useState } from "preact/hooks";
 import type { TalerMerchantApi } from "@gnu-taler/taler-util";
 import { useTranslation } from "../context/translation.js";
 import { ApiErrorBanner } from "../ui/ApiErrorBanner.js";
@@ -41,6 +41,12 @@ export function BootstrapInstanceScreen({
   const [error, setError] = useState<unknown>();
   const [pending, setPending] = useState(false);
   const submissionLock = useRef(false);
+  // The account identifier is fixed, so the business name is the first thing
+  // this page asks for.
+  const businessNameInput = useRef<HTMLInputElement>(null);
+  useEffect(() => {
+    businessNameInput.current?.focus();
+  }, []);
 
   const submit = async (event: Event) => {
     event.preventDefault();
@@ -134,6 +140,7 @@ export function BootstrapInstanceScreen({
                 {t`Business name`}
               </label>
               <input
+                ref={businessNameInput}
                 id="bootstrap-business-name"
                 value={businessName}
                 onInput={(event) => setBusinessName(event.currentTarget.value)}

Required notifications

Address or linkRemarkAdded byNotifiedActions

Relationships

child of 0012002 new Merchant portal: dialogs, PIN/code prompts and single-purpose forms open without keyboard focus on the obvious field 

Activities

Issue History

Date ModifiedUsernameFieldChange
2026-11-10 23:41bot-cgNew Issue
2026-11-10 23:41bot-cgRelationship addedchild of 0012002
2026-11-10 23:43bot-cgFile Added: merchant-a--bootstrap-instance.diff
2026-11-10 23:43bot-cgFile Added: merchant-a--bootstrap-instance--before.png
2026-11-10 23:43bot-cgFile Added: merchant-a--bootstrap-instance--after.png