View Issue Details

IDProjectCategoryView StatusLast Update
0012017Talermerchant 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
PrioritynormalSeverityminorReproducibilityhave not tried
Status newResolutionopen 
Summary0012017: Merchant: Schedule a Report form does not focus its Description field
DescriptionWhat happens:
Reports -> '+ Schedule report' opens the create form (#/reports/new). Nothing is focused (BODY).

Expected:
The first field to fill, Description (#rep_desc_in), has focus.

Where:
  - packages/taler-merchant-webui/src/screens/ScheduleReportScreen.tsx:95
  - packages/taler-merchant-webui/src/screens/ScheduleReportScreen.tsx:182

Measured in headless Chromium (document.activeElement):
  before: BODY
  after: INPUT#rep_desc_in[text]

Proposed fix:
useRef on the description input and a mount-only effect that focuses it.

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 for file; eslint/prettier clean; screens.test.js passes; screenshot confirms; tutorial chapter 14 preview does not steal focus (guard case)
TagsNo tags attached.
Attached Files
merchant-b--schedule-report-screen.diff (1,370 bytes)   
diff --git a/packages/taler-merchant-webui/src/screens/ScheduleReportScreen.tsx b/packages/taler-merchant-webui/src/screens/ScheduleReportScreen.tsx
index 14d32615f..892616635 100644
--- a/packages/taler-merchant-webui/src/screens/ScheduleReportScreen.tsx
+++ b/packages/taler-merchant-webui/src/screens/ScheduleReportScreen.tsx
@@ -24,7 +24,7 @@
  */
 
 import type { VNode } from "preact";
-import { useEffect, useMemo, useState } from "preact/hooks";
+import { useEffect, useMemo, useRef, useState } from "preact/hooks";
 import { useLocation } from "wouter-preact";
 import { Header } from "../ui/Header.js";
 import { useTranslation } from "../context/translation.js";
@@ -91,6 +91,12 @@ export function ScheduleReportScreen({
     }
   }, [reportSenderProgram, generatorEntries]);
 
+  // The description is the first thing this form asks for.
+  const descInput = useRef<HTMLInputElement>(null);
+  useEffect(() => {
+    descInput.current?.focus();
+  }, []);
+
   const done = () => setLocation("/reports/scheduled");
 
   const handleSubmit = async (e: Event) => {
@@ -173,6 +179,7 @@ export function ScheduleReportScreen({
             </label>
             <input
               {...fieldProps("rep_desc_in")}
+              ref={descInput}
               id="rep_desc_in"
               type="text"
               placeholder={t`e.g. Weekly sales summary`}

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-b--schedule-report-screen.diff
2026-11-10 23:43bot-cgFile Added: merchant-b--schedule-report-screen--before.png
2026-11-10 23:43bot-cgFile Added: merchant-b--schedule-report-screen--after.png