Alternative fix for #3952 (#3970)

* [fix] make demo app work without JS

* alternative approach to #3965

* actually

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

Author: Rich-Harris

.changeset/calm-spiders-turn.md

@@ -0,0 +1,5 @@
+---
+'create-svelte': patch
+---
+
+make demo app work without JS

packages/create-svelte/templates/default/src/routes/todos/_api.ts

@@ -1,5 +1,5 @@
 /*
-	This module is used by the /todos endpoint to 
+	This module is used by the /todos endpoint to
 	make calls to api.svelte.dev, which stores todos
 	for each user. The leading underscore indicates that this is
 	a private module, _not_ an endpoint — visiting /todos/_api
@@ -11,9 +11,9 @@
 
 const base = 'https://api.svelte.dev';
 
-export async function api(request: Request, resource: string, data?: Record<string, unknown>) {
+export function api(method: string, resource: string, data?: Record<string, unknown>) {
 	return fetch(`${base}/${resource}`, {
-		method: request.method,
+		method,
 		headers: {
 			'content-type': 'application/json'
 		},

packages/create-svelte/templates/default/src/routes/todos/index.ts

@@ -1,9 +1,9 @@
 import { api } from './_api';
 import type { RequestHandler } from '@sveltejs/kit';
 
-export const get: RequestHandler = async ({ request, locals }) => {
+export const get: RequestHandler = async ({ locals }) => {
 	// locals.userid comes from src/hooks.js
-	const response = await api(request, `todos/${locals.userid}`);
+	const response = await api('get', `todos/${locals.userid}`);
 
 	if (response.status === 404) {
 		// user hasn't created a todo list.
@@ -15,7 +15,7 @@ export const get: RequestHandler = async ({ request, locals }) => {
 		};
 	}
 
-	if (response.ok) {
+	if (response.status === 200) {
 		return {
 			body: {
 				todos: await response.json()
@@ -31,22 +31,37 @@ export const get: RequestHandler = async ({ request, locals }) => {
 export const post: RequestHandler = async ({ request, locals }) => {
 	const form = await request.formData();
 
-	return api(request, `todos/${locals.userid}`, {
+	await api('post', `todos/${locals.userid}`, {
 		text: form.get('text')
 	});
+
+	return {};
+};
+
+// If the user has JavaScript disabled, the URL will change to
+// include the method override unless we redirect back to /todos
+const redirect = {
+	status: 303,
+	headers: {
+		location: '/todos'
+	}
 };
 
 export const patch: RequestHandler = async ({ request, locals }) => {
 	const form = await request.formData();
 
-	return api(request, `todos/${locals.userid}/${form.get('uid')}`, {
+	await api('patch', `todos/${locals.userid}/${form.get('uid')}`, {
 		text: form.has('text') ? form.get('text') : undefined,
 		done: form.has('done') ? !!form.get('done') : undefined
 	});
+
+	return redirect;
 };
 
 export const del: RequestHandler = async ({ request, locals }) => {
 	const form = await request.formData();
 
-	return api(request, `todos/${locals.userid}/${form.get('uid')}`);
+	await api('delete', `todos/${locals.userid}/${form.get('uid')}`);
+
+	return redirect;
 };