fix(core): handle an edge case of changing dependencies without changing atom value

src/core/store.ts

@@ -349,6 +349,17 @@ export const createStore = (
       if (nextAtomState.d.has(atom)) {
         nextAtomState.d = new Map(nextAtomState.d).set(atom, nextAtomState.r)
       }
+    } else if (
+      nextAtomState.d !== atomState.d &&
+      (nextAtomState.d.size !== atomState.d.size ||
+        !Array.from(nextAtomState.d.keys()).every((a) => atomState.d.has(a)))
+    ) {
+      // value is not changed, but dependencies are changed
+      // we should schdule a flush in async
+      // FIXME any better way? https://github.com/pmndrs/jotai/issues/947
+      Promise.resolve().then(() => {
+        flushPending(version)
+      })
     }
     setAtomState(version, atom, nextAtomState)
     return nextAtomState

tests/basic.test.tsx

@@ -269,6 +269,40 @@ it('only re-renders if value has changed', async () => {
   })
 })
 
+it('re-renders a time delayed derived atom with the same initial value (#947)', async () => {
+  const aAtom = atom(false)
+  aAtom.onMount = (set) => {
+    setTimeout(() => {
+      set(true)
+    })
+  }
+
+  const bAtom = atom(1)
+  bAtom.onMount = (set) => {
+    set(2)
+  }
+
+  const cAtom = atom((get) => {
+    if (get(aAtom)) {
+      return get(bAtom)
+    }
+    return 1
+  })
+
+  const App = () => {
+    const [value] = useAtom(cAtom)
+    return <>{value}</>
+  }
+
+  const { findByText } = render(
+    <Provider>
+      <App />
+    </Provider>
+  )
+
+  await findByText('2')
+})
+
 it('works with async get', async () => {
   const countAtom = atom(0)
   const asyncCountAtom = atom(async (get) => {