WalletConnect / modal-react-native

Simplest and most minimal way to connect your users with WalletConnect
https://docs.walletconnect.com/2.0/advanced/walletconnectmodal/about?platform=react-native
Apache License 2.0
31 stars 9 forks source link

[bug]: ClientCtrl.provider().request receive {"context": "client"} Missing or invalid. request() chainId: eip155:97 #28

Closed dingcxx closed 2 months ago

dingcxx commented 1 year ago

Description

I want switch Wallet network so I use ClientCtrl.provider() send a request for 'wallet_addEthereumChain', and receive a error

[Error: Missing or invalid. request() chainId: eip155:97]

so what is right way for reqeust ' wallet_addEthereumChain' method.

WalletConnect Modal SDK version

v1.0.0-rc.5

Output of npx react-native info

System: OS: macOS 13.3.1 CPU: (12) arm64 Apple M2 Pro Memory: 56.38 MB / 16.00 GB Shell: 5.9 - /bin/zsh Binaries: Node: 16.20.0 - ~/.nvm/versions/node/v16.20.0/bin/node Yarn: 1.22.19 - /usr/local/bin/yarn npm: 8.19.4 - ~/.nvm/versions/node/v16.20.0/bin/npm Watchman: 2023.04.10.00 - /opt/homebrew/bin/watchman Managers: CocoaPods: 1.12.0 - /Users/dingc/.rvm/gems/ruby-3.2.0/bin/pod SDKs: iOS SDK: Platforms: DriverKit 22.4, iOS 16.4, macOS 13.3, tvOS 16.4, watchOS 9.4 Android SDK: API Levels: 31, 33 Build Tools: 30.0.3, 31.0.0, 33.0.2 System Images: android-28 | Google APIs ARM 64 v8a, android-29 | Google APIs ARM 64 v8a, android-30 | Google APIs ARM 64 v8a Android NDK: Not Found IDEs: Android Studio: 2022.2 AI-222.4459.24.2221.10121639 Xcode: 14.3.1/14E300c - /usr/bin/xcodebuild Languages: Java: javac 20 - /Library/Java/JavaVirtualMachines/jdk-20.jdk/Contents/Home/bin/javac npmPackages: @react-native-community/cli: Not Found react: ^18.1.0 => 18.1.0 react-native: 0.70.4 => 0.70.4 react-native-macos: Not Found npmGlobalPackages: react-native: Not Found debug Checking for a newer version of React Native debug Current version: 0.70.4 debug Cached release version: 0.72.1 debug Cached release is still recent, skipping remote check

Expo Version (if applies)

No response

Steps to reproduce

  1. connect wallet to metamask ,and current chain is Goerli, and sessionParams's chains only has 'eip155:1', when I set more than one, connect wallet will failed
    const sessionParams = {
        namespaces: {
            eip155: {
                methods: REQUIRED_METHODS,
                chains: ['eip155:1'],
                events: REQUIRED_EVENTS,
                rpcMap: PRC_LISTs,
            },
        },
        optionalNamespaces: {
            eip155: {
                methods: REQUIRED_METHODS,
                chains: ['eip155:5', 'eip155:97'],
                events: REQUIRED_EVENTS,
                rpcMap: PRC_LISTs,
            },
        },
    }
  2. set default chainId to 97, and then read the Contract from chainId 97 successfully.
  3. reset app , the default chainId is still 97, but in @walletconnect/react-native-dapp will get connected wallet current network.
  4. request request 'wallet_addEthereumChain' method, then receive error

Snack, code example, screenshot, or link to a repository

IMG_5E34CCBBD213-1

dingcxx commented 1 year ago

@ignaciosantise I read the web3Modal's code , that connector's provider used @walletconnect/ethereum-provider. In @walletconnect/modal-react-native, the connector's provider used @walletconnect/universal-provider.

what's different between @walletconnect/ethereum-provider and @walletconnect/universal-provider ?

so is there any plan @walletconnect/modal-react-native use wagmi ?

ignaciosantise commented 1 year ago

Hey @dingcxx 👋 im not sure if i fully understand your issue, but i've tested this with MetaMask and it's working with their latest version (iOS 7.2.0-1142)

  1. Session params only include eip155:1

    export const sessionParams = {
    namespaces: {
    eip155: {
      methods: [
        'eth_sendTransaction',
        'eth_signTransaction',
        'eth_sign',
        'personal_sign',
        'eth_signTypedData',
        'wallet_addEthereumChain',
      ],
      chains: ['eip155:1'],
      events: ['chainChanged', 'accountsChanged'],
      rpcMap: {},
    },
    },
    };
  2. Connect with MetaMask

  3. Call wallet_AddEthereumChain

provider.request({
      method: 'wallet_addEthereumChain',
      params: [
        {
          chainId: '0x89',
          chainName: 'Polygon Mainnet',
          rpcUrls: ['https://polygon.llamarpc.com'],
        },
      ],
    });
  1. Approve request in MetaMask
  2. Default chain is now Polygon
const chainId = await provider?.request({
      method: 'eth_chainId',
    });
    console.log('chainjId', chainId); //it logs `137` -> Polygon Mainnet
  1. Tested personal_sign and it works as expected.
ignaciosantise commented 1 year ago

Regarding wagmi/ethereum-provider usage, we are currently discussing possibilities

dingcxx commented 1 year ago

Hey @dingcxx 👋 im not sure if i fully understand your issue, but i've tested this with MetaMask and it's working with their latest version (iOS 7.2.0-1142)

  1. Session params only include eip155:1
export const sessionParams = {
  namespaces: {
    eip155: {
      methods: [
        'eth_sendTransaction',
        'eth_signTransaction',
        'eth_sign',
        'personal_sign',
        'eth_signTypedData',
        'wallet_addEthereumChain',
      ],
      chains: ['eip155:1'],
      events: ['chainChanged', 'accountsChanged'],
      rpcMap: {},
    },
  },
};
  1. Connect with MetaMask
  2. Call wallet_AddEthereumChain
provider.request({
      method: 'wallet_addEthereumChain',
      params: [
        {
          chainId: '0x89',
          chainName: 'Polygon Mainnet',
          rpcUrls: ['https://polygon.llamarpc.com'],
        },
      ],
    });
  1. Approve request in MetaMask
  2. Default chain is now Polygon
const chainId = await provider?.request({
      method: 'eth_chainId',
    });
    console.log('chainjId', chainId); //it logs `137` -> Polygon Mainnet
  1. Tested personal_sign and it works as expected.

thanks for your reply, I will retry this case and reply to you.

I have some different steps with you:

fristly, I set the optionalNamespaces in sessionParams, I don't know what impact it is

secondly,before reuest 'wallet_addEthereumChain' method, I set the provider's defaultchain to 97 for read the Contract, maybe set defaultchain will impact the request

at last, maybe getchain could be a available interface in modal or provider is better

thanks again

dingcxx commented 1 year ago

Hey @dingcxx 👋 im not sure if i fully understand your issue, but i've tested this with MetaMask and it's working with their latest version (iOS 7.2.0-1142)

  1. Session params only include eip155:1
export const sessionParams = {
  namespaces: {
    eip155: {
      methods: [
        'eth_sendTransaction',
        'eth_signTransaction',
        'eth_sign',
        'personal_sign',
        'eth_signTypedData',
        'wallet_addEthereumChain',
      ],
      chains: ['eip155:1'],
      events: ['chainChanged', 'accountsChanged'],
      rpcMap: {},
    },
  },
};
  1. Connect with MetaMask
  2. Call wallet_AddEthereumChain
provider.request({
      method: 'wallet_addEthereumChain',
      params: [
        {
          chainId: '0x89',
          chainName: 'Polygon Mainnet',
          rpcUrls: ['https://polygon.llamarpc.com'],
        },
      ],
    });
  1. Approve request in MetaMask
  2. Default chain is now Polygon
const chainId = await provider?.request({
      method: 'eth_chainId',
    });
    console.log('chainjId', chainId); //it logs `137` -> Polygon Mainnet
  1. Tested personal_sign and it works as expected.

I retry this case, before reuest 'wallet_addEthereumChain' method, Idid not set the provider's defaultchain to a new chainid.

wallet_addEthereumChain work fine

dingcxx commented 1 year ago

mostly issue maybe was cased by session create.

I also receive wrong chainid by request eth_chainId

steps below

  1. change metamask network to goerli
  2. call eth_chainId receive 5
  3. call wallet_addEthereumChain method to 97
  4. jump to metamask and then blocked, switch network not suceeess
  5. back to my app
  6. call eth_chainId receive 97 ,but current wallet network is goerli
ignaciosantise commented 1 year ago

Can you check if that same flow works in Trust? This are mostly MM issues

dingcxx commented 1 year ago

👌 let me try it

dingcxx commented 1 year ago

Can you check if that same flow works in Trust? This are mostly MM issues

  1. trust wallet call 'wallet_addEthereumChain' method not working, and getAccountsList return undefined

  2. ainbow can't connect wallet if I dont use default sessionParams

this is my sessionParams defined

export const MethodName = {
    addNet: 'wallet_addEthereumChain',
    switchNet: 'wallet_switchEthereumChain',
    sign: 'eth_sign',
    getChain: 'eth_chainId',
    sendTransaction: 'eth_sendTransaction',
    // signTransaction: 'eth_signTransaction',
    // signTypedData: 'eth_signTypedData',
    personalSign: 'personal_sign',
}

export const SUPPORT_NETs = [BSC, ETH, Goerli, TESTNET_BSC, zkSync_testnet, zkSync_mainnet]

    const OPTION_CHAINS = SUPPORT_NETs.filter((value) => value.networkId !== 1).map(
        (value) => `eip155:${value.networkId}`,
    )

    const REQUIRED_METHODS = [...Object.values(MethodName)]
    const REQUIRED_EVENTS = ['chainChanged', 'accountsChanged']
    const sessionParams = {
        namespaces: {
            eip155: {
                methods: REQUIRED_METHODS,
                chains: ['eip155:1'],
                events: REQUIRED_EVENTS,
                rpcMap: PRC_LISTs,
            },
        },
        optionalNamespaces: {
            eip155: {
                methods: REQUIRED_METHODS,
                chains: OPTION_CHAINS,
                events: REQUIRED_EVENTS,
                rpcMap: PRC_LISTs,
            },
        },
    }
dingcxx commented 1 year ago

maybe sessionParams is managed by universal-provider self ?

It is hard to user manage it.

https://github.com/WalletConnect/walletconnect-monorepo/blob/v2.0/providers/ethereum-provider/src/constants/rpc.ts

dingcxx commented 1 year ago

my current sessionParams code was changed to this


export const MethodName = {
    addNet: 'wallet_addEthereumChain',
    switchNet: 'wallet_switchEthereumChain',
    sign: 'eth_sign',
    getChain: 'eth_chainId',
    sendTransaction: 'eth_sendTransaction',
    // signTransaction: 'eth_signTransaction',
    // signTypedData: 'eth_signTypedData',
    personalSign: 'personal_sign',
}

export const SUPPORT_NETs = [BSC, ETH, Goerli, TESTNET_BSC, zkSync_testnet, zkSync_mainnet]

    const OPTION_CHAINS = SUPPORT_NETs.filter((value) => value.networkId !== 1).map(
        (value) => `eip155:${value.networkId}`,
    )

    const OPTION_METHODS = [...Object.values(MethodName)]
    const REQUIRED_METHODS = ['eth_sendTransaction', 'personal_sign']
    const REQUIRED_EVENTS = ['chainChanged', 'accountsChanged']
    const sessionParams = {
        namespaces: {
            eip155: {
                methods: REQUIRED_METHODS,
                chains: ['eip155:1'],
                events: REQUIRED_EVENTS,
                rpcMap:{},
            },
        },
        optionalNamespaces: {
            eip155: {
                methods: OPTION_METHODS,
                chains: OPTION_CHAINS,
                events: REQUIRED_EVENTS,
                rpcMap: PRC_LISTs,
            },
        },
    }

now, I was update modal SDK to v1.0.0-rc.6, and MetaMask there are some something wrongs.

1. request wallet_addEthereumChain method in I'm Token(v2.12.2.3220), will receive error {"code": -32000, "message": "Unsupported methods."}

// request payload is here
{"method":"wallet_addEthereumChain","params":[{"chainId":"0x61","chainName":"Binance Smart Chain Testnet","nativeCurrency":{"name":"tBNB","symbol":"tBNB","decimals":18},"rpcUrls":["https://data-seed-prebsc-1-s3.binance.org:8545"],"blockExplorerUrls":["https://testnet.bscscan.com"]}]} {"code": -32000, "message": "Unsupported methods."}

2. change chain net not receive messge in I'm Token(v2.12.2.3220), and request eth_chainId method will get wrong chain net

3. request wallet_addEthereumChain method in MetaMask(v7.2.0 (1142)), will change chain net success, but when back to my app not receive request's Promise resolve and reject. it can receive chainChanged message.

https://github.com/WalletConnect/modal-react-native/assets/117795329/8994ac69-ac9c-46b9-ad6c-692cb7113387

4. connected wallet and then reload app, and request personal_sign method in MetaMask(v7.2.0 (1142)),can jump into wallet but no modal show in wallet, long time after, back to my app will receive a error, but no any message

ERROR {"context": "client"} 

https://github.com/WalletConnect/modal-react-native/assets/117795329/c3c48e6b-6723-4189-b615-1e44106acba5

5. use Web3Provider request eth_accounts method in Rainbow(1.8.23 (20)), will receive empty accounts. and wallet_addEthereumChain also failed. In this wallet I can't the way add a custom chain net. so I don't test a sign message and other method.

6. request wallet_addEthereumChain method in TrustWallet(1.8.23 (20)), can't show a modal in wallet, and also can't the way add a custom chain net. so I don't test a sign message and other method.

These are the problems I have encountered so far, I have no idea how to deal them

I read the EthereumProvider code , EthereumProvider also used by IUniversalProvider, as same as modal-react-native , I will try to find the difference between the two at present, I'll let you know if I find anything.

fatiherdogan01 commented 1 year ago

similar issue

ignaciosantise commented 3 months ago

Is this still happening? Can you check with the latest version of Metamask?

ignaciosantise commented 2 months ago

Closing until we have more info