fix: prevent silent save failure in admin settings form
The settings form contains multiple <input type="url"> fields that lack a name attribute. When a field value fails browser URL validation, the browser silently blocks form submission without showing an error — no network request is made, and the user sees no feedback. Root cause: HTML5 form validation requires a focusable element with a name attribute to surface errors. Without it, validation fails silently. Fix: - Add novalidate to the <form> to disable browser-native URL validation - Add an isValidHttpUrl() helper in saveSettings() to replicate the same checks the backend performs - Optional URL fields (frontend_url, doc_url): auto-clear invalid values instead of blocking the save, matching backend behaviour (these fields accept empty string without error) - purchase_subscription_url: block save with a clear error message when enabled + invalid; auto-clear when disabled to prevent the backend 400 "Purchase Subscription URL must be an absolute http(s) URL" error Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -7,7 +7,7 @@
|
||||
</div>
|
||||
|
||||
<!-- Settings Form -->
|
||||
<form v-else @submit.prevent="saveSettings" class="space-y-6">
|
||||
<form v-else @submit.prevent="saveSettings" class="space-y-6" novalidate>
|
||||
<!-- Tab Navigation -->
|
||||
<div class="sticky top-0 z-10 overflow-x-auto settings-tabs-scroll">
|
||||
<nav class="settings-tabs">
|
||||
@@ -2198,6 +2198,35 @@ async function saveSettings() {
|
||||
return
|
||||
}
|
||||
|
||||
// Validate URL fields — novalidate disables browser-native checks, so we validate here
|
||||
const isValidHttpUrl = (url: string): boolean => {
|
||||
if (!url) return true
|
||||
try {
|
||||
const u = new URL(url)
|
||||
return u.protocol === 'http:' || u.protocol === 'https:'
|
||||
} catch {
|
||||
return false
|
||||
}
|
||||
}
|
||||
// Optional URL fields: auto-clear invalid values so they don't cause backend 400 errors
|
||||
if (!isValidHttpUrl(form.frontend_url)) form.frontend_url = ''
|
||||
if (!isValidHttpUrl(form.doc_url)) form.doc_url = ''
|
||||
// Purchase URL: required when enabled; auto-clear when disabled to avoid backend rejection
|
||||
if (form.purchase_subscription_enabled) {
|
||||
if (!form.purchase_subscription_url) {
|
||||
appStore.showError(t('admin.settings.purchase.url') + ': URL is required when purchase is enabled')
|
||||
saving.value = false
|
||||
return
|
||||
}
|
||||
if (!isValidHttpUrl(form.purchase_subscription_url)) {
|
||||
appStore.showError(t('admin.settings.purchase.url') + ': must be an absolute http(s) URL (e.g. https://example.com)')
|
||||
saving.value = false
|
||||
return
|
||||
}
|
||||
} else if (!isValidHttpUrl(form.purchase_subscription_url)) {
|
||||
form.purchase_subscription_url = ''
|
||||
}
|
||||
|
||||
const payload: UpdateSettingsRequest = {
|
||||
registration_enabled: form.registration_enabled,
|
||||
email_verify_enabled: form.email_verify_enabled,
|
||||
|
||||
Reference in New Issue
Block a user