Merge branch 'main' into parallelize-async-work

Author: Ocean-OS

.changeset/ninety-olives-report.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: replace `undefined` with `void(0)` in CallExpressions

.changeset/wise-schools-report.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: place store setup inside async body

documentation/docs/07-misc/04-custom-elements.md

@@ -4,7 +4,7 @@ title: Custom elements
 
 <!-- - [basically what we have today](https://svelte.dev/docs/custom-elements-api) -->
 
-Svelte components can also be compiled to custom elements (aka web components) using the `customElement: true` compiler option. You should specify a tag name for the component using the `<svelte:options>` [element](svelte-options).
+Svelte components can also be compiled to custom elements (aka web components) using the `customElement: true` compiler option. You should specify a tag name for the component using the `<svelte:options>` [element](svelte-options). Within the custom element you can access the host element via the [`$host`](https://svelte.dev/docs/svelte/$host) rune.
 
 ```svelte
 <svelte:options customElement="my-element" />

packages/svelte/CHANGELOG.md

@@ -1,5 +1,31 @@
 # svelte
 
+## 5.38.6
+
+### Patch Changes
+
+- fix: don't fail on `flushSync` while flushing effects ([#16674](https://github.com/sveltejs/svelte/pull/16674))
+
+## 5.38.5
+
+### Patch Changes
+
+- fix: ensure async deriveds always get dependencies from thennable ([#16672](https://github.com/sveltejs/svelte/pull/16672))
+
+## 5.38.4
+
+### Patch Changes
+
+- fix: place instance-level snippets inside async body ([#16666](https://github.com/sveltejs/svelte/pull/16666))
+
+- fix: Add check for builtin custom elements in `set_custom_element_data` ([#16592](https://github.com/sveltejs/svelte/pull/16592))
+
+- fix: restore batch along with effect context ([#16668](https://github.com/sveltejs/svelte/pull/16668))
+
+- fix: wait until changes propagate before updating input selection state ([#16649](https://github.com/sveltejs/svelte/pull/16649))
+
+- fix: add "Accept-CH" as valid value for `http-equiv` ([#16671](https://github.com/sveltejs/svelte/pull/16671))
+
 ## 5.38.3
 
 ### Patch Changes

packages/svelte/elements.d.ts

@@ -1268,6 +1268,7 @@ export interface HTMLMetaAttributes extends HTMLAttributes<HTMLMetaElement> {
 	charset?: string | undefined | null;
 	content?: string | undefined | null;
 	'http-equiv'?:
+		| 'accept-ch'
 		| 'content-security-policy'
 		| 'content-type'
 		| 'default-style'

packages/svelte/package.json

@@ -2,7 +2,7 @@
   "name": "svelte",
   "description": "Cybernetically enhanced web apps",
   "license": "MIT",
-  "version": "5.38.3",
+  "version": "5.38.6",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {

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

@@ -362,22 +362,41 @@ export function client_component(analysis, options) {
 
 	let component_block = b.block([
 		store_init,
-		...store_setup,
 		...legacy_reactive_declarations,
-		...group_binding_declarations,
-		...state.instance_level_snippets
+		...group_binding_declarations
 	]);
 
+	const should_inject_context =
+		dev ||
+		analysis.needs_context ||
+		analysis.reactive_statements.size > 0 ||
+		component_returned_object.length > 0;
+
 	if (analysis.instance.has_await) {
+		if (should_inject_context && component_returned_object.length > 0) {
+			component_block.body.push(b.var('$$exports'));
+		}
 		const body = b.block([
+			...store_setup,
+			...state.instance_level_snippets,
 			.../** @type {ESTree.Statement[]} */ (instance.body),
+			...(should_inject_context && component_returned_object.length > 0
+				? [b.stmt(b.assignment('=', b.id('$$exports'), b.object(component_returned_object)))]
+				: []),
 			b.if(b.call('$.aborted'), b.return()),
 			.../** @type {ESTree.Statement[]} */ (template.body)
 		]);
 
 		component_block.body.push(b.stmt(b.call(`$.async_body`, b.arrow([], body, true))));
 	} else {
-		component_block.body.push(.../** @type {ESTree.Statement[]} */ (instance.body));
+		component_block.body.push(
+			...state.instance_level_snippets,
+			.../** @type {ESTree.Statement[]} */ (instance.body)
+		);
+		if (should_inject_context && component_returned_object.length > 0) {
+			component_block.body.push(b.var('$$exports', b.object(component_returned_object)));
+		}
+		component_block.body.unshift(...store_setup);
 
 		if (!analysis.runes && analysis.needs_context) {
 			component_block.body.push(b.stmt(b.call('$.init', analysis.immutable ? b.true : undefined)));
@@ -392,12 +411,6 @@ export function client_component(analysis, options) {
 		);
 	}
 
-	const should_inject_context =
-		dev ||
-		analysis.needs_context ||
-		analysis.reactive_statements.size > 0 ||
-		component_returned_object.length > 0;
-
 	let should_inject_props =
 		should_inject_context ||
 		analysis.needs_props ||
@@ -444,7 +457,7 @@ export function client_component(analysis, options) {
 		let to_push;
 
 		if (component_returned_object.length > 0) {
-			let pop_call = b.call('$.pop', b.object(component_returned_object));
+			let pop_call = b.call('$.pop', b.id('$$exports'));
 			to_push = needs_store_cleanup ? b.var('$$pop', pop_call) : b.return(pop_call);
 		} else {
 			to_push = b.stmt(b.call('$.pop'));
@@ -455,6 +468,7 @@ export function client_component(analysis, options) {
 
 	if (needs_store_cleanup) {
 		component_block.body.push(b.stmt(b.call('$$cleanup')));
+
 		if (component_returned_object.length > 0) {
 			component_block.body.push(b.return(b.id('$$pop')));
 		}

packages/svelte/src/compiler/utils/builders.js

@@ -100,15 +100,15 @@ export function call(callee, ...args) {
 	if (typeof callee === 'string') callee = id(callee);
 	args = args.slice();
 
-	// replacing missing arguments with `undefined`, unless they're at the end in which case remove them
+	// replacing missing arguments with `void(0)`, unless they're at the end in which case remove them
 	let i = args.length;
 	let popping = true;
 	while (i--) {
 		if (!args[i]) {
 			if (popping) {
 				args.pop();
 			} else {
-				args[i] = id('undefined');
+				args[i] = void0;
 			}
 		} else {
 			popping = false;

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

@@ -1,10 +1,5 @@
 /** @import { Effect, Source, TemplateNode, } from '#client' */
-import {
-	BOUNDARY_EFFECT,
-	EFFECT_PRESERVED,
-	EFFECT_RAN,
-	EFFECT_TRANSPARENT
-} from '#client/constants';
+import { BOUNDARY_EFFECT, EFFECT_PRESERVED, EFFECT_TRANSPARENT } from '#client/constants';
 import { component_context, set_component_context } from '../../context.js';
 import { handle_error, invoke_error_boundary } from '../../error-handling.js';
 import { block, branch, destroy_effect, pause_effect } from '../../reactivity/effects.js';

packages/svelte/src/internal/client/dom/elements/attributes.js

@@ -238,10 +238,10 @@ export function set_custom_element_data(node, prop, value) {
 			// Don't compute setters for custom elements while they aren't registered yet,
 			// because during their upgrade/instantiation they might add more setters.
 			// Instead, fall back to a simple "an object, then set as property" heuristic.
-			(setters_cache.has(node.nodeName) ||
+			(setters_cache.has(node.getAttribute('is') || node.nodeName) ||
 			// customElements may not be available in browser extension contexts
 			!customElements ||
-			customElements.get(node.tagName.toLowerCase())
+			customElements.get(node.getAttribute('is') || node.tagName.toLowerCase())
 				? get_setters(node).includes(prop)
 				: value && typeof value === 'object')
 		) {
@@ -546,9 +546,10 @@ var setters_cache = new Map();
 
 /** @param {Element} element */
 function get_setters(element) {
-	var setters = setters_cache.get(element.nodeName);
+	var cache_key = element.getAttribute('is') || element.nodeName;
+	var setters = setters_cache.get(cache_key);
 	if (setters) return setters;
-	setters_cache.set(element.nodeName, (setters = []));
+	setters_cache.set(cache_key, (setters = []));
 
 	var descriptors;
 	var proto = element; // In the case of custom elements there might be setters on the instance