fix: allow commands from within endpoints (#14343)

* fix: allow commands from within endpoints

fixes #14325

* limit commands to post/put/patch/delete

* fix

* tweak

---------

Co-authored-by: Rich Harris <[email protected]>

Author: dummdidumm

.changeset/sour-vans-fix.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+fix: allow commands from within endpoints

packages/kit/src/runtime/app/server/remote/command.js

@@ -64,7 +64,13 @@ export function command(validate_or_fn, maybe_fn) {
 	const wrapper = (arg) => {
 		const { event, state } = get_request_store();
 
-		if (!event.isRemoteRequest) {
+		if (state.is_endpoint_request) {
+			if (!['POST', 'PUT', 'PATCH', 'DELETE'].includes(event.request.method)) {
+				throw new Error(
+					`Cannot call a command (\`${__.name}(${maybe_fn ? '...' : ''})\`) from a ${event.request.method} handler`
+				);
+			}
+		} else if (!event.isRemoteRequest) {
 			throw new Error(
 				`Cannot call a command (\`${__.name}(${maybe_fn ? '...' : ''})\`) during server-side rendering`
 			);

packages/kit/src/runtime/server/endpoint.js

@@ -41,6 +41,8 @@ export async function render_endpoint(event, event_state, mod, state) {
 		}
 	}
 
+	event_state.is_endpoint_request = true;
+
 	try {
 		const response = await with_request_store({ event, state: event_state }, () =>
 			handler(/** @type {import('@sveltejs/kit').RequestEvent<Record<string, any>>} */ (event))

packages/kit/src/types/internal.d.ts

@@ -598,6 +598,7 @@ export interface RequestState {
 	form_instances?: Map<any, any>;
 	remote_data?: Record<string, MaybePromise<any>>;
 	refreshes?: Record<string, Promise<any>>;
+	is_endpoint_request?: boolean;
 }
 
 export interface RequestStore {

packages/kit/test/apps/basics/src/routes/remote/server-endpoint/+page.svelte

@@ -0,0 +1,23 @@
+<script>
+	let result = $state('');
+</script>
+
+<p>{result}</p>
+
+<button
+	onclick={() =>
+		fetch('/remote/server-endpoint/api')
+			.then((r) => r.json())
+			.then((r) => (result = r.result))}
+>
+	get
+</button>
+
+<button
+	onclick={() =>
+		fetch('/remote/server-endpoint/api', { method: 'POST' })
+			.then((r) => r.json())
+			.then((r) => (result = r.result))}
+>
+	post
+</button>

packages/kit/test/apps/basics/src/routes/remote/server-endpoint/api/+server.ts

@@ -0,0 +1,12 @@
+import { json } from '@sveltejs/kit';
+import { add, get } from '../internal.remote';
+
+export async function GET() {
+	const result = await get();
+	return json({ result });
+}
+
+export async function POST() {
+	const result = await add(1);
+	return json({ result });
+}

packages/kit/test/apps/basics/src/routes/remote/server-endpoint/internal.remote.ts

@@ -0,0 +1,9 @@
+import { command, query } from '$app/server';
+
+export const get = query(() => {
+	return 'get';
+});
+
+export const add = command('unchecked', () => {
+	return 'post';
+});

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

@@ -1754,6 +1754,16 @@ test.describe('remote functions', () => {
 		expect(request_count).toBe(1); // no query refreshes, since that happens as part of the command response
 	});
 
+	test('query/command inside endpoint works', async ({ page }) => {
+		await page.goto('/remote/server-endpoint');
+
+		await page.getByRole('button', { name: 'get' }).click();
+		await expect(page.locator('p')).toHaveText('get');
+
+		await page.getByRole('button', { name: 'post' }).click();
+		await expect(page.locator('p')).toHaveText('post');
+	});
+
 	test('form.enhance works', async ({ page }) => {
 		await page.goto('/remote/form');
 		await page.fill('#input-task-enhance', 'abort');