Enabling SSR will set localStorage chainId to 1 even thought mainnet is not configured

[0x33dm]

Describe the bug

I'm doing a Next.js website where I have ssr: true setup on my config and I only have fantom and bsc network setup on the config.

Recently something unexpected happened and for some reason every time I open the website I get a ChainNotConfiguredError, even when opening an "Incognito Browser"

When I console.log the result of useChainId() I can see the first time my view is rendered with 250 and the second time it will try to open chainId 1.

When i look at localStorage.getItem('wagmi.store'), this is the result ->

`'{"state":{"connections":{"__type":"Map","value":[]},"chainId":1,"current":null},"version":2}'`

If i manually update localStorage to cache chainId: 250 ( fantom network ) the website works as expected.

localStorage.setItem('wagmi.store', '{"state":{"connections":{"__type":"Map","value":[]},"chainId":250,"current":null},"version":2}')

I don't understand why chainId is being cached there as I believe we never had the main net configured or if we had it was a long time ago.

Link to Minimal Reproducible Example

https://new.wagmi.sh/is/rendering/blank/page

Steps To Reproduce

I don't have a reproduction repo at the moment, i tried using new.wagmi.sh but it renders a white page both on chrome and on opera

Wagmi Version

2.9.1

Viem Version

2.10.9

TypeScript Version

5.4.5

Check existing issues

• I checked there isn't already an issue for the bug I encountered.

Anything else?

I believe it's an issue related to this one -> #3814

[github-actions]

Hello @0x33dm.

Please provide a minimal reproduction using StackBlitz, TypeScript Playground (for type issues), or a separate minimal GitHub repository.

Minimal reproductions are required as they save us a lot of time reproducing your config & environment, and trying to reproduce your issue. See Why reproductions are required.

Please reopen this issue when a reproduction is added.

[tmm]

https://new.wagmi.sh should redirect you to https://stackblitz.com/edit/new-wagmi if you want to use that

[0x33dm]

https://new.wagmi.sh should redirect you to https://stackblitz.com/edit/new-wagmi if you want to use that

As i reported in another issue new.wagmi.sh renders a blank canvas for me on CHROME and on OPERA on Windows and on Linux.

Using Chrome and Opera latest version

[0x33dm]

If I add cookieStorage to my config then the error isn't thrown anymore.

  storage: createStorage({  
    storage: cookieStorage, 
  }),  

The problem then is that my main route will become opt into "dynamic rendering" as per Next.js documentation.

From my understanding, though the reason why cookieStorage is needed is to avoid Hydration errors, but actually, I had no hydration errors before.

The problem arrises from the fact that by not having initialState set somehow instead of localStorage defaulting to the first chainId on the config it's defaulted to 1?

[0x33dm]

https://new.wagmi.sh should redirect you to https://stackblitz.com/edit/new-wagmi if you want to use that

As i reported in another issue new.wagmi.sh renders a blank canvas for me on CHROME and on OPERA on Windows and on Linux.

Using Chrome and Opera latest version

I'll look into making a reproduction repo with the bare minimum from my app instead but would be great to find out what's happening with new.wagmi.sh.

Does it work for you?

[tmm]

000827_Firefox_2024-05-17-10.10.25.mp4

[0x33dm]

000827_Firefox_2024-05-17-10.10.25.mp4

Your video ends too quick. What you shown in your video is exactly what happens to me but then in the end i just have a blank canvas on the right side of the screen.

The application never renders. Tested on Windows 10 and on Linux, with chrome and with firefox.

[0x33dm]

[0x33dm]

I created an issue on their repo about this problem stackblitz/core#3053

[github-actions]

This issue has been locked since it has been closed for more than 14 days.

If you found a concrete bug or regression related to it, please open a new bug report with a reproduction against the latest Wagmi version. If you have any questions or comments you can create a new discussion thread.