From 07e883ca12ff1483e7a771fb556da018e414bd9d Mon Sep 17 00:00:00 2001
From: Michael Sweeney <overthemike@gmail.com>
Date: Sat, 26 Oct 2024 00:36:50 -0700
Subject: [PATCH] added more tests for useSnapshot

---
 tests/proxyMap.test.tsx | 104 ++++++++++++++++++++++++++++++++++++++++
 tests/proxySet.test.tsx | 104 ++++++++++++++++++++++++++++++++++++++++
 2 files changed, 208 insertions(+)

diff --git a/tests/proxyMap.test.tsx b/tests/proxyMap.test.tsx
index b11a7a72..44ccb453 100644
--- a/tests/proxyMap.test.tsx
+++ b/tests/proxyMap.test.tsx
@@ -466,6 +466,110 @@ describe('ui updates - useSnapshot', async () => {
     })
   })
 
+  it('should update ui when calling has before and after settiing multile keys and deleting a single one (first item)', async () => {
+    const state = proxyMap()
+    const TestComponent = () => {
+      const snap = useSnapshot(state)
+
+      return (
+        <>
+          <p>has key: {`${snap.has('key')}`}</p>
+          <p>has key2: {`${snap.has('key2')}`}</p>
+          <button
+            onClick={() => {
+              state.set('key', 'value')
+              state.set('key2', 'value')
+            }}
+          >
+            set keys
+          </button>
+          <button
+            onClick={() => {
+              state.delete('key')
+            }}
+          >
+            delete keys
+          </button>
+        </>
+      )
+    }
+
+    const { getByText } = render(
+      <StrictMode>
+        <TestComponent />
+      </StrictMode>,
+    )
+
+    await waitFor(() => {
+      getByText('has key: false')
+      getByText('has key2: false')
+    })
+
+    fireEvent.click(getByText('set keys'))
+    await waitFor(() => {
+      getByText('has key: true')
+      getByText('has key2: true')
+    })
+
+    fireEvent.click(getByText('delete keys'))
+    await waitFor(() => {
+      getByText('has key: false')
+      getByText('has key2: true')
+    })
+  })
+
+  it('should update ui when calling has before and after settiing multile keys and deleting a single one (first item)', async () => {
+    const state = proxyMap()
+    const TestComponent = () => {
+      const snap = useSnapshot(state)
+
+      return (
+        <>
+          <p>has key: {`${snap.has('key')}`}</p>
+          <p>has key2: {`${snap.has('key2')}`}</p>
+          <button
+            onClick={() => {
+              state.set('key', 'value')
+              state.set('key2', 'value')
+            }}
+          >
+            set keys
+          </button>
+          <button
+            onClick={() => {
+              state.delete('key2')
+            }}
+          >
+            delete keys
+          </button>
+        </>
+      )
+    }
+
+    const { getByText } = render(
+      <StrictMode>
+        <TestComponent />
+      </StrictMode>,
+    )
+
+    await waitFor(() => {
+      getByText('has key: false')
+      getByText('has key2: false')
+    })
+
+    fireEvent.click(getByText('set keys'))
+    await waitFor(() => {
+      getByText('has key: true')
+      getByText('has key2: true')
+    })
+
+    fireEvent.click(getByText('delete keys'))
+    await waitFor(() => {
+      getByText('has key: true')
+      getByText('has key2: false')
+    })
+  })
+
   it('should update ui when clearing the map', async () => {
     const state = proxyMap()
     const TestComponent = () => {
diff --git a/tests/proxySet.test.tsx b/tests/proxySet.test.tsx
index a5c9b07e..f9b4cd53 100644
--- a/tests/proxySet.test.tsx
+++ b/tests/proxySet.test.tsx
@@ -462,6 +462,110 @@ describe('ui updates - useSnapshot', async () => {
     })
   })
 
+  it('should update ui when calling has before and after settiing multiple values and deleting a single one (first item)', async () => {
+    const state = proxySet()
+    const TestComponent = () => {
+      const snap = useSnapshot(state)
+
+      return (
+        <>
+          <p>has value: {`${snap.has('value')}`}</p>
+          <p>has value2: {`${snap.has('value2')}`}</p>
+          <button
+            onClick={() => {
+              state.add('value')
+              state.add('value2')
+            }}
+          >
+            add values
+          </button>
+          <button
+            onClick={() => {
+              state.delete('value')
+            }}
+          >
+            delete values
+          </button>
+        </>
+      )
+    }
+
+    const { getByText } = render(
+      <StrictMode>
+        <TestComponent />
+      </StrictMode>,
+    )
+
+    await waitFor(() => {
+      getByText('has value: false')
+      getByText('has value2: false')
+    })
+
+    fireEvent.click(getByText('add values'))
+    await waitFor(() => {
+      getByText('has value: true')
+      getByText('has value2: true')
+    })
+
+    fireEvent.click(getByText('delete values'))
+    await waitFor(() => {
+      getByText('has value: false')
+      getByText('has value2: true')
+    })
+  })
+
+  it('should update ui when calling has before and after settiing multiple values and deleting a single one (second item)', async () => {
+    const state = proxySet()
+    const TestComponent = () => {
+      const snap = useSnapshot(state)
+
+      return (
+        <>
+          <p>has value: {`${snap.has('value')}`}</p>
+          <p>has value2: {`${snap.has('value2')}`}</p>
+          <button
+            onClick={() => {
+              state.add('value')
+              state.add('value2')
+            }}
+          >
+            add values
+          </button>
+          <button
+            onClick={() => {
+              state.delete('value2')
+            }}
+          >
+            delete values
+          </button>
+        </>
+      )
+    }
+
+    const { getByText } = render(
+      <StrictMode>
+        <TestComponent />
+      </StrictMode>,
+    )
+
+    await waitFor(() => {
+      getByText('has value: false')
+      getByText('has value2: false')
+    })
+
+    fireEvent.click(getByText('add values'))
+    await waitFor(() => {
+      getByText('has value: true')
+      getByText('has value2: true')
+    })
+
+    fireEvent.click(getByText('delete values'))
+    await waitFor(() => {
+      getByText('has value: true')
+      getByText('has value2: false')
+    })
+  })
+
   it('should update ui when clearing the set', async () => {
     const state = proxySet()
     const TestComponent = () => {