Self Hosted Server - How to handle multiple injected extensions

Moralis General
#1

Hello again,

I have recently installed Coinbase chrome extension and I am unable to connect to my application with MetaMask ever since. I have tried all possible workarounds, including the snippet below, but Coinbase wallet is always injected. Coinbase wallet indicates that is connected but my app doesn’t see it since I didn’t sign the usual requestMessage. I am clueless to what to do next.

# Handling Multiple Injected Extensions

Here is the login function

export async function login() {
  const supportedChains = ["0x61", "0x38", "0x89", "0xfa"];
  const baseChain = "0x2105";
  const defaultChainId = "0x38"; 


    if(wallet_name === 'metamask') {
      await Moralis.enableWeb3({ provider: wallet_name });
    } else {
      await Moralis.enableWeb3({ provider: wallet_name, projectId: wallet_id });
    }

  

  let user = await Moralis.User.current();
  const chainId = supportedChains.includes(Moralis.chainId) ? Moralis.chainId : defaultChainId;
  const { message } = await Moralis.Cloud.run("requestMessage", {
    address: Moralis.account,
    chain: chainId,
    network: "evm",
  });
  
  const optionsWC = {
    provider: wallet_name,
    projectId: wallet_id,
    showQrModal: true,
    signingMessage: message,
  };
  const optionsMM = {
    signingMessage: message,
  };

  if (!user) {
    user = await Moralis.authenticate(wallet_name === "metamask" ? optionsMM : optionsWC)
      .then(async function (user) {
         const userAddress = Moralis.User.current().get("ethAddress");
         user_address = userAddress.substring(0, 5) + "..." + userAddress.substring(userAddress.length - 4);
         userAddressStore.set(user_address);
         fullUserAddressStore.set(userAddress);
         
        const chainId = await Moralis.chainId;
        const accepted_chains = ["0x61", "0x38", "0x89", "0xfa"];
        if (accepted_chains.includes(chainId)) {
          chain = chainId;
        } else {
          try {
            if(chainId != baseChain){
            await Moralis.switchNetwork(defaultChainId);
          }
          } catch {
            notifications.danger(
           "Could not connect to Metamask. Please try switching chains.",
        5000,
      );
           
            
          }
        }
        // Subscribe to onChainChanged events
        const unsubscribe = Moralis.onChainChanged(async (chainId) => {
          if (accepted_chains.includes(chainId)) {
            chain = chainId;
          } else {
            try {
              if(chainId != "0x2105"){
                await Moralis.switchNetwork(defaultChainId);
              }
            } catch {
              notifications.danger(
              "Could not connect to Metamask. Please try switching chains.",
              5000,
            );
            }
          }
        });
      })
      .catch(function (error) {});
  }
}```
#2

Hi @zrco

It could be possible that it was due to the extension settings. Can you check if there is a setting that says to use coinbase as default extension?

#3

Hi @johnversus

I couldn’t find any setting in Chrome or Brave browsers related to a default extension wallet. It would also be rather strange to expect users to adjust extension settings just to connect to the application. Additionally, I would need to implement the Coinbase wallet since I am exposing the app to the Base chain.

#4

Unfortunately, some extensions does it. Example Phantom:

image
image720×696 40.6 KB

You can also check the coinbase wallet developer docs. If they have any specifications for selecting their wallet when enabling web3.

#5

Here is the link I was supposed to share earlier. This approach didn’t work.

#6

Hi @zrco

Incase if this not already solved, is there a way I can test your code or deployment to check if I can reproduce the error?

#7

Hi @johnversus

The only way to control a default wallet selection is to enable one extension at a time. Not a perfect solution but it works. Coinbase wallet is successfully connecting to my application when MetaMask is disabled, and vice versa. If both extensions are enabled none can connect.

1 Like