Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Infinite event loop when using an 'injected' connector for metamask with the Coinbase wallet extension enabled #4487

Closed
1 task done
flipscholtz opened this issue Dec 30, 2024 · 6 comments
Labels
Needs Reproduction Misc: Needs Reproduction

Comments

@flipscholtz
Copy link

Check existing issues

Describe the bug

Not sure if this can be addressed in Wagmi or if the bug is with Coinbase.

Conditions:

  • Using Chrome
  • injectedWallet is passed in as one of the wallets to wagmi createConfig, and the Metamask browser extension is enabled.
  • Chrome has the Coinbase wallet extension enabled.

Behaviour:
When the react WagmiProvider tries to initialize, the browser tab completely locks up and crashes.

Analysis of infinite loop:

  • When connecting, wagmi's 'injected' connector calls getAccounts() here , which calls .request() on the provider here
  • The Coinbase extension has a class called MultiProvider, which is triggered when a Metamask connector is loaded into Wagmi. This class emits a "connect" event whenever a request is made, including getAccounts().
  • Wagmi listens to "connect" events here, and the onConnect listener immediately calls getAccounts() again, which triggers another "connect" event from the Coinbase extension, etc etc, in an infinite loop.

I have attached screenshots showing the loop.
Wagmi + Coinbase + Metamask infinite loop.pdf

I think the issue may be with Coinbase, because it seems to me that it shouldn't be emitting "connect" events on every request after the provider has already been registered / connected. But I'm posting here too to see if anyone else has come across this issue / has any insights.

Link to Minimal Reproducible Example

No response

Steps To Reproduce

No response

What Wagmi package(s) are you using?

wagmi, @wagmi/connectors, @wagmi/core

Wagmi Package(s) Version(s)

[email protected]

Viem Version

2.19.6

TypeScript Version

5.7.2

Anything else?

This is a React app, using Rainbowkit with Wagmi.

@wevm wevm deleted a comment from bep20 Dec 31, 2024
@hubagaspar91
Copy link

We might be experiencing something similar.

Can you link to the piece of code in Cb Wallet that emits connect on requests?

@flipscholtz
Copy link
Author

We might be experiencing something similar.

Can you link to the piece of code in Cb Wallet that emits connect on requests?

@hubagaspar91
I narrowed this down to happen when rainbowkit's injectedWallet is used. There's a rainbowkit issue here, and I will comment on there shortly with a sample repo to reproduce it.

Unfortunately I couldn't find the source for the coinbase extension on Github, except for one quite outdated version that someone unminified, but it doesn't contain the code in question.
Their official SDK repo at https://github.com/coinbase/coinbase-wallet-sdk does not contain the extension itself it seems.

I looked at the code in Chrome devtools, the file is under Coinbase Wallet extension => requestProvider.js, the last line of the registerProviders function, which is called when getAccounts is called.

      registerProviders(e) {
                    this.providers.slice(0, this.providers.length);
                    for (const t of e)
                        !this.selectedProvider && this.shouldSelectProvider(t) && this.setSelectedProvider(t),
                        t.isMetaMask && (this.overrideIsMetaMask = !0,
                        this.providerMap.set(n.ProviderType.MetaMask, t)),
                        t.isCoinbaseWallet && this.providerMap.set(n.ProviderType.CoinbaseWallet, t),
                        this.providers.push(t),
                        this.providers = [...new Set(this.providers)];
                    const {chainId: t} = this;
                    this.emit("connect", {
                        chainId: t
                    })
                }

@flipscholtz
Copy link
Author

See here for a sample app to reproduce.

@einaralex
Copy link
Contributor

einaralex commented Jan 13, 2025

Our users are experiencing this as well.
We are using wagmi directly, not RainbowKit.


    "viem": "2.21.44",
    "wagmi": "^2.13.0",

@tmm tmm added the Needs Reproduction Misc: Needs Reproduction label Jan 22, 2025
Copy link
Contributor

Hello @flipscholtz.

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 issue, and allow us to help you faster.

Once a minimal reproduction is added, a team member will confirm it works, then re-open the issue.

@github-actions github-actions bot closed this as not planned Won't fix, can't repro, duplicate, stale Jan 22, 2025
Copy link
Contributor

github-actions bot commented Feb 6, 2025

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.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Feb 6, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Needs Reproduction Misc: Needs Reproduction
Projects
None yet
Development

No branches or pull requests

6 participants
@einaralex @tmm @flipscholtz @hubagaspar91 and others