ripple 0.3.68 → 0.3.69

package/tests/server/switch.test.tsrx

@@ -1,21 +1,22 @@
 describe('SSR: switch statements', () => {
 	it('renders simple switch with literal cases', async () => {
-		component App() {
-			let value = 'b';
-
-			switch (value) {
-				case 'a':
-					<div>{'Case A'}</div>
-					break;
-				case 'b':
-					<div>{'Case B'}</div>
-					break;
-				case 'c':
-					<div>{'Case C'}</div>
-					break;
-				default:
-					<div>{'Default Case'}</div>
-			}
+		function App() {
+			return <>
+				let value = 'b';
+				switch (value) {
+					case 'a':
+						<div>{'Case A'}</div>
+						break;
+					case 'b':
+						<div>{'Case B'}</div>
+						break;
+					case 'c':
+						<div>{'Case C'}</div>
+						break;
+					default:
+						<div>{'Default Case'}</div>
+				}
+			</>;
 		}
 
 		const { body } = await render(App);
@@ -23,20 +24,21 @@ describe('SSR: switch statements', () => {
 	});
 
 	it('renders a fall-through with an empty switch case', async () => {
-		component App() {
-			let value = 'b';
-
-			switch (value) {
-				case 'a':
-					<div>{'Case A'}</div>
-					break;
-				case 'b':
-				case 'c':
-					<div>{'Case B or C'}</div>
-					break;
-				default:
-					<div>{'Default Case'}</div>
-			}
+		function App() {
+			return <>
+				let value = 'b';
+				switch (value) {
+					case 'a':
+						<div>{'Case A'}</div>
+						break;
+					case 'b':
+					case 'c':
+						<div>{'Case B or C'}</div>
+						break;
+					default:
+						<div>{'Default Case'}</div>
+				}
+			</>;
 		}
 
 		const { body } = await render(App);
@@ -44,20 +46,21 @@ describe('SSR: switch statements', () => {
 	});
 
 	it('renders a fall-through with a case that has elements', async () => {
-		component App() {
-			let value = 'a';
-
-			switch (value) {
-				case 'a':
-					<div>{'Case A'}</div>
-				case 'b':
-					<div>{'Case B'}</div>
-				case 'c':
-					<div>{'Case C'}</div>
-					break;
-				default:
-					<div>{'Default Case'}</div>
-			}
+		function App() {
+			return <>
+				let value = 'a';
+				switch (value) {
+					case 'a':
+						<div>{'Case A'}</div>
+					case 'b':
+						<div>{'Case B'}</div>
+					case 'c':
+						<div>{'Case C'}</div>
+						break;
+					default:
+						<div>{'Default Case'}</div>
+				}
+			</>;
 		}
 
 		const { body } = await render(App);
@@ -65,21 +68,22 @@ describe('SSR: switch statements', () => {
 	});
 
 	it('renders a fall-through with a default case in the middle', async () => {
-		component App() {
-			let value = 'x';
-
-			switch (value) {
-				case 'a':
-					<div>{'Case A'}</div>
-				default:
-					<div>{'Default Case'}</div>
-				case 'b':
-					<div>{'Case B'}</div>
-					break;
-				case 'c':
-					<div>{'Case C'}</div>
-					break;
-			}
+		function App() {
+			return <>
+				let value = 'x';
+				switch (value) {
+					case 'a':
+						<div>{'Case A'}</div>
+					default:
+						<div>{'Default Case'}</div>
+					case 'b':
+						<div>{'Case B'}</div>
+						break;
+					case 'c':
+						<div>{'Case C'}</div>
+						break;
+				}
+			</>;
 		}
 
 		const { body } = await render(App);
@@ -87,18 +91,19 @@ describe('SSR: switch statements', () => {
 	});
 
 	it('renders bare text nodes in switch fall-through cases without element wrappers', async () => {
-		component App() {
-			let value = 'a';
-
-			<div>
-				<span>{'before'}</span>
-				switch (value) {
-					case 'a':
-						{'Case A'}
-					case 'b':
-						{'Case B'}
-				}
-			</div>
+		function App() {
+			return <>
+				let value = 'a';
+				<div>
+					<span>{'before'}</span>
+					switch (value) {
+						case 'a':
+							{'Case A'}
+						case 'b':
+							{'Case B'}
+					}
+				</div>
+			</>;
 		}
 
 		const { body } = await render(App);
@@ -106,20 +111,21 @@ describe('SSR: switch statements', () => {
 	});
 
 	it('renders bare text nodes in switch cases without element wrappers', async () => {
-		component App() {
-			let value = 'a';
-
-			<div>
-				<span>{'before'}</span>
-				switch (value) {
-					case 'a':
-						{'Case A'}
-						break;
-					case 'b':
-						{'Case B'}
-						break;
-				}
-			</div>
+		function App() {
+			return <>
+				let value = 'a';
+				<div>
+					<span>{'before'}</span>
+					switch (value) {
+						case 'a':
+							{'Case A'}
+							break;
+						case 'b':
+							{'Case B'}
+							break;
+					}
+				</div>
+			</>;
 		}
 
 		const { body } = await render(App);

package/tests/server/track-async-serialization.test.tsrx

@@ -5,13 +5,15 @@ const TRACK_ASYNC_PUBLIC_ERROR_MESSAGE = 'An error occurred during async renderi
 
 describe('trackAsync serialization (server)', () => {
 	it('serializes resolved trackAsync data as a script tag in SSR output', async () => {
-		component App() {
-			try {
-				let &[data] = trackAsync(() => Promise.resolve('hello world'));
-				<p class="result">{data}</p>
-			} pending {
-				<p class="loading">{'loading...'}</p>
-			}
+		function App() {
+			return <>
+				try {
+					let &[data] = trackAsync(() => Promise.resolve('hello world'));
+					<p class="result">{data}</p>
+				} pending {
+					<p class="loading">{'loading...'}</p>
+				}
+			</>;
 		}
 
 		const { body } = await render(App);
@@ -22,13 +24,15 @@ describe('trackAsync serialization (server)', () => {
 	});
 
 	it('serializes numeric trackAsync data correctly', async () => {
-		component App() {
-			try {
-				let &[count] = trackAsync(() => Promise.resolve(42));
-				<span class="count">{count}</span>
-			} pending {
-				<span>{'...'}</span>
-			}
+		function App() {
+			return <>
+				try {
+					let &[count] = trackAsync(() => Promise.resolve(42));
+					<span class="count">{count}</span>
+				} pending {
+					<span>{'...'}</span>
+				}
+			</>;
 		}
 
 		const { body } = await render(App);
@@ -37,13 +41,15 @@ describe('trackAsync serialization (server)', () => {
 	});
 
 	it('serializes object trackAsync data correctly', async () => {
-		component App() {
-			try {
-				let &[data] = trackAsync(() => Promise.resolve({ name: 'Alice', age: 30 }));
-				<p>{data.name}</p>
-			} pending {
-				<p>{'...'}</p>
-			}
+		function App() {
+			return <>
+				try {
+					let &[data] = trackAsync(() => Promise.resolve({ name: 'Alice', age: 30 }));
+					<p>{data.name}</p>
+				} pending {
+					<p>{'...'}</p>
+				}
+			</>;
 		}
 
 		const { body } = await render(App);
@@ -52,17 +58,19 @@ describe('trackAsync serialization (server)', () => {
 	});
 
 	it('serializes array trackAsync data correctly', async () => {
-		component App() {
-			try {
-				let &[items] = trackAsync(() => Promise.resolve(['a', 'b', 'c']));
-				<ul>
-					for (let item of items) {
-						<li>{item}</li>
-					}
-				</ul>
-			} pending {
-				<p>{'...'}</p>
-			}
+		function App() {
+			return <>
+				try {
+					let &[items] = trackAsync(() => Promise.resolve(['a', 'b', 'c']));
+					<ul>
+						for (let item of items) {
+							<li>{item}</li>
+						}
+					</ul>
+				} pending {
+					<p>{'...'}</p>
+				}
+			</>;
 		}
 
 		const { body } = await render(App);
@@ -71,15 +79,17 @@ describe('trackAsync serialization (server)', () => {
 	});
 
 	it('serializes rejected trackAsync as error envelope', async () => {
-		component App() {
-			try {
-				let &[data] = trackAsync(() => Promise.reject(new Error('fetch failed')));
-				<p class="result">{data}</p>
-			} pending {
-				<p class="loading">{'loading...'}</p>
-			} catch (e) {
-				<p class="error">{(e as Error).message}</p>
-			}
+		function App() {
+			return <>
+				try {
+					let &[data] = trackAsync(() => Promise.reject(new Error('fetch failed')));
+					<p class="result">{data}</p>
+				} pending {
+					<p class="loading">{'loading...'}</p>
+				} catch (e) {
+					<p class="error">{(e as Error).message}</p>
+				}
+			</>;
 		}
 
 		const { body } = await render(App);
@@ -91,21 +101,25 @@ describe('trackAsync serialization (server)', () => {
 	});
 
 	it('serializes error when child component error bubbles to parent catch', async () => {
-		component Child() {
-			try {
-				let &[data] = trackAsync(() => Promise.reject(new Error('child error')));
-				<p class="result">{data}</p>
-			} pending {
-				<p class="pending">{'loading...'}</p>
-			}
+		function Child() {
+			return <>
+				try {
+					let &[data] = trackAsync(() => Promise.reject(new Error('child error')));
+					<p class="result">{data}</p>
+				} pending {
+					<p class="pending">{'loading...'}</p>
+				}
+			</>;
 		}
 
-		component Parent() {
-			try {
-				<Child />
-			} catch (e) {
-				<p class="parent-error">{(e as Error).message}</p>
-			}
+		function Parent() {
+			return <>
+				try {
+					<Child />
+				} catch (e) {
+					<p class="parent-error">{(e as Error).message}</p>
+				}
+			</>;
 		}
 
 		const { body } = await render(Parent);
@@ -117,17 +131,19 @@ describe('trackAsync serialization (server)', () => {
 	});
 
 	it('serializes sync trackAsync throw using original cause message', async () => {
-		component App() {
-			try {
-				let &[data] = trackAsync(() => {
-					throw new Error('sync failure');
-				});
-				<p class="result">{data}</p>
-			} pending {
-				<p class="loading">{'loading...'}</p>
-			} catch (e) {
-				<p class="error">{(e as Error).message}</p>
-			}
+		function App() {
+			return <>
+				try {
+					let &[data] = trackAsync(() => {
+						throw new Error('sync failure');
+					});
+					<p class="result">{data}</p>
+				} pending {
+					<p class="loading">{'loading...'}</p>
+				} catch (e) {
+					<p class="error">{(e as Error).message}</p>
+				}
+			</>;
 		}
 
 		const { body } = await render(App);
@@ -140,17 +156,19 @@ describe('trackAsync serialization (server)', () => {
 	});
 
 	it('escapes serialized error payload to keep script tag safe', async () => {
-		component App() {
-			try {
-				let &[data] = trackAsync(
-					() => Promise.reject(new Error('</script><div data-injected="1">boom</div>')),
-				);
-				<p class="result">{data}</p>
-			} pending {
-				<p class="loading">{'loading...'}</p>
-			} catch (e) {
-				<p class="error">{(e as Error).message}</p>
-			}
+		function App() {
+			return <>
+				try {
+					let &[data] = trackAsync(
+						() => Promise.reject(new Error('</script><div data-injected="1">boom</div>')),
+					);
+					<p class="result">{data}</p>
+				} pending {
+					<p class="loading">{'loading...'}</p>
+				} catch (e) {
+					<p class="error">{(e as Error).message}</p>
+				}
+			</>;
 		}
 
 		const { body } = await render(App);
@@ -164,15 +182,17 @@ describe('trackAsync serialization (server)', () => {
 	});
 
 	it('generates unique hashes for multiple trackAsync calls', async () => {
-		component App() {
-			try {
-				let &[a] = trackAsync(() => Promise.resolve('first'));
-				let &[b] = trackAsync(() => Promise.resolve('second'));
-				<p>{a}</p>
-				<p>{b}</p>
-			} pending {
-				<p>{'...'}</p>
-			}
+		function App() {
+			return <>
+				try {
+					let &[a] = trackAsync(() => Promise.resolve('first'));
+					let &[b] = trackAsync(() => Promise.resolve('second'));
+					<p>{a}</p>
+					<p>{b}</p>
+				} pending {
+					<p>{'...'}</p>
+				}
+			</>;
 		}
 
 		const { body } = await render(App);