[fix] handle paths consistently between dev and various production adapters (#2171)

* [fix] handle paths consistently between dev and various production adapters

* decode only once

Author: benmccann

.changeset/brave-seas-invent.md

@@ -0,0 +1,6 @@
+---
+'@sveltejs/adapter-node': patch
+'@sveltejs/kit': patch
+---
+
+[fix] handle paths consistently between dev and various production adapters

packages/adapter-node/package.json

@@ -25,6 +25,7 @@
 		"tiny-glob": "^0.2.9"
 	},
 	"devDependencies": {
+		"@polka/url": "^1.0.0-next.15",
 		"@rollup/plugin-json": "^4.1.0",
 		"@sveltejs/kit": "workspace:*",
 		"c8": "^7.7.2",

packages/adapter-node/src/server.js

@@ -3,6 +3,7 @@ import compression from 'compression';
 import fs from 'fs';
 import { dirname, join } from 'path';
 import polka from 'polka';
+import { parse } from '@polka/url';
 import sirv from 'sirv';
 import { fileURLToPath } from 'url';
 
@@ -38,7 +39,14 @@ export function createServer({ render }) {
 		  })
 		: noop_handler;
 
-	const server = polka().use(
+	const server = polka();
+	// Polka has a non-standard behavior of decoding the request path
+	// Disable it so that adapter-node works just like the rest
+	// SvelteKit will handle decoding URI components into req.params
+	server.parse = (req) => {
+		return parse(req, false);
+	};
+	server.use(
 		compression({ threshold: 0 }),
 		assets_handler,
 		prerendered_handler,

packages/adapter-node/tests/smoke.js

@@ -46,4 +46,18 @@ test('responses with the rendered status code', async () => {
 	server.server.close();
 });
 
+test('passes through umlaut as encoded path', async () => {
+	const server = await startServer({
+		render: (incoming) => {
+			return {
+				status: 200,
+				body: incoming.path
+			};
+		}
+	});
+	const res = await fetch(`http://localhost:${PORT}/%C3%BCber-uns`);
+	assert.equal(await res.text(), '/%C3%BCber-uns');
+	server.server.close();
+});
+
 test.run();

packages/kit/src/core/dev/index.js

@@ -330,7 +330,7 @@ async function create_handler(vite, config, dir, cwd, manifest) {
 						headers: /** @type {import('types/helper').Headers} */ (req.headers),
 						method: req.method,
 						host,
-						path: decodeURI(parsed.pathname),
+						path: parsed.pathname,
 						query: parsed.searchParams,
 						rawBody: body
 					},

packages/kit/src/core/preview/index.js

@@ -83,7 +83,7 @@ export async function preview({
 						req.headers[config.kit.hostHeader || 'host']),
 					method: req.method,
 					headers: /** @type {import('types/helper').Headers} */ (req.headers),
-					path: parsed.pathname ? decodeURIComponent(parsed.pathname) : '',
+					path: parsed.pathname ? parsed.pathname : '',
 					query: new URLSearchParams(parsed.query || ''),
 					rawBody: body
 				});

packages/kit/src/runtime/client/router.js

@@ -168,9 +168,10 @@ export class Router {
 	 */
 	parse(url) {
 		if (this.owns(url)) {
-			const path = decodeURIComponent(url.pathname.slice(this.base.length) || '/');
+			const path = url.pathname.slice(this.base.length) || '/';
 
-			const routes = this.routes.filter(([pattern]) => pattern.test(path));
+			const decoded = decodeURI(path);
+			const routes = this.routes.filter(([pattern]) => pattern.test(decoded));
 
 			const query = new URLSearchParams(url.search);
 			const id = `${path}?${query}`;

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

@@ -28,7 +28,7 @@ export async function respond(incoming, options, state = {}) {
 			return {
 				status: 301,
 				headers: {
-					location: encodeURI(path + (q ? `?${q}` : ''))
+					location: path + (q ? `?${q}` : '')
 				}
 			};
 		}
@@ -57,7 +57,7 @@ export async function respond(incoming, options, state = {}) {
 				}
 
 				for (const route of options.manifest.routes) {
-					if (!route.pattern.test(request.path)) continue;
+					if (!route.pattern.test(decodeURI(request.path))) continue;
 
 					const response =
 						route.type === 'endpoint'

packages/kit/test/apps/basics/src/routes/encoded/_tests.js

@@ -5,8 +5,8 @@ export default function (test) {
 	test('visits a route with non-ASCII character', '/encoded', async ({ page, clicknav }) => {
 		await clicknav('[href="/encoded/苗条"]');
 		assert.equal(await page.innerHTML('h1'), 'static');
-		assert.equal(await page.innerHTML('h2'), '/encoded/苗条');
-		assert.equal(await page.innerHTML('h3'), '/encoded/苗条');
+		assert.equal(decodeURI(await page.innerHTML('h2')), '/encoded/苗条');
+		assert.equal(decodeURI(await page.innerHTML('h3')), '/encoded/苗条');
 	});
 
 	test(
@@ -15,17 +15,17 @@ export default function (test) {
 		async ({ page, clicknav }) => {
 			await clicknav('[href="/encoded/土豆"]');
 			assert.equal(await page.innerHTML('h1'), 'dynamic');
-			assert.equal(await page.innerHTML('h2'), '/encoded/土豆: 土豆');
-			assert.equal(await page.innerHTML('h3'), '/encoded/土豆: 土豆');
+			assert.equal(decodeURI(await page.innerHTML('h2')), '/encoded/土豆: 土豆');
+			assert.equal(decodeURI(await page.innerHTML('h3')), '/encoded/土豆: 土豆');
 		}
 	);
 
 	test('redirects correctly with non-ASCII location', '/encoded', async ({ page, clicknav }) => {
 		await clicknav('[href="/encoded/反应"]');
 
 		assert.equal(await page.innerHTML('h1'), 'static');
-		assert.equal(await page.innerHTML('h2'), '/encoded/苗条');
-		assert.equal(await page.innerHTML('h3'), '/encoded/苗条');
+		assert.equal(decodeURI(await page.innerHTML('h2')), '/encoded/苗条');
+		assert.equal(decodeURI(await page.innerHTML('h3')), '/encoded/苗条');
 	});
 
 	test('sets charset on JSON Content-Type', null, async ({ fetch }) => {