ripple 0.3.126 → 0.3.128

package/tests/hydration/compiled/client/portal.js

@@ -17,8 +17,8 @@ export function SimplePortal() {
 		var div = root();
 
 		{
-			var h1 = _$_.child(div);
-			var node = _$_.sibling(h1);
+			var h1 = _$_.hydrating ? _$_.hydrate_child() : div.firstChild;
+			var node = _$_.hydrating ? _$_.hydrate_sibling() : h1.nextSibling;
 
 			_$_.render_component(Portal, node, {
 				get target() {
@@ -45,11 +45,11 @@ export function ConditionalPortal() {
 		var div_2 = root_2();
 
 		{
-			var button = _$_.child(div_2);
+			var button = _$_.hydrating ? _$_.hydrate_child() : div_2.firstChild;
 
 			button.__click = () => _$_.set(lazy, !lazy.value);
 
-			var node_1 = _$_.sibling(button);
+			var node_1 = _$_.hydrating ? _$_.hydrate_sibling() : button.nextSibling;
 
 			{
 				var consequent = (__anchor) => {
@@ -83,8 +83,8 @@ export function PortalWithMainContent() {
 		var div_4 = root_4();
 
 		{
-			var div_5 = _$_.child(div_4);
-			var node_2 = _$_.sibling(div_5);
+			var div_5 = _$_.hydrating ? _$_.hydrate_child() : div_4.firstChild;
+			var node_2 = _$_.hydrating ? _$_.hydrate_sibling() : div_5.nextSibling;
 
 			_$_.render_component(Portal, node_2, {
 				get target() {
@@ -110,11 +110,11 @@ export function NestedContentWithPortal() {
 		var div_7 = root_6();
 
 		{
-			var div_8 = _$_.child(div_7);
+			var div_8 = _$_.hydrating ? _$_.hydrate_child() : div_7.firstChild;
 
 			_$_.pop(div_8);
 
-			var node_3 = _$_.sibling(div_8);
+			var node_3 = _$_.hydrating ? _$_.hydrate_sibling() : div_8.nextSibling;
 
 			_$_.render_component(Portal, node_3, {
 				get target() {

package/tests/hydration/compiled/client/reactivity.js

@@ -15,12 +15,15 @@ export function TrackedState() {
 		var div = root();
 
 		{
-			var expression = _$_.child(div);
+			var expression = _$_.hydrating ? _$_.hydrate_child(true) : div.firstChild;
 
-			_$_.expression(expression, () => lazy.value);
 			_$_.pop(div);
 		}
 
+		_$_.render(() => {
+			_$_.set_text(expression, lazy.value);
+		});
+
 		_$_.append(__anchor, div);
 	});
 }
@@ -31,10 +34,10 @@ export function CounterWithInitial(props) {
 		var div_1 = root_1();
 
 		{
-			var span = _$_.child(div_1);
+			var span = _$_.hydrating ? _$_.hydrate_child() : div_1.firstChild;
 
 			{
-				var expression_1 = _$_.child(span);
+				var expression_1 = _$_.hydrating ? _$_.hydrate_child() : span.firstChild;
 
 				_$_.expression(expression_1, () => lazy_1.value);
 				_$_.pop(span);
@@ -59,7 +62,7 @@ export function ComputedValues() {
 		var div_2 = root_2();
 
 		{
-			var expression_2 = _$_.child(div_2);
+			var expression_2 = _$_.hydrating ? _$_.hydrate_child() : div_2.firstChild;
 
 			_$_.expression(expression_2, sum);
 			_$_.pop(div_2);
@@ -77,34 +80,54 @@ export function MultipleTracked() {
 		var div_3 = root_3();
 
 		{
-			var div_4 = _$_.child(div_3);
+			var div_4 = _$_.hydrating ? _$_.hydrate_child() : div_3.firstChild;
 
 			{
-				var expression_3 = _$_.child(div_4);
+				var expression_3 = _$_.hydrating ? _$_.hydrate_child(true) : div_4.firstChild;
 
-				_$_.expression(expression_3, () => lazy_4.value);
 				_$_.pop(div_4);
 			}
 
-			var div_5 = _$_.sibling(div_4);
+			var div_5 = _$_.hydrating ? _$_.hydrate_sibling() : div_4.nextSibling;
 
 			{
-				var expression_4 = _$_.child(div_5);
+				var expression_4 = _$_.hydrating ? _$_.hydrate_child(true) : div_5.firstChild;
 
-				_$_.expression(expression_4, () => lazy_5.value);
 				_$_.pop(div_5);
 			}
 
-			var div_6 = _$_.sibling(div_5);
+			var div_6 = _$_.hydrating ? _$_.hydrate_sibling() : div_5.nextSibling;
 
 			{
-				var expression_5 = _$_.child(div_6);
+				var expression_5 = _$_.hydrating ? _$_.hydrate_child(true) : div_6.firstChild;
 
-				_$_.expression(expression_5, () => lazy_6.value);
 				_$_.pop(div_6);
 			}
 		}
 
+		_$_.render(
+			(__prev) => {
+				var __a = lazy_4.value;
+
+				if (__prev.a !== __a) {
+					_$_.set_text(expression_3, __prev.a = __a);
+				}
+
+				var __b = lazy_5.value;
+
+				if (__prev.b !== __b) {
+					_$_.set_text(expression_4, __prev.b = __b);
+				}
+
+				var __c = lazy_6.value;
+
+				if (__prev.c !== __c) {
+					_$_.set_text(expression_5, __prev.c = __c);
+				}
+			},
+			{ a: ' ', b: ' ', c: ' ' }
+		);
+
 		_$_.append(__anchor, div_3);
 	});
 }
@@ -117,7 +140,7 @@ export function DerivedState() {
 		var div_7 = root_4();
 
 		{
-			var expression_6 = _$_.child(div_7);
+			var expression_6 = _$_.hydrating ? _$_.hydrate_child() : div_7.firstChild;
 
 			_$_.expression(expression_6, fullName);
 			_$_.pop(div_7);

package/tests/hydration/compiled/client/streaming.js

@@ -65,15 +65,15 @@ function BasicContent() {
 		var div = root();
 
 		{
-			var span = _$_.child(div);
+			var span = _$_.hydrating ? _$_.hydrate_child() : div.firstChild;
 
 			{
-				var expression = _$_.child(span, true);
+				var expression = _$_.hydrating ? _$_.hydrate_child(true) : span.firstChild;
 
 				_$_.pop(span);
 			}
 
-			var button = _$_.sibling(span);
+			var button = _$_.hydrating ? _$_.hydrate_sibling() : span.nextSibling;
 
 			button.__click = () => _$_.update(lazy_1);
 		}
@@ -94,7 +94,7 @@ export function StreamPending() {
 		_$_.expression(node_2, () => _$_.tsrx_element((__anchor, __block) => {
 			var fragment_1 = root_2();
 			var span_1 = _$_.first_child_frag(fragment_1);
-			var node = _$_.sibling(span_1);
+			var node = _$_.hydrating ? _$_.hydrate_sibling() : span_1.nextSibling;
 
 			_$_.try(
 				node,
@@ -126,7 +126,7 @@ function CatchOnlyContent() {
 		var p_1 = root_5();
 
 		{
-			var expression_1 = _$_.child(p_1);
+			var expression_1 = _$_.hydrating ? _$_.hydrate_child() : p_1.firstChild;
 
 			_$_.expression(expression_1, () => lazy_2.value);
 			_$_.pop(p_1);
@@ -144,7 +144,7 @@ export function StreamCatchOnly() {
 		_$_.expression(node_4, () => _$_.tsrx_element((__anchor, __block) => {
 			var fragment_4 = root_7();
 			var span_2 = _$_.first_child_frag(fragment_4);
-			var node_3 = _$_.sibling(span_2);
+			var node_3 = _$_.hydrating ? _$_.hydrate_sibling() : span_2.nextSibling;
 
 			_$_.try(
 				node_3,
@@ -155,7 +155,7 @@ export function StreamCatchOnly() {
 					var em = root_8();
 
 					{
-						var expression_2 = _$_.child(em);
+						var expression_2 = _$_.hydrating ? _$_.hydrate_child() : em.firstChild;
 
 						_$_.expression(expression_2, () => e.message);
 						_$_.pop(em);
@@ -178,7 +178,7 @@ function RejectContent() {
 		var p_2 = root_9();
 
 		{
-			var expression_3 = _$_.child(p_2);
+			var expression_3 = _$_.hydrating ? _$_.hydrate_child() : p_2.firstChild;
 
 			_$_.expression(expression_3, () => lazy_3.value);
 			_$_.pop(p_2);
@@ -199,7 +199,7 @@ export function StreamRejects() {
 				var em_1 = root_10();
 
 				{
-					var expression_4 = _$_.child(em_1);
+					var expression_4 = _$_.hydrating ? _$_.hydrate_child() : em_1.firstChild;
 
 					_$_.expression(expression_4, () => e.message);
 					_$_.pop(em_1);
@@ -223,7 +223,7 @@ function NoCatchContent() {
 		var p_4 = root_12();
 
 		{
-			var expression_5 = _$_.child(p_4);
+			var expression_5 = _$_.hydrating ? _$_.hydrate_child() : p_4.firstChild;
 
 			_$_.expression(expression_5, () => lazy_4.value);
 			_$_.pop(p_4);
@@ -258,7 +258,7 @@ export function RootCatch({ error, reset }) {
 		_$_.event('Click', section, reset);
 
 		{
-			var expression_6 = _$_.child(section);
+			var expression_6 = _$_.hydrating ? _$_.hydrate_child() : section.firstChild;
 
 			_$_.expression(expression_6, () => error.message);
 			_$_.pop(section);
@@ -288,7 +288,7 @@ function HeadContent() {
 					var p_7 = root_17();
 
 					{
-						var expression_7 = _$_.child(p_7);
+						var expression_7 = _$_.hydrating ? _$_.hydrate_child() : p_7.firstChild;
 
 						_$_.expression(expression_7, () => lazy_5.value);
 						_$_.pop(p_7);
@@ -341,7 +341,7 @@ export function StreamRootDirect() {
 		var p_9 = root_19();
 
 		{
-			var expression_8 = _$_.child(p_9);
+			var expression_8 = _$_.hydrating ? _$_.hydrate_child() : p_9.firstChild;
 
 			_$_.expression(expression_8, () => lazy_6.value);
 			_$_.pop(p_9);
@@ -357,7 +357,7 @@ function OuterContent() {
 		var p_10 = root_20();
 
 		{
-			var expression_9 = _$_.child(p_10);
+			var expression_9 = _$_.hydrating ? _$_.hydrate_child() : p_10.firstChild;
 
 			_$_.expression(expression_9, () => lazy_7.value);
 			_$_.pop(p_10);
@@ -373,7 +373,7 @@ function InnerContent() {
 		var p_11 = root_21();
 
 		{
-			var expression_10 = _$_.child(p_11);
+			var expression_10 = _$_.hydrating ? _$_.hydrate_child() : p_11.firstChild;
 
 			_$_.expression(expression_10, () => lazy_8.value);
 			_$_.pop(p_11);
@@ -393,7 +393,7 @@ export function StreamNested() {
 
 				_$_.render_component(OuterContent, node_6, {});
 
-				var node_7 = _$_.sibling(node_6);
+				var node_7 = _$_.hydrating ? _$_.hydrate_sibling() : node_6.nextSibling;
 
 				_$_.try(
 					node_7,

package/tests/hydration/compiled/client/switch.js

@@ -91,7 +91,7 @@ export function SwitchReactive() {
 				if (lazy.value === 'a') _$_.set(lazy, 'b'); else if (lazy.value === 'b') _$_.set(lazy, 'c'); else _$_.set(lazy, 'a');
 			};
 
-			var node = _$_.sibling(button);
+			var node = _$_.hydrating ? _$_.hydrate_sibling() : button.nextSibling;
 
 			{
 				var switch_case_0_1 = (__anchor) => {
@@ -193,7 +193,7 @@ export function SwitchNumericLevels() {
 				if (lazy_1.value === 1) _$_.set(lazy_1, 2); else if (lazy_1.value === 2) _$_.set(lazy_1, 3); else _$_.set(lazy_1, 1);
 			};
 
-			var node_2 = _$_.sibling(button_1);
+			var node_2 = _$_.hydrating ? _$_.hydrate_sibling() : button_1.nextSibling;
 
 			{
 				var switch_case_0_3 = (__anchor) => {
@@ -254,7 +254,7 @@ export function SwitchBlockScoped() {
 				if (lazy_2.value === 1) _$_.set(lazy_2, 2); else if (lazy_2.value === 2) _$_.set(lazy_2, 3); else _$_.set(lazy_2, 1);
 			};
 
-			var node_4 = _$_.sibling(button_2);
+			var node_4 = _$_.hydrating ? _$_.hydrate_sibling() : button_2.nextSibling;
 
 			{
 				var switch_case_0_4 = (__anchor) => {
@@ -315,7 +315,7 @@ export function SwitchNoBreak() {
 				if (lazy_3.value === 1) _$_.set(lazy_3, 2); else if (lazy_3.value === 2) _$_.set(lazy_3, 3); else _$_.set(lazy_3, 1);
 			};
 
-			var node_6 = _$_.sibling(button_3);
+			var node_6 = _$_.hydrating ? _$_.hydrate_sibling() : button_3.nextSibling;
 
 			{
 				var switch_case_0_5 = (__anchor) => {

package/tests/hydration/compiled/client/track-async-serialization.js

@@ -36,7 +36,7 @@ function ServerCallResult({ count }) {
 		var p = root();
 
 		{
-			var expression = _$_.child(p);
+			var expression = _$_.hydrating ? _$_.hydrate_child() : p.firstChild;
 
 			_$_.expression(expression, () => lazy.value);
 			_$_.pop(p);
@@ -60,7 +60,7 @@ export function AsyncWithServerCall() {
 				_$_.update(lazy_1);
 			};
 
-			var node = _$_.sibling(button);
+			var node = _$_.hydrating ? _$_.hydrate_sibling() : button.nextSibling;
 
 			_$_.try(
 				node,
@@ -95,7 +95,7 @@ export function AsyncSimpleValue() {
 				var p_2 = root_4();
 
 				{
-					var expression_1 = _$_.child(p_2);
+					var expression_1 = _$_.hydrating ? _$_.hydrate_child() : p_2.firstChild;
 
 					_$_.expression(expression_1, () => lazy_2.value);
 					_$_.pop(p_2);
@@ -123,7 +123,7 @@ export function AsyncNumericValue() {
 				var span = root_6();
 
 				{
-					var expression_2 = _$_.child(span);
+					var expression_2 = _$_.hydrating ? _$_.hydrate_child() : span.firstChild;
 
 					_$_.expression(expression_2, () => lazy_3.value);
 					_$_.pop(span);
@@ -151,19 +151,19 @@ export function AsyncObjectValue() {
 				var div = root_8();
 
 				{
-					var span_2 = _$_.child(div);
+					var span_2 = _$_.hydrating ? _$_.hydrate_child() : div.firstChild;
 
 					{
-						var expression_3 = _$_.child(span_2);
+						var expression_3 = _$_.hydrating ? _$_.hydrate_child() : span_2.firstChild;
 
 						_$_.expression(expression_3, () => lazy_4.value.name);
 						_$_.pop(span_2);
 					}
 
-					var span_3 = _$_.sibling(span_2);
+					var span_3 = _$_.hydrating ? _$_.hydrate_sibling() : span_2.nextSibling;
 
 					{
-						var expression_4 = _$_.child(span_3);
+						var expression_4 = _$_.hydrating ? _$_.hydrate_child() : span_3.firstChild;
 
 						_$_.expression(expression_4, () => lazy_4.value.age);
 						_$_.pop(span_3);
@@ -193,19 +193,19 @@ export function AsyncMultipleValues() {
 				var div_2 = root_10();
 
 				{
-					var span_4 = _$_.child(div_2);
+					var span_4 = _$_.hydrating ? _$_.hydrate_child() : div_2.firstChild;
 
 					{
-						var expression_5 = _$_.child(span_4);
+						var expression_5 = _$_.hydrating ? _$_.hydrate_child() : span_4.firstChild;
 
 						_$_.expression(expression_5, () => lazy_5.value);
 						_$_.pop(span_4);
 					}
 
-					var span_5 = _$_.sibling(span_4);
+					var span_5 = _$_.hydrating ? _$_.hydrate_sibling() : span_4.nextSibling;
 
 					{
-						var expression_6 = _$_.child(span_5);
+						var expression_6 = _$_.hydrating ? _$_.hydrate_child() : span_5.firstChild;
 
 						_$_.expression(expression_6, () => lazy_6.value);
 						_$_.pop(span_5);
@@ -234,7 +234,7 @@ export function AsyncWithCatch() {
 				var p_4 = root_12();
 
 				{
-					var expression_7 = _$_.child(p_4);
+					var expression_7 = _$_.hydrating ? _$_.hydrate_child() : p_4.firstChild;
 
 					_$_.expression(expression_7, () => lazy_7.value);
 					_$_.pop(p_4);
@@ -246,7 +246,7 @@ export function AsyncWithCatch() {
 				var p_5 = root_13();
 
 				{
-					var expression_8 = _$_.child(p_5);
+					var expression_8 = _$_.hydrating ? _$_.hydrate_child() : p_5.firstChild;
 
 					_$_.expression(expression_8, () => e.message);
 					_$_.pop(p_5);
@@ -273,7 +273,7 @@ export function ChildWithError() {
 				var p_7 = root_15();
 
 				{
-					var expression_9 = _$_.child(p_7);
+					var expression_9 = _$_.hydrating ? _$_.hydrate_child() : p_7.firstChild;
 
 					_$_.expression(expression_9, () => lazy_8.value);
 					_$_.pop(p_7);
@@ -303,7 +303,7 @@ export function ParentWithCatch() {
 				var p_9 = root_17();
 
 				{
-					var expression_10 = _$_.child(p_9);
+					var expression_10 = _$_.hydrating ? _$_.hydrate_child() : p_9.firstChild;
 
 					_$_.expression(expression_10, () => e.message);
 					_$_.pop(p_9);
@@ -323,7 +323,7 @@ function ReactiveDependencyResult({ count }) {
 		var p_10 = root_18();
 
 		{
-			var expression_11 = _$_.child(p_10);
+			var expression_11 = _$_.hydrating ? _$_.hydrate_child() : p_10.firstChild;
 
 			_$_.expression(expression_11, () => lazy_9.value);
 			_$_.pop(p_10);
@@ -347,7 +347,7 @@ export function AsyncWithReactiveDependency() {
 				_$_.update(lazy_10);
 			};
 
-			var node_2 = _$_.sibling(button_1);
+			var node_2 = _$_.hydrating ? _$_.hydrate_sibling() : button_1.nextSibling;
 
 			_$_.try(
 				node_2,

package/tests/hydration/compiled/client/try.js

@@ -29,16 +29,16 @@ export function RootCatch({ error, reset }) {
 		var section = root_1();
 
 		{
-			var p_1 = _$_.child(section);
+			var p_1 = _$_.hydrating ? _$_.hydrate_child() : section.firstChild;
 
 			{
-				var expression = _$_.child(p_1);
+				var expression = _$_.hydrating ? _$_.hydrate_child() : p_1.firstChild;
 
 				_$_.expression(expression, () => error.message);
 				_$_.pop(p_1);
 			}
 
-			var button = _$_.sibling(p_1);
+			var button = _$_.hydrating ? _$_.hydrate_sibling() : p_1.nextSibling;
 
 			_$_.event('Click', button, reset);
 		}
@@ -63,7 +63,7 @@ export function RootAsyncDirect() {
 		var p_2 = root_3();
 
 		{
-			var expression_1 = _$_.child(p_2);
+			var expression_1 = _$_.hydrating ? _$_.hydrate_child() : p_2.firstChild;
 
 			_$_.expression(expression_1, () => lazy.value);
 			_$_.pop(p_2);
@@ -79,7 +79,7 @@ export function RootAsyncRejects() {
 		var p_3 = root_4();
 
 		{
-			var expression_2 = _$_.child(p_3);
+			var expression_2 = _$_.hydrating ? _$_.hydrate_child() : p_3.firstChild;
 
 			_$_.expression(expression_2, () => lazy_1.value);
 			_$_.pop(p_3);
@@ -120,7 +120,7 @@ function AsyncList() {
 					var li = root_7();
 
 					{
-						var expression_3 = _$_.child(li);
+						var expression_3 = _$_.hydrating ? _$_.hydrate_child() : li.firstChild;
 
 						_$_.expression(expression_3, () => item);
 						_$_.pop(li);
@@ -146,7 +146,7 @@ export function AsyncTryWithLeadingSibling() {
 		_$_.expression(node_1, () => _$_.tsrx_element((__anchor, __block) => {
 			var fragment_2 = root_9();
 			var div = _$_.first_child_frag(fragment_2);
-			var node = _$_.sibling(div);
+			var node = _$_.hydrating ? _$_.hydrate_sibling() : div.nextSibling;
 
 			_$_.try(
 				node,
@@ -174,7 +174,7 @@ function AsyncContent() {
 		var div_2 = root_11();
 
 		{
-			var expression_4 = _$_.child(div_2);
+			var expression_4 = _$_.hydrating ? _$_.hydrate_child() : div_2.firstChild;
 
 			_$_.expression(expression_4, () => lazy_3.value);
 			_$_.pop(div_2);

package/tests/hydration/compiled/server/events.js

@@ -10,15 +10,7 @@ export function ClickCounter() {
 		_$_.regular_block(() => {
 			let __out = '';
 
-			__out += '<div><button class="increment">Increment</button><span class="count">';
-
-			{
-				_$_.output_push(__out);
-				__out = '';
-				_$_.render_expression(lazy.value);
-			}
-
-			__out += '</span></div>';
+			__out += '<div><button class="increment">Increment</button><span class="count">' + _$_.escape(lazy.value) + '</span></div>';
 			_$_.output_push(__out);
 		});
 	});
@@ -31,15 +23,7 @@ export function IncrementDecrement() {
 		_$_.regular_block(() => {
 			let __out = '';
 
-			__out += '<div><button class="decrement">-</button><span class="count">';
-
-			{
-				_$_.output_push(__out);
-				__out = '';
-				_$_.render_expression(lazy_1.value);
-			}
-
-			__out += '</span><button class="increment">+</button></div>';
+			__out += '<div><button class="decrement">-</button><span class="count">' + _$_.escape(lazy_1.value) + '</span><button class="increment">+</button></div>';
 			_$_.output_push(__out);
 		});
 	});
@@ -53,23 +37,7 @@ export function MultipleEvents() {
 		_$_.regular_block(() => {
 			let __out = '';
 
-			__out += '<div><button class="target">Target</button><span class="clicks">';
-
-			{
-				_$_.output_push(__out);
-				__out = '';
-				_$_.render_expression(lazy_2.value);
-			}
-
-			__out += '</span><span class="hovers">';
-
-			{
-				_$_.output_push(__out);
-				__out = '';
-				_$_.render_expression(lazy_3.value);
-			}
-
-			__out += '</span></div>';
+			__out += '<div><button class="target">Target</button><span class="clicks">' + _$_.escape(lazy_2.value) + '</span><span class="hovers">' + _$_.escape(lazy_3.value) + '</span></div>';
 			_$_.output_push(__out);
 		});
 	});
@@ -88,15 +56,7 @@ export function MultiStateUpdate() {
 		_$_.regular_block(() => {
 			let __out = '';
 
-			__out += '<div><button class="btn">Click</button><span class="count">';
-
-			{
-				_$_.output_push(__out);
-				__out = '';
-				_$_.render_expression(lazy_4.value);
-			}
-
-			__out += '</span><span class="action">';
+			__out += '<div><button class="btn">Click</button><span class="count">' + _$_.escape(lazy_4.value) + '</span><span class="action">';
 
 			{
 				_$_.output_push(__out);
@@ -160,15 +120,7 @@ export function ParentWithChildButton() {
 				_$_.render_component(comp, ...args);
 			}
 
-			__out += '<span class="count">';
-
-			{
-				_$_.output_push(__out);
-				__out = '';
-				_$_.render_expression(lazy_7.value);
-			}
-
-			__out += '</span></div>';
+			__out += '<span class="count">' + _$_.escape(lazy_7.value) + '</span></div>';
 			_$_.output_push(__out);
 		});
 	});

package/tests/hydration/compiled/server/for.js

@@ -240,15 +240,7 @@ export function EmptyForLoop() {
 			__out += '<div class="container"><!--[-->';
 
 			for (const item of items) {
-				__out += '<span>';
-
-				{
-					_$_.output_push(__out);
-					__out = '';
-					_$_.render_expression(item);
-				}
-
-				__out += '</span>';
+				__out += '<span>' + _$_.escape(item) + '</span>';
 			}
 
 			__out += '<!--]--></div>';
@@ -427,15 +419,7 @@ export function ForLoopEmptyToPopulated() {
 			__out += '<button class="populate">Populate</button><ul class="list"><!--[-->';
 
 			for (const item of lazy_8.value) {
-				__out += '<li>';
-
-				{
-					_$_.output_push(__out);
-					__out = '';
-					_$_.render_expression(item);
-				}
-
-				__out += '</li>';
+				__out += '<li>' + _$_.escape(item) + '</li>';
 			}
 
 			__out += '<!--]--></ul>';

package/tests/hydration/compiled/server/head.js

@@ -178,15 +178,7 @@ export function ComputedTitle() {
 		_$_.regular_block(() => {
 			let __out = '';
 
-			__out += '<div><span>';
-
-			{
-				_$_.output_push(__out);
-				__out = '';
-				_$_.render_expression(lazy_5.value);
-			}
-
-			__out += '</span></div>';
+			__out += '<div><span>' + _$_.escape(lazy_5.value) + '</span></div>';
 			_$_.output_push(__out);
 			__out = '';
 			_$_.set_output_target('head');

package/tests/hydration/compiled/server/html.js

@@ -711,15 +711,7 @@ function ForList({ items }) {
 			__out += '<!--[-->';
 
 			for (const item of items) {
-				__out += '<span class="for-item">';
-
-				{
-					_$_.output_push(__out);
-					__out = '';
-					_$_.render_expression(item);
-				}
-
-				__out += '</span>';
+				__out += '<span class="for-item">' + _$_.escape(item) + '</span>';
 			}
 
 			__out += '<!--]-->';