ripple 0.2.151 → 0.2.153

package/tests/client/array/array.derived.test.ripple

@@ -4,8 +4,8 @@ describe('TrackedArray > derived', () => {
 	it('handles array methods that return values (map, filter, etc.)', () => {
 		component ArrayTest() {
 			let items = new TrackedArray(1, 2, 3, 4, 5);
-			let doubled = track(() => items.map(x => x * 2));
-			let filtered = track(() => items.filter(x => (x % 2) === 0));
+			let doubled = track(() => items.map((x) => x * 2));
+			let filtered = track(() => items.filter((x) => x % 2 === 0));
 			let reduced = track(() => items.reduce((acc, val) => acc + val, 0));
 			let includes = track(() => items.includes(3));
 
@@ -91,13 +91,17 @@ describe('TrackedArray > derived', () => {
 	it('handles find and findIndex methods with reactivity', () => {
 		component ArrayTest() {
 			let items = new TrackedArray(5, 10, 15, 20, 25);
-			let found = track(() => items.find(x => x > 12));
-			let foundIndex = track(() => items.findIndex(x => x > 12));
-
-			<button onClick={() => {
-				items[1] = 13;
-				items[0] = 6;
-			}}>{'update values'}</button>
+			let found = track(() => items.find((x) => x > 12));
+			let foundIndex = track(() => items.findIndex((x) => x > 12));
+
+			<button
+				onClick={() => {
+					items[1] = 13;
+					items[0] = 6;
+				}}
+			>
+				{'update values'}
+			</button>
 			<pre>{@found}</pre>
 			<pre>{@foundIndex}</pre>
 		}
@@ -121,13 +125,17 @@ describe('TrackedArray > derived', () => {
 	it('handles findLast and findLastIndex methods with reactivity', () => {
 		component ArrayTest() {
 			let items = new TrackedArray(5, 15, 10, 20, 15);
-			let foundLast = track(() => items.findLast(x => x === 15));
-			let foundLastIndex = track(() => items.findLastIndex(x => x === 15));
-
-			<button onClick={() => {
-				items[1] = 25;
-				items[4] = 15;
-			}}>{'update values'}</button>
+			let foundLast = track(() => items.findLast((x) => x === 15));
+			let foundLastIndex = track(() => items.findLastIndex((x) => x === 15));
+
+			<button
+				onClick={() => {
+					items[1] = 25;
+					items[4] = 15;
+				}}
+			>
+				{'update values'}
+			</button>
 			<pre>{@foundLast}</pre>
 			<pre>{@foundLastIndex}</pre>
 		}
@@ -151,13 +159,17 @@ describe('TrackedArray > derived', () => {
 	it('handles every method with reactivity', () => {
 		component ArrayTest() {
 			let items = new TrackedArray(2, 4, 6, 8);
-			let allEven = track(() => items.every(x => x % 2 === 0));
+			let allEven = track(() => items.every((x) => x % 2 === 0));
 
 			<button onClick={() => items.push(3)}>{'add odd'}</button>
-			<button onClick={() => {
-				items.pop();
-				items.push(10);
-			}}>{'ensure all even'}</button>
+			<button
+				onClick={() => {
+					items.pop();
+					items.push(10);
+				}}
+			>
+				{'ensure all even'}
+			</button>
 			<pre>{@allEven.toString()}</pre>
 		}
 
@@ -209,7 +221,7 @@ describe('TrackedArray > derived', () => {
 	it('handles flatMap method with reactivity', () => {
 		component ArrayTest() {
 			let items = new TrackedArray(1, 2, 3);
-			let flatMapped = track(() => items.flatMap(x => [x, x * 2]));
+			let flatMapped = track(() => items.flatMap((x) => [x, x * 2]));
 
 			<button onClick={() => items.push(4)}>{'add item'}</button>
 			<pre>{JSON.stringify(items)}</pre>
@@ -254,7 +266,9 @@ describe('TrackedArray > derived', () => {
 		addButton.click();
 		flushSync();
 
-		expect(container.querySelectorAll('pre')[0].textContent).toBe('["apple","banana","cherry","date"]');
+		expect(container.querySelectorAll('pre')[0].textContent).toBe(
+			'["apple","banana","cherry","date"]',
+		);
 		expect(container.querySelectorAll('pre')[1].textContent).toBe('apple, banana, cherry, date');
 	});
 
@@ -263,9 +277,13 @@ describe('TrackedArray > derived', () => {
 			let items = new TrackedArray(1, 2, 3, 2, 1);
 			let lastIndex = track(() => items.lastIndexOf(2));
 
-			<button onClick={() => {
-				items.push(2);
-			}}>{'add duplicate'}</button>
+			<button
+				onClick={() => {
+					items.push(2);
+				}}
+			>
+				{'add duplicate'}
+			</button>
 			<pre>{JSON.stringify(items)}</pre>
 			<pre>{@lastIndex}</pre>
 		}
@@ -315,13 +333,17 @@ describe('TrackedArray > derived', () => {
 	it('handles some method with reactivity', () => {
 		component ArrayTest() {
 			let items = new TrackedArray(1, 3, 5, 7);
-			let hasEven = track(() => items.some(x => x % 2 === 0));
+			let hasEven = track(() => items.some((x) => x % 2 === 0));
 
 			<button onClick={() => items.push(2)}>{'add even'}</button>
-			<button onClick={() => {
-				items.pop();
-				items.push(9);
-			}}>{'ensure all odd'}</button>
+			<button
+				onClick={() => {
+					items.pop();
+					items.push(9);
+				}}
+			>
+				{'ensure all odd'}
+			</button>
 			<pre>{@hasEven.toString()}</pre>
 		}
 
@@ -349,7 +371,13 @@ describe('TrackedArray > derived', () => {
 			let items = new TrackedArray(1000, 2000, 3000);
 			let localized = track(() => items.toLocaleString('en-US'));
 
-			<button onClick={() => {items[2] = 4000}}>{'add item'}</button>
+			<button
+				onClick={() => {
+					items[2] = 4000;
+				}}
+			>
+				{'add item'}
+			</button>
 			<pre>{JSON.stringify(items)}</pre>
 			<pre>{@localized}</pre>
 		}
@@ -397,7 +425,7 @@ describe('TrackedArray > derived', () => {
 	});
 
 	it('handles with method with reactivity', (context) => {
-		if (!('with' in Array.prototype)) {
+		if (!'with' in Array.prototype) {
 			context.skip();
 		}
 

package/tests/client/array/array.iteration.test.ripple

@@ -24,7 +24,9 @@ describe('TrackedArray > iteration', () => {
 		flushSync();
 
 		expect(container.querySelectorAll('pre')[0].textContent).toBe('["a","b","c","d"]');
-		expect(container.querySelectorAll('pre')[1].textContent).toBe('[[0,"a"],[1,"b"],[2,"c"],[3,"d"]]');
+		expect(container.querySelectorAll('pre')[1].textContent).toBe(
+			'[[0,"a"],[1,"b"],[2,"c"],[3,"d"]]',
+		);
 	});
 
 	it('handles keys method with reactivity', () => {

package/tests/client/array/array.mutations.test.ripple

@@ -7,7 +7,7 @@ describe('TrackedArray > mutations', () => {
 
 			<button onClick={() => items[items.length] = items.length + 1}>{'increment'}</button>
 
-			<Child items={items} />
+			<Child {items} />
 		}
 
 		component Child({ items }: { items: TrackedArray<number> }) {
@@ -15,21 +15,21 @@ describe('TrackedArray > mutations', () => {
 			<pre>{items.length}</pre>
 		}
 
-			render(ArrayTest);
+		render(ArrayTest);
 
-			const button = container.querySelector('button');
+		const button = container.querySelector('button');
 
-			button.click();
-			flushSync();
+		button.click();
+		flushSync();
 
-			expect(container.querySelectorAll('pre')[0].textContent).toBe('[1,2,3,4]');
-			expect(container.querySelectorAll('pre')[1].textContent).toBe('4');
+		expect(container.querySelectorAll('pre')[0].textContent).toBe('[1,2,3,4]');
+		expect(container.querySelectorAll('pre')[1].textContent).toBe('4');
 
-			button.click();
-			flushSync();
+		button.click();
+		flushSync();
 
-			expect(container.querySelectorAll('pre')[0].textContent).toBe('[1,2,3,4,5]');
-			expect(container.querySelectorAll('pre')[1].textContent).toBe('5');
+		expect(container.querySelectorAll('pre')[0].textContent).toBe('[1,2,3,4,5]');
+		expect(container.querySelectorAll('pre')[1].textContent).toBe('5');
 	});
 
 	it('handles push and pop operations with reactivity', () => {
@@ -44,7 +44,7 @@ describe('TrackedArray > mutations', () => {
 			<pre>{@lastItem}</pre>
 		}
 
-    	render(ArrayTest);
+		render(ArrayTest);
 
 		const pushButton = container.querySelectorAll('button')[0];
 		const popButton = container.querySelectorAll('button')[1];
@@ -69,7 +69,7 @@ describe('TrackedArray > mutations', () => {
 		expect(container.querySelectorAll('pre')[0].textContent).toBe('[1,2,3]');
 		expect(container.querySelectorAll('pre')[1].textContent).toBe('3');
 		expect(container.querySelectorAll('pre')[2].textContent).toBe('3');
-  });
+	});
 
 	it('handles shift and unshift operations with reactivity', () => {
 		component ArrayTest() {
@@ -234,7 +234,9 @@ describe('TrackedArray > mutations', () => {
 		component ArrayTest() {
 			let items = new TrackedArray(1, 2, 3);
 
-			<button onClick={() => items.forEach((item, i) => items[i] = item * 2)}>{'double all'}</button>
+			<button onClick={() => items.forEach((item, i) => items[i] = item * 2)}>
+				{'double all'}
+			</button>
 			<pre>{JSON.stringify(items)}</pre>
 		}
 
@@ -256,7 +258,9 @@ describe('TrackedArray > mutations', () => {
 		component ArrayTest() {
 			let items = new TrackedArray(1, 2, 3);
 
-			<button onClick={() => items.forEach((item, i) => items[i] = item * 2)}>{'double all'}</button>
+			<button onClick={() => items.forEach((item, i) => items[i] = item * 2)}>
+				{'double all'}
+			</button>
 
 			for (const item of items) {
 				<pre>{item}</pre>

package/tests/client/array/array.static.test.ripple

@@ -35,121 +35,129 @@ describe('TrackedArray > static', () => {
 		expect(container.querySelectorAll('pre')[1].textContent).toBe('[4,5,6,7]');
 	});
 
-	('fromAsync' in Array.prototype ? describe : describe.skip)('TrackedArray fromAsync', async () => {
-		it('handles static fromAsync method with reactivity', async () => {
-			component Parent() {
-				try {
-					<ArrayTest />
-				} pending {
-					<div>{'Loading placeholder...'}</div>
+	('fromAsync' in Array.prototype ? describe : describe.skip)(
+		'TrackedArray fromAsync',
+		async () => {
+			it('handles static fromAsync method with reactivity', async () => {
+				component Parent() {
+					try {
+						<ArrayTest />
+					} pending {
+						<div>{'Loading placeholder...'}</div>
+					}
 				}
-			}
 
-			component ArrayTest() {
-				let items = await TrackedArray.fromAsync([1, 2, 3]);
+				component ArrayTest() {
+					let items = await TrackedArray.fromAsync([1, 2, 3]);
 
-				<button onClick={() => {
-					if (items) items.push(4);
-				}}>{'add item'}</button>
+					<button
+						onClick={() => {
+							if (items) items.push(4);
+						}}
+					>
+						{'add item'}
+					</button>
 
-				<pre>{JSON.stringify(items)}</pre>
-			}
+					<pre>{JSON.stringify(items)}</pre>
+				}
 
-			render(Parent);
+				render(Parent);
 
-			await new Promise(resolve => setTimeout(resolve, 0));
-			flushSync();
+				await new Promise((resolve) => setTimeout(resolve, 0));
+				flushSync();
 
-			const addButton = container.querySelector('button');
+				const addButton = container.querySelector('button');
 
-			expect(container.querySelectorAll('pre')[0].textContent).toBe('[1,2,3]');
+				expect(container.querySelectorAll('pre')[0].textContent).toBe('[1,2,3]');
 
-			// Test adding an item to the async-created array
-			addButton.click();
-			flushSync();
+				// Test adding an item to the async-created array
+				addButton.click();
+				flushSync();
 
-			expect(container.querySelectorAll('pre')[1].textContent).toBe('[1,2,3,4]');
-		});
+				expect(container.querySelectorAll('pre')[1].textContent).toBe('[1,2,3,4]');
+			});
 
-		it('handles static fromAsync method with mapping function', async () => {
-			component Parent() {
-				try {
-					<ArrayTest />
-				} pending {
-					<div>{'Loading placeholder...'}</div>
+			it('handles static fromAsync method with mapping function', async () => {
+				component Parent() {
+					try {
+						<ArrayTest />
+					} pending {
+						<div>{'Loading placeholder...'}</div>
+					}
 				}
-			}
 
-			component ArrayTest() {
-				let items = await TrackedArray.fromAsync(
-					[1, 2, 3],
-					(x: number) => x * 2
-				);
-
-				<button onClick={() => {
-					if (items) items.push(8);
-				}}>{'add item'}</button>
-				<pre>{items ? JSON.stringify(items) : 'Loading...'}</pre>
-			}
+				component ArrayTest() {
+					let items = await TrackedArray.fromAsync([1, 2, 3], (x: number) => x * 2);
+
+					<button
+						onClick={() => {
+							if (items) items.push(8);
+						}}
+					>
+						{'add item'}
+					</button>
+					<pre>{items ? JSON.stringify(items) : 'Loading...'}</pre>
+				}
 
-			render(Parent);
+				render(Parent);
 
-			await new Promise(resolve => setTimeout(resolve, 0));
-			flushSync();
+				await new Promise((resolve) => setTimeout(resolve, 0));
+				flushSync();
 
-			const addButton = container.querySelector('button');
+				const addButton = container.querySelector('button');
 
-			expect(container.querySelector('pre').textContent).toBe('[2,4,6]');
+				expect(container.querySelector('pre').textContent).toBe('[2,4,6]');
 
-			addButton.click();
-			flushSync();
+				addButton.click();
+				flushSync();
 
-			expect(container.querySelector('pre').textContent).toBe('[2,4,6,8]');
-		});
+				expect(container.querySelector('pre').textContent).toBe('[2,4,6,8]');
+			});
 
-		// TODO: Fix this test case, needs some async love around try statements being using in a not template way
-		it.skip('handles error in fromAsync method', async () => {
-			component Parent() {
-				try {
-					<ArrayTest />
-				} pending {
-					<div>{'Loading placeholder...'}</div>
+			// TODO: Fix this test case, needs some async love around try statements being using in a not template way
+			it.skip('handles error in fromAsync method', async () => {
+				component Parent() {
+					try {
+						<ArrayTest />
+					} pending {
+						<div>{'Loading placeholder...'}</div>
+					}
 				}
-			}
 
-			component ArrayTest() {
-				let items = null;
-				let error = null;
+				component ArrayTest() {
+					let items = null;
+					let error = null;
 
-				// try {
-				// 	items = await TrackedArray.fromAsync(Promise.reject(new Error('Async error')));
-				// } catch (e) {
-				// }
-			}
+					// try {
+					// 	items = await TrackedArray.fromAsync(Promise.reject(new Error('Async error')));
+					// } catch (e) {
+					// }
+				}
 
-			component ArrayTest() {
-				let items = null;
-				let error = null;
+				component ArrayTest() {
+					let items = null;
+					let error = null;
 
-				try {
-					// items = await TrackedArray.fromAsync(Promise.reject(new Error('Async error')));
-				} catch (e) {
-					error = (e as Error).message;
-				}
+					try {
+						// items = await TrackedArray.fromAsync(Promise.reject(new Error('Async error')));
+					} catch (e) {
+						error = (e as Error).message;
+					}
 
-				<pre>{error ? 'Error: ' + error : 'No error'}</pre>
-				<pre>{items ? JSON.stringify(items) : 'No items'}</pre>
-			}
+					<pre>{error ? 'Error: ' + error : 'No error'}</pre>
+					<pre>{items ? JSON.stringify(items) : 'No items'}</pre>
+				}
 
-			render(Parent);
+				render(Parent);
 
-			await new Promise(resolve => setTimeout(resolve, 0));
-			flushSync();
+				await new Promise((resolve) => setTimeout(resolve, 0));
+				flushSync();
 
-			expect(container.querySelectorAll('pre')[0].textContent).toBe('Error: Async error');
-			expect(container.querySelectorAll('pre')[1].textContent).toBe('No items');
-		});
-	});
+				expect(container.querySelectorAll('pre')[0].textContent).toBe('Error: Async error');
+				expect(container.querySelectorAll('pre')[1].textContent).toBe('No items');
+			});
+		},
+	);
 
 	describe('Creates TrackedArray with a single element', () => {
 		it('specifies int', () => {
@@ -209,29 +217,32 @@ describe('TrackedArray > static', () => {
 			expect(container.querySelectorAll('pre')[1].textContent).toBe('1');
 		});
 
-		('fromAsync' in Array.prototype ? it : it.skip)('specifies int using static fromAsync method', async () => {
-			component Parent() {
-				try {
-					<ArrayTest />
-				} pending {
-					<div>{'Loading placeholder...'}</div>
+		('fromAsync' in Array.prototype ? it : it.skip)(
+			'specifies int using static fromAsync method',
+			async () => {
+				component Parent() {
+					try {
+						<ArrayTest />
+					} pending {
+						<div>{'Loading placeholder...'}</div>
+					}
 				}
-			}
 
-			component ArrayTest() {
-				const items = await TrackedArray.fromAsync([6]);
+				component ArrayTest() {
+					const items = await TrackedArray.fromAsync([6]);
 
-				<pre>{items ? JSON.stringify(items) : 'Loading...'}</pre>
-				<pre>{items ? items.length : ''}</pre>
-			}
+					<pre>{items ? JSON.stringify(items) : 'Loading...'}</pre>
+					<pre>{items ? items.length : ''}</pre>
+				}
 
-			render(Parent);
+				render(Parent);
 
-			await new Promise(resolve => setTimeout(resolve, 0));
-			flushSync();
+				await new Promise((resolve) => setTimeout(resolve, 0));
+				flushSync();
 
-			expect(container.querySelectorAll('pre')[0].textContent).toBe('[6]');
-			expect(container.querySelectorAll('pre')[1].textContent).toBe('1');
-		});
+				expect(container.querySelectorAll('pre')[0].textContent).toBe('[6]');
+				expect(container.querySelectorAll('pre')[1].textContent).toBe('1');
+			},
+		);
 	});
 });

package/tests/client/array/array.to-methods.test.ripple

@@ -2,7 +2,7 @@ import { track, flushSync, TrackedArray } from 'ripple';
 
 describe('TrackedArray > to* methods', () => {
 	it('handles toReversed method with reactivity', (context) => {
-		if (!('toReversed' in Array.prototype)) {
+		if (!'toReversed' in Array.prototype) {
 			context.skip();
 		}
 
@@ -32,7 +32,7 @@ describe('TrackedArray > to* methods', () => {
 	});
 
 	it('handles toSorted method with reactivity', (context) => {
-		if (!('toSorted' in Array.prototype)) {
+		if (!'toSorted' in Array.prototype) {
 			context.skip();
 		}
 
@@ -62,7 +62,7 @@ describe('TrackedArray > to* methods', () => {
 	});
 
 	it('handles toSpliced method with reactivity', (context) => {
-		if (!('toSpliced' in Array.prototype)) {
+		if (!'toSpliced' in Array.prototype) {
 			context.skip();
 		}