Merge 3904b8f36c into 942eaf027b

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

@@ -13,7 +13,7 @@ export function TitleElement(node, context) {
 		context
 	);
 
-	const statement = b.stmt(b.assignment('=', b.id('$.document.title'), value));
+	const statement = b.stmt(b.call('$.title', value));
 
 	if (has_state) {
 		context.state.update.push(statement);

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

@@ -1,3 +1,4 @@
+import { render_effect } from '../../reactivity/effects.js';
 import { hydrating } from '../hydration.js';
 import { clear_text_content, get_first_child } from '../operations.js';
 import { queue_micro_task } from '../task.js';
@@ -56,3 +57,17 @@ export function add_form_reset_listener() {
 		);
 	}
 }
+
+/**
+ * @param {string} text
+ */
+export function title(text) {
+	render_effect(() => {
+		const previous = document.title;
+		document.title = text;
+
+		return () => {
+			document.title = previous;
+		};
+	});
+}

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

@@ -42,7 +42,7 @@ export {
 } from './dom/elements/attributes.js';
 export { set_class } from './dom/elements/class.js';
 export { apply, event, delegate, replay_events } from './dom/elements/events.js';
-export { autofocus, remove_textarea_child } from './dom/elements/misc.js';
+export { autofocus, remove_textarea_child, title } from './dom/elements/misc.js';
 export { set_style } from './dom/elements/style.js';
 export { animation, transition } from './dom/elements/transitions.js';
 export { bind_active_element } from './dom/elements/bindings/document.js';

packages/svelte/tests/runtime-runes/samples/if-dependency-order-2/_config.js

@@ -5,7 +5,7 @@ export default test({
 	async test({ assert, target, window }) {
 		const [btn1] = target.querySelectorAll('button');
 
-		assert.htmlEqual(window.document.head.innerHTML, ``);
+		assert.htmlEqual(window.document.head.innerHTML, `<title>initial</title>`);
 
 		flushSync(() => {
 			btn1.click();
@@ -17,6 +17,6 @@ export default test({
 			btn1.click();
 		});
 
-		assert.htmlEqual(window.document.head.innerHTML, `<title>hello world</title>`);
+		assert.htmlEqual(window.document.head.innerHTML, `<title>initial</title>`);
 	}
 });

packages/svelte/tests/runtime-runes/samples/if-dependency-order-2/main.svelte

@@ -8,6 +8,10 @@
 	}
 </script>
 
+<svelte:head>
+	<title>initial</title>
+</svelte:head>
+
 <button onclick={toggle}>
 	toggle
 </button>