From 501f32b9aee201c1df46ba1e0f77a37b3901a1a0 Mon Sep 17 00:00:00 2001
From: Dotty Dotter <dotty@Mac.wideopen.space>
Date: Sat, 9 May 2026 00:58:30 +0200
Subject: [PATCH] fix(quellen): Suchformular bricht fetch durch Form-Submit ab
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Bug: ``runSearch`` ist async und returnt damit Promise<false>. Im
Inline-Handler ``onsubmit="return runSearch(event)"`` interpretiert der
Browser den Promise als truthy → Default-Form-Submit läuft an, die
Page navigiert, und der gerade abgesetzte fetch bricht mit
"Failed to fetch" ab. Im echten Browser merkt man's beim Klick auf
"Suchen" oder Enter im Suchfeld: Status bleibt auf "Suche läuft …"
hängen, keine Ergebnisse erscheinen.

Fix: Bindung über ``addEventListener('submit', ...)`` mit
``event.preventDefault()`` synchron vor dem async runSearch-Aufruf.
JS-Direktaufruf von ``runSearch()`` (z.B. bei Filter-Wechsel)
funktioniert weiterhin.

Gefunden bei E2E-Browser-Smoketest mit Playwright.
---
 app/templates/v2/screens/quellen.html | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/app/templates/v2/screens/quellen.html b/app/templates/v2/screens/quellen.html
index a75dd93..9e35f57 100644
--- a/app/templates/v2/screens/quellen.html
+++ b/app/templates/v2/screens/quellen.html
@@ -196,7 +196,7 @@
     Wortunscharf — Endungen sind egal, verwandte Begriffe werden ebenfalls
     gefunden.
   </p>
-  <form id="quellen-search-form" class="search-box" onsubmit="return runSearch(event)">
+  <form id="quellen-search-form" class="search-box">
     <input type="text" id="quellen-q" name="q" placeholder="z.B. Klimaschutz, soziale Gerechtigkeit, Mietpreisbremse"
            autocomplete="off" minlength="2" maxlength="200">
     <button type="submit" id="quellen-q-btn">Suchen</button>
@@ -380,8 +380,21 @@ async function runSearch(ev) {
   return false;
 }
 
-// Re-Run bei Filter-Wechsel, wenn schon eine Query da ist
+// Form-Submit + Filter-Wechsel binden
 document.addEventListener('DOMContentLoaded', () => {
+  // Wichtig: `runSearch` ist async, returnt Promise<false>. Das ist truthy,
+  // also würde `onsubmit="return runSearch(event)"` das Default-Submit
+  // NICHT verhindern und der fetch würde mit "Failed to fetch" abbrechen,
+  // weil die Page navigiert. Stattdessen via addEventListener binden — da
+  // ist `event.preventDefault()` synchron geblieben, bevor der Promise
+  // resolvt.
+  const form = document.getElementById('quellen-search-form');
+  if (form) {
+    form.addEventListener('submit', (ev) => {
+      ev.preventDefault();
+      runSearch();
+    });
+  }
   document.querySelectorAll('input[name="qfilter"]').forEach(r => {
     r.addEventListener('change', () => {
       const q = (document.getElementById('quellen-q') || {}).value || '';