ripple 0.3.83 → 0.3.85

package/tests/client/composite/__snapshots__/composite.render.test.tsrx.snap

@@ -2,7 +2,6 @@
 
 exports[`composite > render > correct handles passing through component props and children 1`] = `
 <div>
-  <!---->
   <div>
     <div>
       I am A
@@ -17,21 +16,18 @@ exports[`composite > render > correct handles passing through component props an
     </div>
     <!---->
   </div>
-  <!---->
   
 </div>
 `;
 
 exports[`composite > render > render simple text as children 1`] = `
 <div>
-  <!---->
   <button
     class="my-button"
   >
     Click Me
     <!---->
   </button>
-  <!---->
   
 </div>
 `;

package/tests/client/object.test.tsrx

@@ -1,4 +1,4 @@
-import { RippleObject, flushSync } from 'ripple';
+import { RippleObject, effect, flushSync, snapshot } from 'ripple';
 import { TRACKED_OBJECT } from '../../src/runtime/internal/client/constants.js';
 
 describe('RippleObject', () => {
@@ -194,4 +194,50 @@ describe('RippleObject', () => {
 		expect(pre1.textContent).toBe('1');
 		expect(pre3.textContent).toBe('{"a":1,"b":1,"c":{"d":{"e":8}}}');
 	});
+
+	it('snapshot() returns a detached plain copy of current values', () => {
+		let snap: any;
+
+		function ObjectTest() @{
+			const obj = new RippleObject({ a: 1, b: 2 });
+			obj.a = 10;
+			snap = snapshot(obj);
+			// a later mutation must not affect the snapshot
+			obj.a = 99;
+			<div />
+		}
+
+		render(ObjectTest);
+
+		expect(snap).toEqual({ a: 10, b: 2 });
+		// detached: a plain object, not a proxy
+		expect(TRACKED_OBJECT in snap).toBe(false);
+		expect(snap.a).toBe(10);
+	});
+
+	it('snapshot() reads without registering reactivity', () => {
+		let runs = 0;
+
+		function ObjectTest() @{
+			const obj = new RippleObject({ a: 0 });
+			effect(() => {
+				snapshot(obj);
+				runs++;
+			});
+			<button
+				onClick={() => {
+					obj.a++;
+				}}
+			>{'Increment A'}</button>
+		}
+
+		render(ObjectTest);
+		flushSync();
+		expect(runs).toBe(1);
+
+		container.querySelectorAll('button')[0].click();
+		flushSync();
+		// snapshot did not subscribe, so the effect must not re-run
+		expect(runs).toBe(1);
+	});
 });

package/tests/client/scoped-flush.test.tsrx

@@ -0,0 +1,105 @@
+import { flushSync, track, Context } from 'ripple';
+
+describe('scoped flush', () => {
+	// Scoped descent must not change observable behaviour: a tracked shared across
+	// sibling subtrees via a module-level variable (escaping its owner subtree)
+	// must still update its out-of-subtree subscriber.
+	it('updates a sibling subtree that reads a module-smuggled tracked', () => {
+		let shared = null;
+		let bump = null;
+
+		function Producer() @{
+			let &[v, vT] = track(0);
+			shared = vT;
+			bump = () => {
+				v += 1;
+			};
+			<div class="producer">{'producer'}</div>
+		}
+
+		function Consumer() @{
+			<div class="consumer">
+				{shared ? shared.value : -1}
+			</div>
+		}
+
+		function App() @{
+			<>
+				<Producer />
+				<Consumer />
+			</>
+		}
+
+		render(App);
+
+		expect(container.querySelector('.consumer').textContent).toBe('0');
+
+		flushSync(() => bump());
+
+		expect(container.querySelector('.consumer').textContent).toBe('1');
+
+		flushSync(() => bump());
+
+		expect(container.querySelector('.consumer').textContent).toBe('2');
+	});
+
+	// The common, scope-safe case: a Context-provided tracked read at many leaves.
+	// A root update must fan out to all leaves; a scoped update must reach only the
+	// targeted subtree's leaf and leave the others untouched.
+	it('fans out a root update and scopes a nested update', () => {
+		const Ctx = new Context(null);
+		let bumpRoot = null;
+		let bumpLeftLocal = null;
+
+		function Leaf(props) @{
+			const rootT = Ctx.get();
+			<span class={'leaf-' + props.id}>
+				{rootT ? rootT.value : -1}
+			</span>
+		}
+
+		function Branch(props) @{
+			let &[local, localT] = track(0);
+			if (props.side === 'L') {
+				bumpLeftLocal = () => {
+					local += 1;
+				};
+			}
+			<div class={'branch-' + props.side}>
+				<Leaf id={props.side + '0'} />
+				<Leaf id={props.side + '1'} />
+			</div>
+		}
+
+		function App() @{
+			let &[root, rootT] = track(0);
+			Ctx.set(rootT);
+			bumpRoot = () => {
+				root += 1;
+			};
+			<div>
+				<Branch side="L" />
+				<Branch side="R" />
+			</div>
+		}
+
+		render(App);
+
+		const leaves = () => ['L0', 'L1', 'R0', 'R1'].map(
+			(id) => container.querySelector('.leaf-' + id).textContent,
+		);
+
+		expect(leaves()).toEqual(['0', '0', '0', '0']);
+
+		flushSync(() => bumpRoot());
+		expect(leaves()).toEqual(['1', '1', '1', '1']);
+
+		flushSync(() => bumpLeftLocal());
+		// Local bump touches no Context value, so leaf text is unchanged, but the
+		// update must flush without error and not disturb sibling subtrees.
+		expect(leaves()).toEqual(['1', '1', '1', '1']);
+
+		flushSync(() => bumpRoot());
+		expect(leaves()).toEqual(['2', '2', '2', '2']);
+	});
+});