Fix geo blocking form losing rules when switching tabs or collapsing accordion

Radix UI Tabs and Accordion unmount inactive/closed content from the DOM
by default. This caused hidden form inputs to be missing from FormData on
submit — saving while on the Block tab wiped all Allow rules (and vice
versa), and saving with the advanced accordion collapsed wiped redirect
URL, trusted proxies, and response settings.

Fix by adding forceMount to TabsContent and AccordionContent so all form
fields remain in the DOM regardless of which tab/panel is visible.

Also adds E2E regression tests covering both scenarios plus the RFC1918
preset, with proper afterEach cleanup to prevent test interference with
concurrent workers.

Fixes #99

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
fuomag9
2026-04-11 16:34:31 +02:00
parent eee4c7b718
commit f9169c2ab2
2 changed files with 173 additions and 3 deletions

View File

@@ -689,10 +689,10 @@ export function GeoBlockFields({ initialValues, showModeSelector = true }: GeoBl
<TabsTrigger value="block" className="flex-1">Block Rules</TabsTrigger>
<TabsTrigger value="allow" className="flex-1">Allow Rules</TabsTrigger>
</TabsList>
<TabsContent value="block" className="mt-4">
<TabsContent value="block" forceMount className="mt-4 data-[state=inactive]:hidden">
<RulesPanel prefix="block" initial={initial} resetKey={resetKey} />
</TabsContent>
<TabsContent value="allow" className="mt-4">
<TabsContent value="allow" forceMount className="mt-4 data-[state=inactive]:hidden">
<p className="text-xs text-muted-foreground mb-3">
Allow rules take precedence over block rules.
</p>
@@ -707,7 +707,7 @@ export function GeoBlockFields({ initialValues, showModeSelector = true }: GeoBl
<AccordionTrigger className="px-4 py-2.5 text-sm font-medium hover:no-underline">
Trusted Proxies &amp; Block Response
</AccordionTrigger>
<AccordionContent className="px-4 pb-4">
<AccordionContent forceMount className="px-4 pb-4 data-[state=closed]:hidden">
<div className="flex flex-col gap-4">
<TagInput
name="geoblock_trusted_proxies"