fix: reset form inputs by default when using remote form functions (#14322)

Fixes a weird inconsistency: Full page reloads clear the form fields, but when using JS to enhance it (which happens by default) it's no longer resetting. This fixes that. If you enhance you still can decide which way you want to go.

Author: dummdidumm

.changeset/twelve-turkeys-reply.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+fix: reset form inputs by default when using remote form functions

packages/kit/src/runtime/client/remote-functions/form.svelte.js

@@ -210,7 +210,7 @@ export function form(id) {
 			};
 		};
 
-		instance.onsubmit = form_onsubmit(({ submit }) => submit());
+		instance.onsubmit = form_onsubmit(({ submit, form }) => submit().then(() => form.reset()));
 
 		/** @param {Parameters<RemoteForm<any>['buttonProps']['enhance']>[0]} callback */
 		const form_action_onclick = (callback) => {
@@ -247,7 +247,7 @@ export function form(id) {
 			type: 'submit',
 			formmethod: 'POST',
 			formaction: action,
-			onclick: form_action_onclick(({ submit }) => submit())
+			onclick: form_action_onclick(({ submit, form }) => submit().then(() => form.reset()))
 		};
 
 		Object.defineProperty(button_props, 'enhance', {

packages/kit/test/apps/basics/test/test.js

@@ -1605,6 +1605,7 @@ test.describe('remote functions', () => {
 		await page.fill('#input-task', 'hi');
 		await page.click('#submit-btn-one');
 		await expect(page.locator('#form-result-1')).toHaveText('hi');
+		await expect(page.locator('#input-task')).toHaveValue('');
 	});
 
 	test('form error works', async ({ page }) => {