fix: handle target attribute on remote form redirects

.changeset/stale-poets-clap.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+fix: handles form target attribute in remote form redirects

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

@@ -238,7 +238,12 @@ export function form(id) {
 							refresh_queries(refreshes, updates);
 						}
 						// Use internal version to allow redirects to external URLs
-						void _goto(form_result.location, { invalidateAll }, 0);
+						const form_target = element?.getAttribute('target');
+						if (form_target === '_blank' || form_target === '_new') {
+							window.open(form_result.location, form_target);
+						} else {
+							void _goto(form_result.location, { invalidateAll }, 0);
+						}
 					} else {
 						throw new HttpError(form_result.status ?? 500, form_result.error);
 					}

packages/kit/test/apps/async/src/routes/remote/form/redirect-target/+page.svelte

@@ -0,0 +1,11 @@
+<script>
+	import { redirectForm } from './form.remote.ts';
+</script>
+
+<form {...redirectForm.for('blank')} target="_blank" data-testid="form-blank">
+	<button type="submit">Submit blank</button>
+</form>
+
+<form {...redirectForm.for('same')} data-testid="form-same">
+	<button type="submit">Submit same</button>
+</form>

packages/kit/test/apps/async/src/routes/remote/form/redirect-target/destination/+page.svelte

@@ -0,0 +1 @@
+<h1>destination</h1>

packages/kit/test/apps/async/src/routes/remote/form/redirect-target/form.remote.ts

@@ -0,0 +1,12 @@
+import { form } from '$app/server';
+import { redirect } from '@sveltejs/kit';
+import * as v from 'valibot';
+
+export const redirectForm = form(
+	v.object({
+		id: v.optional(v.string())
+	}),
+	() => {
+		redirect(307, '/remote/form/redirect-target/destination');
+	}
+);

packages/kit/test/apps/async/test/test.js

@@ -154,6 +154,47 @@ test.describe('remote functions', () => {
 		await page.waitForURL('/remote');
 	});
 
+	test('remote form redirect opens in new tab when target=_blank', async ({
+		page,
+		javaScriptEnabled
+	}) => {
+		test.skip(!javaScriptEnabled, 'remote forms require JavaScript');
+
+		await page.goto('/remote/form/redirect-target');
+
+		const popup_promise = page.waitForEvent('popup', { timeout: 5000 });
+
+		await page.locator('[data-testid="form-blank"] button').click();
+
+		const popup = await popup_promise;
+		await popup.waitForLoadState();
+
+		expect(popup.url()).toContain('/remote/form/redirect-target/destination');
+
+		expect(page.url()).toContain('/remote/form/redirect-target');
+		expect(page.url()).not.toContain('/destination');
+	});
+
+	test('remote form redirect navigates same tab without target=_blank', async ({
+		page,
+		javaScriptEnabled
+	}) => {
+		test.skip(!javaScriptEnabled, 'remote forms require JavaScript');
+
+		await page.goto('/remote/form/redirect-target');
+
+		let popup_opened = false;
+		page.on('popup', () => {
+			popup_opened = true;
+		});
+
+		await page.locator('form:not([target]) button').click();
+		await page.waitForURL('**/remote/form/redirect-target/destination');
+
+		expect(popup_opened).toBe(false);
+		expect(page.url()).toContain('/remote/form/redirect-target/destination');
+	});
+
 	test('form multiple submit buttons work', async ({ page, javaScriptEnabled }) => {
 		await page.goto('/remote/form/multiple-submit');