[recoil-sync] useRecoilSync() raises Snapshot has already been released

[ci7lus]

Components using recoil-sync.useRecoilSync often encounter the following error:

Uncaught Error: Snapshot has already been released.
    at err (index.js:60:17)
    at Snapshot.retain (index.js:3657:15)
    at useRecoilSnapshot (index.js:5665:35)
    at useRecoilSync (index.js:347:20)
    at RecoilSharedSync (RecoilSharedSync.tsx:39:33)
    at renderWithHooks (react-dom.development.js:2691:157)
    at updateFunctionComponent (react-dom.development.js:3438:388)
    at beginWork (react-dom.development.js:3865:549)
    at HTMLUnknownElement.callCallback (react-dom.development.js:728:119)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:748:45)

RecoilStoredSync.tsx: https://github.com/ci7lus/MirakTest/blob/ee69ebe29382785dc172011a7a772aca34dfe7b4/src/components/global/RecoilSharedSync.tsx

Environment

• react: 18.1.0
• react-dom: 18.1.0
• recoil: 0.7.3
• recoil-sync: 0.1.1-alpha.1
• Electron: v19.0.4 (Chrome 102.0.5005.63)

[drarmstr]

@ci7lus - Do you have a sandbox.io reproducer?

[ci7lus]

Sorry for the delay in responding. I could not reproduce this behavior.

Sample record:

f1148aec92bcd2107cb654e2add72cb5.mp4

[drarmstr]

@ci7lus Are you using "fast refresh" and seeing this error during development?

#1891 may help with this.

[ci7lus]

Yes, I'm using fast-refresh in development, and this is seen only during development. I will check on that. Thanks!

[drarmstr]

It should be in the nightly branch build now.

[ci7lus]

It still occurs using the nightly version. I am working on reproducing it in codesandbox...

[jschaf]

I've been hitting this using code like:

  const snapshot = useRecoilSnapshot();
  prefetchMainResources(snapshot);

I've attempted to work around with the following but it didn't work.

  const snapshot = useRecoilSnapshot();
  const releaseSnapshot = snapshot.retain();
  prefetchMainResources(snapshot);
  releaseSnapshot();

React: 18.2
Recoil: Nightly (2022-08-08) (https://codeload.github.com/facebookexperimental/Recoil/tar.gz/49df4d1f1156e480bcb45ccfccc925df978377cb)

[jschaf]

To clarify, I'm using vanilla Recoil, not RecoilSync.

[sivasquared]

I am also running into this issue. I've tried the nightly version but that doesn't fix the issue. Will try and reproduce the issue in a code sandbox when I have some time.

Similar conditions as ci7lus

This only happens in development in Safari

react: 18.1.0
react-dom: 18.1.0
recoil: 0.7.2
recoil-sync: 0.1.

[Error] Error: Snapshot has already been released.
	retain (bundle.js:234569)
	useRecoilSnapshot (bundle.js:236417)
	useRecoilSync (bundle.js:228825)
	RecoilURLSync (bundle.js:230642)
	renderWithHooks (bundle.js:179024)
	updateFunctionComponent (bundle.js:182224)
	callCallback (bundle.js:166820)
	dispatchEvent
	invokeGuardedCallbackDev (bundle.js:166869)
	invokeGuardedCallback (bundle.js:166931)
	beginWork$1 (bundle.js:189944)
	performUnitOfWork (bundle.js:189077)
	workLoopSync (bundle.js:188990)
	renderRootSync (bundle.js:188959)
	performConcurrentWorkOnRoot (bundle.js:188256:93)
	performConcurrentWorkOnRoot
	workLoop (bundle.js:244582)
	flushWork (bundle.js:244556)
	performWorkUntilDeadline (bundle.js:244840)

[drarmstr]

Might be related to #1936 with potential fix in #1943