revalidateOnMount is broken on useSWRInfinite

[pedro-pedrosa]

Bug report

Description / Observed Behavior

useSWRInfinite is not revalidating on mount when prop is set in config

Expected Behavior

It should revalidate on mount

Repro Steps / Code Example

CodeSandbox

mounting/unmounting has no effect on the data reendered on the page. note how it works with a useEffect call to mutate()

Additional Context

SWR version. 0.4.0

[koba04]

@pedro-pedrosa
Revalidating seems to be happened when revalidateOnMount is enabled. In the CodeSandbox, your fetcher function (() => Promise.resolve(buildData(counter))) seems to be called on mount when revalidateOnMount is true. As a result, 0 is rendered after mount.

Could you explain what you expect?

[pedro-pedrosa]

Sorry I probably should have explained my codesandbox a little bit better. each mount/unmount increments a counter by 1. this counter is passed as prop to a component that gets mounted/unmounted. this component calls useSWRInfinite and provides a fetcher function that depends on this counter.. so in theory, each mount/unmount cycle should make the fetcher function print 2 more numbers than the previous cycle.

however the number never changes on each mount/unmount, it's always 0 as it's the first value returned by the fetcher. when it's mounted, if you click "revalidate", it calls mutate which will run the fetcher again and print the true values. so you just have to click mount/unmount a few times and then revalidate to see the issue.

if you enable the useEffect checkbox, you will see that a simple mutate() call on mount works the way that revalidateOnMount should.

[koba04]

@pedro-pedrosa
I think it seems to work fine if (i, prev) => (prev ? null : "test") is replaced with (i, prev) => "test" + counter.
The behavior seems to be caused by returning null as a key.

[pedro-pedrosa]

I thought you return null in your key getter when there are no more pages? so it only revalidates when there are more pages to show?

Please note that manual mutate() works so it's weird that revalidateOnMount doesn't

[shuding]

Confirmed that this is fixed in the latest version: https://codesandbox.io/s/quizzical-agnesi-fzjkw?file=/src/Component.js. One thing to keep in mind is dedupingInterval can also make a difference here.