fix Clashing endpoint-powered pages break route sorting(#4038)

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

@@ -86,8 +86,8 @@ function generate_client_manifest(manifest_data, base) {
 
 					// optional items
 					if (params || route.shadow) tuple.push(params || 'null');
-					if (route.shadow) tuple.push('1');
 
+					if (route.shadow) tuple.push('1', `'${route.key}'`);
 					return `// ${route.a[route.a.length - 1]}\n\t\t[${tuple.join(', ')}]`;
 				}
 			})

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

@@ -261,22 +261,26 @@ export default function create_manifest_data({
 
 	walk(config.kit.files.routes, [], [], [], [layout], [error]);
 
-	// merge matching page/endpoint pairs into shadowed pages
-	let i = routes.length;
-	while (i--) {
-		const route = routes[i];
-		const prev = routes[i - 1];
-
-		if (prev && prev.key === route.key) {
-			if (prev.type !== 'endpoint' || route.type !== 'page') {
-				const relative = path.relative(cwd, path.resolve(config.kit.files.routes, prev.key));
-				throw new Error(`Duplicate route files: ${relative}`);
-			}
-
-			route.shadow = prev.file;
-			routes.splice(--i, 1);
+	const pages = new Map();
+	/**@type {number[]}**/
+	const ends = [];
+	routes.forEach((route, i) => {
+		const { key, type } = route;
+		if (type === 'page') {
+			pages.set(key, route);
+		} else {
+			ends.unshift(i);
 		}
-	}
+	});
+	ends.forEach((i) => {
+		const endpoint = routes[i];
+		const page = pages.get(endpoint.key);
+		if (page) {
+			// @ts-ignore
+			page.shadow = endpoint.file;
+			routes.splice(i, 1);
+		}
+	});
 
 	const assets = fs.existsSync(config.kit.files.assets)
 		? list_files({ config, dir: config.kit.files.assets, path: '' })

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

@@ -105,7 +105,9 @@ export async function create_plugin(config, cwd) {
 						}),
 						routes: manifest_data.routes.map((route) => {
 							if (route.type === 'page') {
+								/**@type import('types').SSRPage**/
 								return {
+									key: route.key,
 									type: 'page',
 									pattern: route.pattern,
 									params: get_params(route.params),
@@ -119,7 +121,7 @@ export async function create_plugin(config, cwd) {
 									b: route.b.map((id) => manifest_data.components.indexOf(id))
 								};
 							}
-
+							/**@type import('types').SSREndpoint**/
 							return {
 								type: 'endpoint',
 								pattern: route.pattern,

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

@@ -71,6 +71,7 @@ export function generate_manifest(
 				${routes.map(route => {
 					if (route.type === 'page') {
 						return `{
+						  key: '${route.key}',
 							type: 'page',
 							pattern: ${route.pattern},
 							params: ${get_params(route.params)},

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

@@ -718,7 +718,7 @@ export class Renderer {
 			if (cached) return cached;
 		}
 
-		const [pattern, a, b, get_params, has_shadow] = route;
+		const [pattern, a, b, get_params, has_shadow, routeKey] = route;
 		const params = get_params
 			? // the pattern is for the route which we've already matched to this path
 			  get_params(/** @type {RegExpExecArray}  */ (pattern.exec(path)))
@@ -775,12 +775,12 @@ export class Renderer {
 						const res = await fetch(
 							`${url.pathname}${url.pathname.endsWith('/') ? '' : '/'}__data.json${url.search}`,
 							{
+								// @ts-ignore
 								headers: {
-									'x-sveltekit-load': 'true'
+									'x-sveltekit-load': routeKey
 								}
 							}
 						);
-
 						if (res.ok) {
 							const redirect = res.headers.get('x-sveltekit-location');
 
@@ -791,7 +791,7 @@ export class Renderer {
 									state: this.current
 								};
 							}
-
+							if (res.status === 204) return;
 							props = await res.json();
 						} else {
 							status = res.status;

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

@@ -151,6 +151,38 @@ export async function respond(request, options, state = {}) {
 					event.url = new URL(event.url.origin + normalized + event.url.search);
 				}
 
+				const requestRouteKey = request.headers.get('x-sveltekit-load');
+				if (requestRouteKey !== null) {
+					const route = options.manifest._.routes.find(
+						(route) => route.type === 'page' && route.key === requestRouteKey
+					);
+					if (route) {
+						// @ts-ignore
+						const shadow = route.shadow;
+						if (shadow) {
+							const match = route.pattern.exec(decoded);
+							if (match) {
+								event.params = route.params ? decode_params(route.params(match)) : {};
+								const response = await render_endpoint(event, await shadow());
+								if (response) {
+									if (response.status >= 300 && response.status < 400) {
+										const location = response.headers.get('location');
+										if (location) {
+											const headers = new Headers(response.headers);
+											headers.set('x-sveltekit-location', location);
+											return new Response(undefined, {
+												status: 204,
+												headers
+											});
+										}
+									}
+									return response;
+								}
+							}
+						}
+					}
+				}
+
 				for (const route of options.manifest._.routes) {
 					const match = route.pattern.exec(decoded);
 					if (!match) continue;
@@ -164,7 +196,7 @@ export async function respond(request, options, state = {}) {
 						response = await render_endpoint(event, await route.shadow());
 
 						// loading data for a client-side transition is a special case
-						if (request.headers.get('x-sveltekit-load') === 'true') {
+						if (requestRouteKey !== null) {
 							if (response) {
 								// since redirects are opaque to the browser, we need to repackage
 								// 3xx responses as 200s with a custom header
@@ -183,11 +215,7 @@ export async function respond(request, options, state = {}) {
 							} else {
 								// TODO ideally, the client wouldn't request this data
 								// in the first place (at least in production)
-								response = new Response('{}', {
-									headers: {
-										'content-type': 'application/json'
-									}
-								});
+								return new Response(null, { status: 204 });
 							}
 						}
 					} else {
@@ -261,7 +289,6 @@ export async function respond(request, options, state = {}) {
 				throw new Error('request in handle has been replaced with event' + details);
 			}
 		});
-
 		// TODO for 1.0, change the error message to point to docs rather than PR
 		if (response && !(response instanceof Response)) {
 			throw new Error('handle must return a Response object' + details);

packages/kit/types/internal.d.ts

@@ -71,7 +71,14 @@ export type CSRComponent = any; // TODO
 
 export type CSRComponentLoader = () => Promise<CSRComponent>;
 
-export type CSRRoute = [RegExp, CSRComponentLoader[], CSRComponentLoader[], GetParams?, HasShadow?];
+export type CSRRoute = [
+	RegExp,
+	CSRComponentLoader[],
+	CSRComponentLoader[],
+	GetParams?,
+	HasShadow?,
+	string?
+];
 
 export interface EndpointData {
 	type: 'endpoint';
@@ -211,6 +218,7 @@ export interface SSREndpoint {
 	type: 'endpoint';
 	pattern: RegExp;
 	params: GetParams;
+
 	load(): Promise<{
 		[method: string]: RequestHandler;
 	}>;
@@ -236,7 +244,9 @@ export interface SSROptions {
 	dev: boolean;
 	floc: boolean;
 	get_stack: (error: Error) => string | undefined;
+
 	handle_error(error: Error & { frame?: string }, event: RequestEvent): void;
+
 	hooks: Hooks;
 	hydrate: boolean;
 	manifest: SSRManifest;
@@ -247,10 +257,13 @@ export interface SSROptions {
 	};
 	prefix: string;
 	prerender: boolean;
+
 	read(file: string): Buffer;
+
 	root: SSRComponent['default'];
 	router: boolean;
 	service_worker?: string;
+
 	template({
 		head,
 		body,
@@ -262,11 +275,13 @@ export interface SSROptions {
 		assets: string;
 		nonce: string;
 	}): string;
+
 	template_contains_nonce: boolean;
 	trailing_slash: TrailingSlash;
 }
 
 export interface SSRPage {
+	key: string;
 	type: 'page';
 	pattern: RegExp;
 	params: GetParams;