From d2ea95b080924beff2198cc4b2cf9d7fd6d5b2a4 Mon Sep 17 00:00:00 2001
From: Dor Shtaif <dorshtaif@gmail.com>
Date: Fri, 27 Dec 2024 21:49:45 +0200
Subject: [PATCH] tests for rapid yielding iterables value batching for
 `useAsyncIter` and `<Iterate>`

---
 spec/tests/Iterate.spec.tsx     | 36 +++++++++++++++++++++++++++++++++
 spec/tests/useAsyncIter.spec.ts | 27 +++++++++++++++++++++++++
 2 files changed, 63 insertions(+)

diff --git a/spec/tests/Iterate.spec.tsx b/spec/tests/Iterate.spec.tsx
index ba87325..432a9d1 100644
--- a/spec/tests/Iterate.spec.tsx
+++ b/spec/tests/Iterate.spec.tsx
@@ -631,6 +631,42 @@ describe('`Iterate` component', () => {
       expect(channelReturnSpy).toHaveBeenCalledOnce();
     }
   });
+
+  it(
+    gray(
+      'When given a rapid yielding iterable, consecutive values are batched into a single render that takes only the last value'
+    ),
+    async () => {
+      const iter = (async function* () {
+        yield* ['a', 'b', 'c'];
+      })();
+      let timesRerendered = 0;
+      let lastRenderFnInput: undefined | IterationResult<string>;
+
+      const rendered = render(
+        <Iterate value={iter}>
+          {next => {
+            timesRerendered++;
+            lastRenderFnInput = next;
+            return <div id="test-created-elem">Render count: {timesRerendered}</div>;
+          }}
+        </Iterate>
+      );
+
+      await act(() => {});
+
+      expect(lastRenderFnInput).toStrictEqual({
+        value: 'c',
+        pendingFirst: false,
+        done: true,
+        error: undefined,
+      });
+      expect(timesRerendered).toStrictEqual(2);
+      expect(rendered.container.innerHTML).toStrictEqual(
+        '<div id="test-created-elem">Render count: 2</div>'
+      );
+    }
+  );
 });
 
 const simulatedError = new Error('🚨 Simulated Error 🚨');
diff --git a/spec/tests/useAsyncIter.spec.ts b/spec/tests/useAsyncIter.spec.ts
index 6d6471c..5243b04 100644
--- a/spec/tests/useAsyncIter.spec.ts
+++ b/spec/tests/useAsyncIter.spec.ts
@@ -444,6 +444,33 @@ describe('`useAsyncIter` hook', () => {
       expect(channelReturnSpy).toHaveBeenCalledOnce();
     }
   });
+
+  it(
+    gray(
+      'When given a rapid yielding iterable, consecutive values are batched into a single render that takes only the last value'
+    ),
+    async () => {
+      let timesRerendered = 0;
+      const iter = (async function* () {
+        yield* ['a', 'b', 'c'];
+      })();
+
+      const renderedHook = renderHook(() => {
+        timesRerendered++;
+        return useAsyncIter(iter);
+      });
+
+      await act(() => {});
+
+      expect(timesRerendered).toStrictEqual(2);
+      expect(renderedHook.result.current).toStrictEqual({
+        value: 'c',
+        pendingFirst: false,
+        done: true,
+        error: undefined,
+      });
+    }
+  );
 });
 
 const simulatedError = new Error('🚨 Simulated Error 🚨');