bug: WalletConnect instance missing setStorage method

[jscriptcoder]

Is there an existing issue for this?

• I have searched the existing issues

Current Behavior

I'm having a very strange issue that I cannot figure out and it's driving me crazy, so I'm hoping someone could shed some light on this. I'm using Web3Modal, which uses w3mConnectors as connectors. This, under the hood, creates an array with InjectedConnector and WalletConnectConnector (since I'm using version 2) as seen here: https://github.com/WalletConnect/web3modal/blob/V2/chains/ethereum/src/utils.ts#L35.

What's the problem? when I run this in my local all good (typical, right?). When I deploy this in Vercel, I get an exception becauseWalletConnectConnector instance is missing setStorage method, failing here: https://github.com/wagmi-dev/wagmi/blob/main/packages/core/src/config.ts#L124.

The only thing I can think of is that I'm pulling the wrong version of some package. See screenshot of the walletConnect instance in my local (first item of the list):

Now see screenshot of walletConnect in Vercel:

Last one seems to have a slightly different interface, and if you go down the prototype, you don't see the method setStorage:

Whereas in my local you see it:

Both my local and Vercel are building the project using Node 18.x. Following is the list of dependencies:

"dependencies": {
    "@wagmi/core": "^1.2.0",
    "@web3modal/ethereum": "^2.4.7",
    "@web3modal/html": "^2.4.7",
    "viem": "^1.0.7"
}

Please let me know if I can provide with some more information. What I'm hoping here is that someone might have an idea what the problem could be because I ran out of them.

Expected Behavior

WalletConnectConnector instance extends Base connector, https://github.com/wagmi-dev/references/blob/e6fcfa938a95424a70f275409a6b620dfd7c980e/packages/connectors/src/base.ts, which contains the method setStorage

Steps To Reproduce

N/A

Link to Minimal Reproducible Example (CodeSandbox, StackBlitz, etc.)

No response

Anything else?

I'm testing in Chrome browser. The issue, as mentioned above, happens only when I deploy in Vercel. I don't have such issue when I run the dev environment nor when I run the production bundle in my local, so there must be something happening with the build on prod that might be pulling some wrong version?. I'm using Vite to build a SvelteKit project (Node 18.x). Following are the dev dependencies in case this is also needed:

"devDependencies": {
    "@playwright/test": "^1.28.1",
    "@sveltejs/adapter-auto": "^2.0.0",
    "@sveltejs/adapter-static": "^2.0.2",
    "@sveltejs/kit": "^1.5.0",
    "@typescript-eslint/eslint-plugin": "^5.45.0",
    "@typescript-eslint/parser": "^5.45.0",
    "autoprefixer": "^10.4.14",
    "daisyui": "3.1.1",
    "eslint": "^8.28.0",
    "eslint-config-prettier": "^8.5.0",
    "eslint-plugin-simple-import-sort": "^10.0.0",
    "eslint-plugin-svelte": "^2.26.0",
    "postcss": "^8.4.24",
    "prettier": "^2.8.0",
    "prettier-plugin-svelte": "^2.8.1",
    "svelte": "^3.54.0",
    "svelte-check": "^3.0.1",
    "tailwindcss": "^3.3.2",
    "tslib": "^2.4.1",
    "typescript": "^5.0.0",
    "vite": "^4.3.0",
    "vite-tsconfig-paths": "^4.2.0",
    "vitest": "^0.32.2"
}

Once again, I don't expect an answer to this issue, but some opinion. Thanks a lot

[glitch-txs]

Do you have the project ID set on Vercel?

[jscriptcoder]

Thanks for the answer @glitch-txs... I do, it's set. I changed the string to 'xxxxxxx...' to take the screenshot. The only thing is that the domain hasn't yet been verified. Not sure if that could be the reason, and still I wouldn't understand why the interface of the walletConnect instance is different, like it seems to be an old one.

Thanks

[glitch-txs]

Do you have a minimal reproducible example repo to test it?

[jscriptcoder]

Hi @glitch-txs , the error can be seen here: https://taiko-mono-bridge-ui-v2.vercel.app/. Take a look at the dev console. I uploaded the source maps. The wagmi configuration is created here: https://github.com/taikoxyz/taiko-mono/blob/main/packages/bridge-ui-v2/src/libs/wagmi/client.ts#L64

Thanks

[jscriptcoder]

So it turned out that there was a problem with some packages and versions. I removed also @wagmi/core, and installed wagmi instead, although the docs about installation suggest npm add @web3modal/ethereum @web3modal/html @wagmi/core viem, as seen here. New dependencies:

"dependencies": {
    "@web3modal/ethereum": "^2.6.2",
    "@web3modal/html": "^2.6.2",
    "viem": "^1.2.9",
    "wagmi": "^1.3.5"
}

This has fixed the problem 😊. Closing this ticket