@sveltejs/kit 1.17.0 → 1.18.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sveltejs/kit",
-  "version": "1.17.0",
+  "version": "1.18.0",
   "description": "The fastest way to build Svelte apps",
   "repository": {
     "type": "git",

package/src/core/config/options.js

@@ -111,6 +111,11 @@ const options = object(
 				checkOrigin: boolean(true)
 			}),
 
+			dangerZone: object({
+				// TODO 2.0: Remove this
+				trackServerFetches: boolean(false)
+			}),
+
 			embedded: boolean(false),
 
 			env: object({

package/src/core/sync/write_server.js

@@ -34,6 +34,7 @@ export const options = {
 	app_template_contains_nonce: ${template.includes('%sveltekit.nonce%')},
 	csp: ${s(config.kit.csp)},
 	csrf_check_origin: ${s(config.kit.csrf.checkOrigin)},
+	track_server_fetches: ${s(config.kit.dangerZone.trackServerFetches)},
 	embedded: ${config.kit.embedded},
 	env_public_prefix: '${config.kit.env.publicPrefix}',
 	hooks: null, // added lazily, via \`get_hooks\`

package/src/exports/vite/dev/index.js

@@ -186,7 +186,9 @@ export async function dev(vite, vite_config, svelte_config) {
 								) {
 									try {
 										query.set('inline', '');
-										const mod = await vite.ssrLoadModule(`${url.pathname}${url.search}${url.hash}`);
+										const mod = await vite.ssrLoadModule(
+											`${decodeURI(url.pathname)}${url.search}${url.hash}`
+										);
 										styles[dep.url] = mod.default;
 									} catch {
 										// this can happen with dynamically imported modules, I think

package/src/runtime/app/forms.js

@@ -28,13 +28,20 @@ function warn_on_access(old_name, new_name, call_location) {
 	);
 }
 
+/**
+ * Shallow clone an element, so that we can access e.g. `form.action` without worrying
+ * that someone has added an `<input name="action">` (https://github.com/sveltejs/kit/issues/7593)
+ * @template {HTMLElement} T
+ * @param {T} element
+ * @returns {T}
+ */
+function clone(element) {
+	return /** @type {T} */ (HTMLElement.prototype.cloneNode.call(element));
+}
+
 /** @type {import('$app/forms').enhance} */
 export function enhance(form_element, submit = () => {}) {
-	if (
-		DEV &&
-		/** @type {HTMLFormElement} */ (HTMLFormElement.prototype.cloneNode.call(form_element))
-			.method !== 'post'
-	) {
+	if (DEV && clone(form_element).method !== 'post') {
 		throw new Error('use:enhance can only be used on <form> fields with method="POST"');
 	}
 
@@ -71,15 +78,25 @@ export function enhance(form_element, submit = () => {}) {
 
 		const action = new URL(
 			// We can't do submitter.formAction directly because that property is always set
-			// We do cloneNode for avoid DOM clobbering - https://github.com/sveltejs/kit/issues/7593
 			event.submitter?.hasAttribute('formaction')
 				? /** @type {HTMLButtonElement | HTMLInputElement} */ (event.submitter).formAction
-				: /** @type {HTMLFormElement} */ (HTMLFormElement.prototype.cloneNode.call(form_element))
-						.action
+				: clone(form_element).action
 		);
 
 		const form_data = new FormData(form_element);
 
+		if (DEV && clone(form_element).enctype !== 'multipart/form-data') {
+			for (const value of form_data.values()) {
+				if (value instanceof File) {
+					// TODO 2.0: Upgrade to `throw Error`
+					console.warn(
+						'Your form contains <input type="file"> fields, but is missing the `enctype="multipart/form-data"` attribute. This will lead to inconsistent behavior between enhanced and native forms. For more details, see https://github.com/sveltejs/kit/issues/9819. This will be upgraded to an error in v2.0.'
+					);
+					break;
+				}
+			}
+		}
+
 		const submitter_name = event.submitter?.getAttribute('name');
 		if (submitter_name) {
 			form_data.append(submitter_name, event.submitter?.getAttribute('value') ?? '');

package/src/runtime/server/data/index.js

@@ -76,7 +76,8 @@ export async function render_data(
 								}
 							}
 							return data;
-						}
+						},
+						track_server_fetches: options.track_server_fetches
 					});
 				} catch (e) {
 					aborted = true;

package/src/runtime/server/page/index.js

@@ -150,7 +150,8 @@ export async function render_page(event, page, options, manifest, state, resolve
 								if (parent) Object.assign(data, await parent.data);
 							}
 							return data;
-						}
+						},
+						track_server_fetches: options.track_server_fetches
 					});
 				} catch (e) {
 					load_error = /** @type {Error} */ (e);

package/src/runtime/server/page/load_data.js

@@ -10,10 +10,18 @@ import { validate_depends } from '../../shared.js';
  *   state: import('types').SSRState;
  *   node: import('types').SSRNode | undefined;
  *   parent: () => Promise<Record<string, any>>;
+ *   track_server_fetches: boolean;
  * }} opts
  * @returns {Promise<import('types').ServerDataNode | null>}
  */
-export async function load_server_data({ event, state, node, parent }) {
+export async function load_server_data({
+	event,
+	state,
+	node,
+	parent,
+	// TODO 2.0: Remove this
+	track_server_fetches
+}) {
 	if (!node?.server) return null;
 
 	let done = false;
@@ -51,7 +59,10 @@ export async function load_server_data({ event, state, node, parent }) {
 				);
 			}
 
-			uses.dependencies.add(url.href);
+			// TODO 2.0: Remove this
+			if (track_server_fetches) {
+				uses.dependencies.add(url.href);
+			}
 
 			return event.fetch(info, init);
 		},

package/src/runtime/server/page/respond_with_error.js

@@ -44,7 +44,8 @@ export async function respond_with_error({
 				event,
 				state,
 				node: default_layout,
-				parent: async () => ({})
+				parent: async () => ({}),
+				track_server_fetches: options.track_server_fetches
 			});
 
 			const server_data = await server_data_promise;

package/types/index.d.ts

@@ -343,6 +343,16 @@ export interface KitConfig {
 		 */
 		checkOrigin?: boolean;
 	};
+	/**
+	 * Here be dragons. Enable at your peril.
+	 */
+	dangerZone?: {
+		/**
+		 * Automatically add server-side `fetch`ed URLs to the `dependencies` map of `load` functions. This will expose secrets
+		 * to the client if your URL contains them.
+		 */
+		trackServerFetches?: boolean;
+	};
 	/**
 	 * Whether or not the app is embedded inside a larger app. If `true`, SvelteKit will add its event listeners related to navigation etc on the parent of `%sveltekit.body%` instead of `window`, and will pass `params` from the server rather than inferring them from `location.pathname`.
 	 * @default false

package/types/internal.d.ts

@@ -333,6 +333,7 @@ export interface SSROptions {
 	app_template_contains_nonce: boolean;
 	csp: ValidatedConfig['kit']['csp'];
 	csrf_check_origin: boolean;
+	track_server_fetches: boolean;
 	embedded: boolean;
 	env_public_prefix: string;
 	hooks: ServerHooks;