refactor tests

tests/react/async2.test.tsx

@@ -1,8 +1,8 @@
 import { StrictMode, Suspense } from 'react'
-import { act, fireEvent, render, waitFor } from '@testing-library/react'
+import { fireEvent, render, waitFor } from '@testing-library/react'
 import { assert, describe, expect, it } from 'vitest'
-import { Provider, useAtom, useAtomValue, useSetAtom } from 'jotai/react'
-import { SetStateAction, atom, createStore } from 'jotai/vanilla'
+import { useAtom, useAtomValue, useSetAtom } from 'jotai/react'
+import { atom } from 'jotai/vanilla'
 
 describe('useAtom delay option test', () => {
   it('suspend for Promise.resovle without delay option', async () => {
@@ -142,71 +142,76 @@ describe('atom read function setSelf option test', () => {
   })
 })
 
-it('resolves dependencies reliably after a delay', async () => {
-  expect.assertions(1)
-  const countAtom = atom(0)
-
-  let result: number | null = null
-  const resolve: (() => void)[] = []
-  const asyncAtom = atom(async (get) => {
-    const count = get(countAtom)
-    await new Promise<void>((r: { (): void; count?: number }) => {
-      r.count = count
-      resolve.push(r)
+describe('timing issue with setSelf', () => {
+  it('resolves dependencies reliably after a delay (#2192)', async () => {
+    expect.assertions(1)
+    const countAtom = atom(0)
+
+    let result: number | null = null
+    const resolve: (() => void)[] = []
+    const asyncAtom = atom(async (get) => {
+      const count = get(countAtom)
+      await new Promise<void>((r) => resolve.push(r))
+      return count
     })
-    return count
-  })
 
-  const derivedAtom = atom(
-    async (get, { setSelf }) => {
-      get(countAtom)
-      await Promise.resolve()
-      const resultCount = await get(asyncAtom)
-      result = resultCount
-      if (resultCount === 2) setSelf() // <-- necessary
-    },
-    () => {}
-  )
-
-  const derivedSyncAtom = atom((get) => {
-    get(derivedAtom)
-  })
+    const derivedAtom = atom(
+      async (get, { setSelf }) => {
+        get(countAtom)
+        await Promise.resolve()
+        const resultCount = await get(asyncAtom)
+        result = resultCount
+        if (resultCount === 2) setSelf() // <-- necessary
+      },
+      () => {}
+    )
 
-  function useTest() {
-    useAtom(derivedSyncAtom)
-    useAtom(countAtom)
-  }
-  function TestComponent() {
-    useTest()
-    return null
-  }
-  const store = createStore()
+    const derivedSyncAtom = atom((get) => {
+      get(derivedAtom)
+    })
 
-  const Wrapper = ({ children }: React.PropsWithChildren) => (
-    <Provider store={store}>{children}</Provider>
-  )
-  render(<TestComponent />, { wrapper: Wrapper })
+    const increment = (c: number) => c + 1
+    function TestComponent() {
+      useAtom(derivedSyncAtom)
+      const [count, setCount] = useAtom(countAtom)
+      const onClick = () => {
+        setCount(increment)
+        setCount(increment)
+      }
+      return (
+        <>
+          count: {count}
+          <button onClick={onClick}>button</button>
+        </>
+      )
+    }
 
-  const setCount = (arg: SetStateAction<number>) => store.set(countAtom, arg)
-  const increment = (c: number) => c + 1
-  await waitFor(() => assert(resolve.length === 1))
+    const { getByText, findByText } = render(
+      <StrictMode>
+        <TestComponent />
+      </StrictMode>
+    )
 
-  resolve[0]!()
+    await waitFor(() => assert(resolve.length === 1))
+    resolve[0]!()
 
-  await act(() => setCount(increment))
-  await act(() => setCount(increment))
+    // The use of fireEvent is required to reproduce the issue
+    fireEvent.click(getByText('button'))
 
-  resolve[1]!()
-  resolve[2]!()
+    await waitFor(() => assert(resolve.length === 3))
+    resolve[1]!()
+    resolve[2]!()
 
-  await waitFor(() => assert(result === 2))
+    await waitFor(() => assert(result === 2))
 
-  await act(() => setCount(increment))
-  await act(() => setCount(increment))
+    // The use of fireEvent is required to reproduce the issue
+    fireEvent.click(getByText('button'))
 
-  resolve[3]!()
-  resolve[4]!()
+    await waitFor(() => assert(resolve.length === 5))
+    resolve[3]!()
+    resolve[4]!()
 
-  await waitFor(() => assert(store.get(countAtom) === 4))
-  expect(result).toBe(4) // 3
+    await findByText('count: 4')
+    expect(result).toBe(4) // 3
+  })
 })

tests/vanilla/store.test.tsx

@@ -425,18 +425,15 @@ it('should update derived atoms during write (#2107)', async () => {
   expect(store.get(countAtom)).toBe(2)
 })
 
-it.only('resolves dependencies reliably after a delay', async () => {
+it('resolves dependencies reliably after a delay (#2192)', async () => {
   expect.assertions(1)
   const countAtom = atom(0)
   let result: number | null = null
 
   const resolve: (() => void)[] = []
   const asyncAtom = atom(async (get) => {
     const count = get(countAtom)
-    await new Promise<void>((r: { (): void; count?: number }) => {
-      r.count = count
-      resolve.push(r)
-    })
+    await new Promise<void>((r) => resolve.push(r))
     return count
   })