Merge branch 'main' of github.com:sveltejs/svelte.dev into feat/playground-add-sv-cmd

Author: jycouet

apps/svelte.dev/content/docs/kit/10-getting-started/30-project-structure.md

@@ -53,6 +53,7 @@ The `src` directory contains the meat of your project. Everything except `src/ro
 - `error.html` is the page that is rendered when everything else fails. It can contain the following placeholders:
   - `%sveltekit.status%` — the HTTP status
   - `%sveltekit.error.message%` — the error message
+  - `%sveltekit.version%` — the deployment version, which can be specified with the [`version`](configuration#version) configuration
 - `hooks.client.js` contains your client [hooks](hooks)
 - `hooks.server.js` contains your server [hooks](hooks)
 - `service-worker.js` contains your [service worker](service-workers)

packages/repl/src/lib/Input/ComponentSelector.svelte

@@ -182,7 +182,7 @@
 				<input
 					value={workspace.svelte_version}
 					placeholder="latest"
-					onchange={(ev) => (workspace.svelte_version = ev.currentTarget.value || 'latest')}
+					onchange={(ev) => workspace.set_svelte_version(ev.currentTarget.value || 'latest', true)}
 				/>
 			</label>
 

packages/repl/src/lib/Repl.svelte

@@ -127,8 +127,6 @@
 			...workspace.current!,
 			contents: migration!.code
 		});
-
-		rebundle();
 	}
 
 	let width = $state(0);
@@ -142,7 +140,7 @@
 		? new Bundler({
 				svelte_version: svelteVersion,
 				onversion: (version) => {
-					workspace.svelte_version = version;
+					workspace.set_svelte_version(version);
 					onversion?.(version);
 				},
 				onstatus: (message) => {

packages/repl/src/lib/Workspace.svelte.ts

@@ -407,14 +407,13 @@ export class Workspace {
 		selected?: string
 	) {
 		this.states.clear();
-		this.set(new_files, selected);
-
-		this.mark_saved();
-
 		this.#tailwind = options.tailwind;
 		this.#aliases = options.aliases;
 
-		const bundle = this.#onreset(new_files);
+		const bundle = this.set(new_files, selected);
+
+		this.mark_saved();
+
 		const diagnostics = this.#reset_diagnostics();
 
 		return Promise.all([bundle, diagnostics])
@@ -458,7 +457,7 @@ export class Workspace {
 			}
 		}
 
-		this.#onreset?.(this.files);
+		return this.#onreset?.(this.files);
 	}
 
 	unlink(view: EditorView) {
@@ -507,10 +506,12 @@ export class Workspace {
 		return this.#svelte_version;
 	}
 
-	set svelte_version(value) {
+	set_svelte_version(value: string, notify = false) {
 		this.#svelte_version = value;
-		this.#update_file(this.#current);
-		this.#reset_diagnostics();
+		if (notify) {
+			this.#update_file(this.#current);
+			this.#reset_diagnostics();
+		}
 	}
 
 	get vim() {

packages/repl/src/lib/workers/bundler/index.ts

@@ -76,7 +76,11 @@ self.addEventListener('message', async (event: MessageEvent<BundleMessageData>)
 
 					console.log('[bundle worker result]', result);
 
-					if (JSON.stringify(result.error) === JSON.stringify(ABORT)) return;
+					// error object might be augmented, see https://github.com/rollup/rollup/blob/76a3b8ede4729a71eb522fc29f7d550a4358827b/docs/plugin-development/index.md#thiserror,
+					// hence only check that the specific abort property we set is there
+					if ((result.error as any)?.svelte_bundler_aborted === ABORT.svelte_bundler_aborted) {
+						return;
+					}
 					if (result && uid === current_id) postMessage(result);
 				});
 			} catch (e) {
@@ -111,7 +115,7 @@ function get_svelte(svelte_version: string) {
 	return ready;
 }
 
-const ABORT = { aborted: true };
+const ABORT = { svelte_bundler_aborted: true };
 
 let previous: {
 	key: string;

packages/repl/src/lib/workers/bundler/plugins/commonjs.ts

@@ -42,6 +42,9 @@ const plugin: Plugin = {
 					context.next();
 				},
 				AssignmentExpression: (node, context) => {
+					// walk children to find nested requires
+					context.next();
+
 					if (node.operator !== '=') return;
 					if (node.left.type !== 'MemberExpression') return;
 					if (node.left.object.type !== 'Identifier' || node.left.object.name !== 'exports') return;
@@ -53,8 +56,6 @@ const plugin: Plugin = {
 							`export const ${node.left.property.name} = module.exports.${node.left.property.name};`
 						);
 					}
-
-					context.next();
 				}
 			});