Selector is not updated after error happens

[leoblum]

Version

recoil 0.4.0
react 17.0.0

Steps to reproduce

1. Create atom
2. Create selected connected to that atom
3. Set atom value to automatically fetch data by selector
4. When error happens in selector and you change atom value the selector return previous error again (selector not called to fetch new data)

Expected behaviour

After error in selector when change atom value selector refetch new data.

Example

https://codesandbox.io/s/lucid-pasteur-o88bq?file=/src/index.js

Open console to see logs (set for atom and get for selector).
To reproduce click Next Id two times. Then close react error window and click Recover – you will see in logs that atom is set, but not get for selector and error happens again.

[drarmstr]

Hmm, when I click [Recover] button a second time it does recover.

Does this issue reproduce with the #1132 fix in the nightly build?

[leoblum]

Hi @drarmstr.

Yes, second time it's recover a value. You even can uncomment ItemLoadable and see that in reality selector value is changed after atom value changed. But const item = useRecoilValue(Item); returns cached error.

I not sure how to install nightly build to check. When I do in my project

cd node_modules/
rm -rf recoil
git clone https://github.com/facebookexperimental/Recoil.git recoil
cd recoil
npm i
npm run build

and then started my project I had an error in browser console:

react.development.js:1476 Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.
    at resolveDispatcher (react.development.js:1476)
    at useContext2 (react.development.js:1484)
    at useStoreRef$3 (recoil.js:3606)
    at RecoilRoot$2 (recoil.js:3951)
    at renderWithHooks (react-dom.development.js:14985)
    at mountIndeterminateComponent (react-dom.development.js:17811)
    at beginWork (react-dom.development.js:19049)
    at HTMLUnknownElement.callCallback2 (react-dom.development.js:3945)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:3994)
    at invokeGuardedCallback (react-dom.development.js:4056)

So, do you have instructions how to install recoil from master?

[leoblum]

Hi, @drarmstr. I have to install nightly as npm i facebookexperimental/Recoil#nightly and the error still exists 😔 So I guess #1132 does not fix it.

Also, I created a repo with an example code, so maybe this would be helpful for you to investigate this issue.
https://github.com/leoblum/recoil-1186

[csantos42]

hey @leoblum thanks for the code samples, I believe this is due to #1076 -- there's a workaround in the last comment in that issue, could you try that out to see if it resolves your issue in the meantime?

[vladkens]

Hi. I also facing same problem. I update @leoblum example with the package from #496 (comment) and it seems not effect for double crash.

Recoil version 0.4.1 + @timiscoding/recoil (recoil_early_rendering_2021 feature)
Sandbox: https://codesandbox.io/s/recoil-double-error-bug-react-v17-g4858?file=/src/index.js

[vladkens]

Hah, I also make sandbox with React v18 and its working as expect– no double error showed.

✅ With React 18-alpha with @timiscoding/recoil (as expected)
https://codesandbox.io/s/recoil-double-error-bug-react-v18-yxh2c?file=/src/index.js

❌ With React 18-alpha only Recoil (not working)
https://codesandbox.io/s/recoil-double-error-bug-react-v18-recoil-only-f80mb

So yeah, should we wait fix for React 17 or not?

[drarmstr]

Closed with #1076