Merge branch 'main' into inline-vars

Author: benmccann

.changeset/brave-doors-compete.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: visit expression for `svelte:component` references

.changeset/chatty-snails-train.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure signal graph is consistent before triggering $inspect signals

.changeset/five-birds-check.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: widen ownership upon property access if necessary

.changeset/five-suns-roll.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: don't show `state_referenced_locally` warning on types

.changeset/fuzzy-tigers-swim.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure locally mutated bindable props persist with spreading props

.changeset/rotten-actors-rush.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure unowned derived signals correctly re-connect to graph

.changeset/selfish-trainers-kiss.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure inner script tags are properly removed

.changeset/strange-trains-destroy.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+chore: improve ssr parent validation

.changeset/tame-frogs-shave.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: prevent nullish snippet for rendering empty content

documentation/docs/98-reference/20-svelte.md

@@ -2,4 +2,4 @@
 title: svelte
 ---
 
-<!-- @include svelte -->
+> MODULE: svelte

documentation/docs/98-reference/21-svelte-action.md

@@ -2,4 +2,4 @@
 title: svelte/action
 ---
 
-<!-- @include svelte/action -->
+> MODULE: svelte/action

documentation/docs/98-reference/21-svelte-animate.md

@@ -2,4 +2,4 @@
 title: svelte/animate
 ---
 
-<!-- @include svelte/animate -->
+> MODULE: svelte/animate

documentation/docs/98-reference/21-svelte-compiler.md

@@ -2,4 +2,4 @@
 title: svelte/compiler
 ---
 
-<!-- @include svelte/compiler -->
+> MODULE: svelte/compiler

documentation/docs/98-reference/21-svelte-easing.md

@@ -2,4 +2,4 @@
 title: svelte/easing
 ---
 
-<!-- @include svelte/easing -->
+> MODULE: svelte/easing

documentation/docs/98-reference/21-svelte-events.md

@@ -2,4 +2,4 @@
 title: svelte/events
 ---
 
-<!-- @include svelte/events -->
+> MODULE: svelte/events

documentation/docs/98-reference/21-svelte-legacy.md

@@ -2,4 +2,4 @@
 title: svelte/legacy
 ---
 
-<!-- @include svelte/legacy -->
+> MODULE: svelte/legacy

documentation/docs/98-reference/21-svelte-motion.md

@@ -2,4 +2,4 @@
 title: svelte/motion
 ---
 
-<!-- @include svelte/motion -->
+> MODULE: svelte/motion

documentation/docs/98-reference/21-svelte-reactivity.md

@@ -2,4 +2,4 @@
 title: svelte/reactivity
 ---
 
-<!-- @include svelte/reactivity -->
+> MODULE: svelte/reactivity

documentation/docs/98-reference/21-svelte-server.md

@@ -2,4 +2,4 @@
 title: svelte/server
 ---
 
-<!-- @include svelte/server -->
+> MODULE: svelte/server

documentation/docs/98-reference/21-svelte-store.md

@@ -2,4 +2,4 @@
 title: svelte/store
 ---
 
-<!-- @include svelte/store -->
+> MODULE: svelte/store

documentation/docs/98-reference/21-svelte-transition.md

@@ -2,4 +2,4 @@
 title: svelte/transition
 ---
 
-<!-- @include svelte/transition -->
+> MODULE: svelte/transition

packages/svelte/elements.d.ts

@@ -1934,7 +1934,7 @@ export interface SvelteHTMLElements {
 			| string
 			| undefined
 			| {
-					tag: string;
+					tag?: string;
 					shadow?: 'open' | 'none' | undefined;
 					props?:
 						| Record<

packages/svelte/messages/client-errors/errors.md

@@ -48,6 +48,10 @@
 
 > Failed to hydrate the application
 
+## invalid_snippet
+
+> Could not `{@render}` snippet due to the expression being `null` or `undefined`. Consider using optional chaining `{@render snippet?.()}`
+
 ## lifecycle_legacy_only
 
 > `%name%(...)` cannot be used in runes mode

packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js

@@ -73,6 +73,11 @@ const visitors = {
 	TSNonNullExpression(node, context) {
 		return context.visit(node.expression);
 	},
+	TSTypeAnnotation() {
+		// This isn't correct, strictly speaking, and could result in invalid ASTs (like an empty statement within function parameters),
+		// but esrap, our printing tool, just ignores these AST nodes at invalid positions, so it's fine
+		return b.empty;
+	},
 	TSInterfaceDeclaration() {
 		return b.empty;
 	},
@@ -94,15 +99,6 @@ const visitors = {
 		}
 		return node.parameter;
 	},
-	Identifier(node) {
-		if (node.typeAnnotation) {
-			return {
-				...node,
-				typeAnnotation: null
-			};
-		}
-		return node;
-	},
 	FunctionExpression: remove_this_param,
 	FunctionDeclaration: remove_this_param,
 	TSDeclareFunction() {

packages/svelte/src/compiler/phases/3-transform/client/visitors/RenderTag.js

@@ -31,6 +31,11 @@ export function RenderTag(node, context) {
 	let snippet_function = /** @type {Expression} */ (context.visit(callee));
 
 	if (node.metadata.dynamic) {
+		// If we have a chain expression then ensure a nullish snippet function gets turned into an empty one
+		if (node.expression.type === 'ChainExpression') {
+			snippet_function = b.logical('??', snippet_function, b.id('$.noop'));
+		}
+
 		context.state.init.push(
 			b.stmt(b.call('$.snippet', context.state.node, b.thunk(snippet_function), ...args))
 		);

packages/svelte/src/compiler/phases/scope.js

@@ -305,6 +305,10 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 			default: context.state.scope.child()
 		};
 
+		if (node.type === 'SvelteComponent') {
+			context.visit(node.expression);
+		}
+
 		const default_state = determine_slot(node)
 			? context.state
 			: { scope: node.metadata.scopes.default };
@@ -353,7 +357,6 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 				references.push([state.scope, { node, path: path.slice() }]);
 			}
 		},
-
 		LabeledStatement(node, { path, next }) {
 			if (path.length > 1 || !allow_reactive_declarations) return next();
 			if (node.label.name !== '$') return next();

packages/svelte/src/html-tree-validation.js

@@ -162,21 +162,23 @@ export function is_tag_valid_with_ancestor(tag, ancestors) {
  * Returns false if the tag is not allowed inside the parent tag such that it will result
  * in the browser repairing the HTML, which will likely result in an error during hydration.
  * @param {string} tag
- * @param {string} parent_tag
+ * @param {string | null} parent_tag
  * @returns {boolean}
  */
 export function is_tag_valid_with_parent(tag, parent_tag) {
-	const disallowed = disallowed_children[parent_tag];
+	if (parent_tag !== null) {
+		const disallowed = disallowed_children[parent_tag];
 
-	if (disallowed) {
-		if ('direct' in disallowed && disallowed.direct.includes(tag)) {
-			return false;
-		}
-		if ('descendant' in disallowed && disallowed.descendant.includes(tag)) {
-			return false;
-		}
-		if ('only' in disallowed && disallowed.only) {
-			return disallowed.only.includes(tag);
+		if (disallowed) {
+			if ('direct' in disallowed && disallowed.direct.includes(tag)) {
+				return false;
+			}
+			if ('descendant' in disallowed && disallowed.descendant.includes(tag)) {
+				return false;
+			}
+			if ('only' in disallowed && disallowed.only) {
+				return disallowed.only.includes(tag);
+			}
 		}
 	}
 

packages/svelte/src/internal/client/dom/blocks/snippet.js

@@ -11,8 +11,10 @@ import { hydrate_next, hydrate_node, hydrating } from '../hydration.js';
 import { create_fragment_from_html } from '../reconciler.js';
 import { assign_nodes } from '../template.js';
 import * as w from '../../warnings.js';
+import * as e from '../../errors.js';
 import { DEV } from 'esm-env';
 import { get_first_child, get_next_sibling } from '../operations.js';
+import { noop } from '../../../shared/utils.js';
 
 /**
  * @template {(node: TemplateNode, ...args: any[]) => void} SnippetFn
@@ -25,7 +27,8 @@ export function snippet(node, get_snippet, ...args) {
 	var anchor = node;
 
 	/** @type {SnippetFn | null | undefined} */
-	var snippet;
+	// @ts-ignore
+	var snippet = noop;
 
 	/** @type {Effect | null} */
 	var snippet_effect;
@@ -38,9 +41,11 @@ export function snippet(node, get_snippet, ...args) {
 			snippet_effect = null;
 		}
 
-		if (snippet) {
-			snippet_effect = branch(() => /** @type {SnippetFn} */ (snippet)(anchor, ...args));
+		if (DEV && snippet == null) {
+			e.invalid_snippet();
 		}
+
+		snippet_effect = branch(() => /** @type {SnippetFn} */ (snippet)(anchor, ...args));
 	}, EFFECT_TRANSPARENT);
 
 	if (hydrating) {

packages/svelte/src/internal/client/dom/template.js

@@ -187,26 +187,41 @@ function run_scripts(node) {
 	// scripts were SSR'd, in which case they will run
 	if (hydrating) return;
 
+	const is_fragment = node.nodeType === 11;
 	const scripts =
 		/** @type {HTMLElement} */ (node).tagName === 'SCRIPT'
 			? [/** @type {HTMLScriptElement} */ (node)]
 			: node.querySelectorAll('script');
+	const effect = /** @type {Effect} */ (current_effect);
+
 	for (const script of scripts) {
-		var clone = document.createElement('script');
+		const clone = document.createElement('script');
 		for (var attribute of script.attributes) {
 			clone.setAttribute(attribute.name, attribute.value);
 		}
 
 		clone.textContent = script.textContent;
 
+		const replace = () => {
+			// The script has changed - if it's at the edges, the effect now points at dead nodes
+			if (is_fragment ? node.firstChild === script : node === script) {
+				effect.nodes_start = clone;
+			}
+			if (is_fragment ? node.lastChild === script : node === script) {
+				effect.nodes_end = clone;
+			}
+
+			script.replaceWith(clone);
+		};
+
 		// If node === script tag, replaceWith will do nothing because there's no parent yet,
 		// waiting until that's the case using an effect solves this.
 		// Don't do it in other circumstances or we could accidentally execute scripts
 		// in an adjacent @html tag that was instantiated in the meantime.
 		if (script === node) {
-			queue_micro_task(() => script.replaceWith(clone));
+			queue_micro_task(replace);
 		} else {
-			script.replaceWith(clone);
+			replace();
 		}
 	}
 }

packages/svelte/src/internal/client/errors.js

@@ -210,6 +210,22 @@ export function hydration_failed() {
 	}
 }
 
+/**
+ * Could not `{@render}` snippet due to the expression being `null` or `undefined`. Consider using optional chaining `{@render snippet?.()}`
+ * @returns {never}
+ */
+export function invalid_snippet() {
+	if (DEV) {
+		const error = new Error(`invalid_snippet\nCould not \`{@render}\` snippet due to the expression being \`null\` or \`undefined\`. Consider using optional chaining \`{@render snippet?.()}\``);
+
+		error.name = 'Svelte error';
+		throw error;
+	} else {
+		// TODO print a link to the documentation
+		throw new Error("invalid_snippet");
+	}
+}
+
 /**
  * `%name%(...)` cannot be used in runes mode
  * @param {string} name

packages/svelte/src/internal/client/proxy.js

@@ -131,6 +131,22 @@ export function proxy(value, parent = null, prev) {
 
 			if (s !== undefined) {
 				var v = get(s);
+
+				// In case of something like `foo = bar.map(...)`, foo would have ownership
+				// of the array itself, while the individual items would have ownership
+				// of the component that created bar. That means if we later do `foo[0].baz = 42`,
+				// we could get a false-positive ownership violation, since the two proxies
+				// are not connected to each other via the parent metadata relationship.
+				// For this reason, we need to widen the ownership of the children
+				// upon access when we detect they are not connected.
+				if (DEV) {
+					/** @type {ProxyMetadata | undefined} */
+					var prop_metadata = v?.[STATE_SYMBOL_METADATA];
+					if (prop_metadata && prop_metadata?.parent !== metadata) {
+						widen_ownership(metadata, prop_metadata);
+					}
+				}
+
 				return v === UNINITIALIZED ? undefined : v;
 			}
 

packages/svelte/src/internal/client/reactivity/deriveds.js

@@ -13,6 +13,7 @@ import {
 import { equals, safe_equals } from './equality.js';
 import * as e from '../errors.js';
 import { destroy_effect } from './effects.js';
+import { inspect_effects, set_inspect_effects } from './sources.js';
 
 /**
  * @template V
@@ -92,6 +93,8 @@ export function update_derived(derived) {
 	var value;
 
 	if (DEV) {
+		let prev_inspect_effects = inspect_effects;
+		set_inspect_effects(new Set());
 		try {
 			if (stack.includes(derived)) {
 				e.derived_references_self();
@@ -102,6 +105,7 @@ export function update_derived(derived) {
 			destroy_derived_children(derived);
 			value = update_reaction(derived);
 		} finally {
+			set_inspect_effects(prev_inspect_effects);
 			stack.pop();
 		}
 	} else {