Metamask or Coinbase wallets not working on mobile

Help - Plug n Play PnP Web SDKs
1

I dont understand, the login experience seems to be fundamentally broken?

Visit demo.web3auth.io with Android device or iPhone

  • Go to demo.web3auth.io (btw its impossible to use the interface with iPhone 13 Mini, as I cannot scroll and see the “Continue with wallet” button)
  • Press “Continue with wallet”

Metamask

  • Choose Metamask
  • It opens Metamask but nothing happens - it does not ask me to approve/sign the request or connect the wallet.
  • When I go back to the login it is displaying the QR code.
  • Same behavior on iOS and Android.

Coinbase Wallet

  • Choose Coinbase Wallet
  • It shows options to “Install Coinbase Wallet” for either Android or iOS. It does not open the Coinbase Wallet even though I have it installed.
  • Same behavior on iOS and Android.
2

Here is a video of it https://youtube.com/shorts/3i2TeWnl_rc. For Android I used the latest emulator, for iOS I used actual device.

3

This is expected behaviour. You are running the demo in the browser, the web app will try to find the injected wallets, since your browser don’t have any wallet installed, it’ll show that screen. Your browser, can’t communicate with OS to know whether the app are installed or not. Even if it can, the connection won’t be established. Hence Wallet Connect exists. You should use Wallet Connect option to connect with wallets on Mobile.

Also, you can learn here how to wallet discovery works: EIP-6963: Multi Injected Provider Discovery

4

Thank you, is there a way to in the SDK say to it that it should try connecting to metamask using WalletConnect. E.g. the user clicks Metamask icon, and it immediately opens the Metamask connection in WalletConnect, which then opens the app on the device.

For example do you support something like walletConnectProvider.connectTo( { selectedWallet: “metamask” } )? To skip showing the default WalletConnect selector, and immediately try to connect to Metamask instead.