WalletConnect / web3modal

A single Web3 provider solution for all Wallets
https://web3modal.com
Apache License 2.0
4.69k stars 1.3k forks source link

[bug] useWeb3Modal 4.1.1 #2059

Closed nsnull0 closed 1 month ago

nsnull0 commented 2 months ago

Link to minimal reproducible example

web3Modal 4.1.1 is buggy

Summary

Hello team,

So basically i just update to latest web3modal

"@web3modal/wagmi": "^4.1.1",
"viem": "^2.8.13",
"wagmi": "^2.5.11"

I found out that await open({ view: 'Networks' }) doesn't want to switch to selected network, it just navigate to connect wallet again, the page need to be refresh in order to make it work.

if I am using legacy version

npm install @web3modal/wagmi wagmi@1.4.13 viem@1.21.4 --legacy-peer-deps

it is working fine

fyi, no code changes apart from different method and setup when integrate with latest version.

Is there anything I am missing? Is there away to switch to selected network without refresh?

evidence:

4.1.1 https://github.com/WalletConnect/web3modal/assets/26643922/39980e21-cbf1-4e44-929d-39cd2afa3c30

3.5.7 https://github.com/WalletConnect/web3modal/assets/26643922/969d7ce0-69bb-4a25-995b-a02fc494ea91

List of related npm package versions

"@web3modal/wagmi": "^4.1.1", "viem": "^2.8.13", "wagmi": "^2.5.11"

linear[bot] commented 2 months ago

W3M-98 [bug] useWeb3Modal 4.1.1

glitch-txs commented 2 months ago

Are you able to reproduce the issue here: https://lab.web3modal.com/ Could you share steps to reproduce it if so? Thanks!

nsnull0 commented 2 months ago

Link to minimal reproducible example

web3Modal 4.1.1 is buggy

Summary

Hello team,

So basically i just update to latest web3modal

"@web3modal/wagmi": "^4.1.1",
"viem": "^2.8.13",
"wagmi": "^2.5.11"

I found out that await open({ view: 'Networks' }) doesn't want to switch to selected network, it just navigate to connect wallet again, the page need to be refresh in order to make it work.

if I am using legacy version

npm install @web3modal/wagmi wagmi@1.4.13 viem@1.21.4 --legacy-peer-deps

it is working fine

fyi, no code changes apart from different method and setup when integrate with latest version.

Is there anything I am missing? Is there away to switch to selected network without refresh?

evidence:

4.1.1 https://github.com/WalletConnect/web3modal/assets/26643922/39980e21-cbf1-4e44-929d-39cd2afa3c30

3.5.7 https://github.com/WalletConnect/web3modal/assets/26643922/969d7ce0-69bb-4a25-995b-a02fc494ea91

List of related npm package versions

"@web3modal/wagmi": "^4.1.1", "viem": "^2.8.13", "wagmi": "^2.5.11"

https://github.com/WalletConnect/web3modal/assets/26643922/ea16f928-ea13-4b72-809e-cb71cf970e21

I tried on https://lab.web3modal.com/ seems I could reproduce the issue, almost similiar issue like on my evidence.

btw, now i am reverting back to 3.5.7.. until this issue fixed. currently my dapps can't even connect to any injected wallet eventho.

nsnull0 commented 2 months ago

@glitch-txs btw, I am following the tutorial at doc for email wallet.

glitch-txs commented 2 months ago

that's the normal flow, if the wallet is disconnected we need to first ask for permissions to the provider before sending a switch chain request

nsnull0 commented 2 months ago

well yes and also no. please check the whole video... also the evidence.. IT should successfully ask permission to connect again.. but in this case is not, it just showing error connection instead of asking again to injected wallet in this case metamask.. the flag isConnected still true, but it somehow losing connection...

nsnull0 commented 2 months ago

@glitch-txs could you check again please.. thank you

nsnull0 commented 2 months ago

the thing is,, 3.5.7 is asking permission to reconnect. (which is perfect, this is expected) 4.1.1 just showing error connection, IF user is not advanced web3 user, they may not understand what to do, also why isConnected still true eventho it disconnected like you said.

glitch-txs commented 1 month ago

@nsnull0 could you try again, this should be fixed by now

nsnull0 commented 1 month ago

Thank you for follow up the issue.. I guess the fix version is from version 4.1.6... let me test on 4.1.6 soon..

nsnull0 commented 1 month ago

https://github.com/WalletConnect/web3modal/assets/26643922/c341139f-de5d-4eba-9d64-9773c3351184

seems it still there. it can be triggered while connecting to metamask.

this is the code for connect, i am using useWeb3Modal()

try {
            await open()
        } catch (error) {

        }

this is the code for switch button

try {
            await open({view: "Networks"})
        } catch (error) {

        }

also i add 1 button for debugging which is <w3m-network-button/> also same effect.

also I print out the isConnected from const { isConnected, address, chain } = useAccount()

<p>
                            isConnected Debug: {isConnected ? "true" : "false"}
                        </p>

this is the code for disconnecting

if (isConnected) {
            try {
                await disconnectAsync()
            } catch (error) {
                window.alert(error)
            }

            return
        }

my dependencies package: "@web3modal/wagmi": "4.1.6", "viem": "2.7.19", "wagmi": "2.5.7"

glitch-txs commented 1 month ago

Could you create a small repo with a minimal implementation example to reproduce the issue? And share the steps to reproduce it?

nsnull0 commented 1 month ago

sure, i'll share here later..

nsnull0 commented 1 month ago

@glitch-txs I think i found out my problem while creating fresh new project.

2 issues resolved:

  1. I was accidentally using Web3ModalProvider at many different place, it somehow remove the account information, it need to be refreshed manually.
  2. tried again with 4.1.1 , confirmed it still got disconnection bug, which already fixed with 4.1.6

now after fix number 1, everything fixed with the latest version, working as expected seamlessly.

Thank you for the support!

nsnull0 commented 1 month ago

@glitch-txs sorry it seems the disconnection bug still lingering with 4.1.6 version here is the minimum project to reproduce the bug https://github.com/nsnull0/minweb3modal

Steps to reproduce 100%

ref videos:

https://github.com/WalletConnect/web3modal/assets/26643922/1415f85a-257f-493e-b332-7f7c0a5381c3

glitch-txs commented 1 month ago

@nsnull0 I'm not able to repro and I cannot see the video idk why.

Which wallet are you using? I tested it with Trust (mobile) and MetaMask (extension) both work for me on page refreash

nsnull0 commented 1 month ago

https://github.com/WalletConnect/web3modal/assets/26643922/59617759-2752-4c91-9ea5-61f558ccc304

@glitch-txs i don't know man, its just metamask and now is pretty easy to reproduce. I can reproduce it on https://web3modal.com too just connect with metamask wallet extention.

I cannot see the video idk why.

you mean you can't see my videos at here? would you like me to upload to youtube? I could send it to your email as well to check if want.. just let me know.

glitch-txs commented 1 month ago

@nsnull0 thanks! I was able to see the last video, I was only able to reproduce this on Edge but I see some other devs are experiencing it as well, we'll try to fix this today, as for now we know this happens when the email feature is enabled.

glitch-txs commented 1 month ago

We'll follow up on this issue, feel free to subscribe and comment. https://github.com/WalletConnect/web3modal/issues/2126

Thanks! 👍

glitch-txs commented 1 month ago

@nsnull0 could you try 4.1.7? should be fixed there

nsnull0 commented 1 month ago

wow very fast,, thank you.. i'll try soon..

nsnull0 commented 1 month ago

alright, it's fixed at 4.1.7 finally