magiclabs / magic-js

Magic browser/React Native JavaScript SDK is your entry-point to integrating passwordless authentication inside your application.
https://magic.link/docs/api-reference/client-side-sdks/web
Apache License 2.0
463 stars 86 forks source link

Error when using the Arbitrum networks #397

Open haowang1013 opened 1 year ago

haowang1013 commented 1 year ago

✅ Prerequisites

🐛 Description

Had some weird errors when using the Arbitrum networks. Tried with Arbitrum one and Arbitrum goerli, same problem.

🧩 Steps to Reproduce

const magic = new Magic(this.options.apiKey, {
    network: {
        rpcUrl: <arbitrum rpc url from infura>,
        chainId: <arbitrum chain id>,
    },
    extensions: [new ConnectExtension()]
}) 

const provider = new Web3(magic.rpcProvider)
const accounts = await provider.eth.getAccounts()

The same code works with goerli so it must be something with the Arbitrum network.

🤔 Expected behavior

Magic link should work correctly with Arbitrum since I'm providing the chainId and rpc URL.

😮 Actual behavior

image

haowang1013 commented 1 year ago

Did some digging and it looks like the error originates from one of the minified scripts used by https://auth.magic.link It has some hardcoded chain configurations

const k = {
    1: {
        chainId: 1,
        network: "ethereum",
        isMainnet: true,
        networkName: "Ethereum Mainnet",
        name: "Ethereum",
        currency: "ETH",
        onramperCurrency: "ETH",
        tokenCompatibility: "ERC-20",
        blockExplorer: "https://etherscan.io",
        icon: u["r"],
        alchemyApi: c["h"]
    },
    5: {
        chainId: 5,
        network: "goerli",
        isMainnet: false,
        networkName: "Goerli Testnet",
        name: "Ethereum",
        currency: "ETH",
        onramperCurrency: "ETH",
        tokenCompatibility: "ERC-20",
        blockExplorer: "https://goerli.etherscan.io",
        icon: u["r"]
    },
    137: {
        chainId: 137,
        network: "polygon-mainnet",
        isMainnet: true,
        networkName: "Polygon Mainnet",
        name: "Polygon",
        currency: "MATIC",
        onramperCurrency: "MATIC",
        tokenCompatibility: "Polygon",
        blockExplorer: "https://polygonscan.com",
        gasStationUrl: "https://gasstation-mainnet.matic.network/v2",
        icon: u["D"],
        alchemyApi: c["w"]
    },
    80001: {
        chainId: 80001,
        network: "polygon-mumbai",
        isMainnet: false,
        networkName: "Mumbai Testnet",
        name: "Polygon",
        currency: "MATIC",
        onramperCurrency: "MATIC",
        tokenCompatibility: "Polygon",
        blockExplorer: "https://mumbai.polygonscan.com",
        gasStationUrl: "https://gasstation-mumbai.matic.today/v2",
        icon: u["D"]
    },
    420: {
        chainId: 420,
        network: "optimistic-goerli",
        isMainnet: false,
        networkName: "Optimism Goerli Testnet",
        name: "Ethereum",
        currency: "ETH",
        onramperCurrency: "ETH_OPTIMISM",
        tokenCompatibility: "ETH",
        blockExplorer: "https://blockscout.com/optimism/goerli",
        icon: u["r"]
    },
    10: {
        chainId: 10,
        network: "optimistic-mainnet",
        isMainnet: true,
        networkName: "Optimism Mainnet",
        name: "Ethereum",
        currency: "ETH",
        onramperCurrency: "ETH_OPTIMISM",
        tokenCompatibility: "ETH",
        blockExplorer: "https://optimistic.etherscan.io",
        icon: u["r"]
    }
}

All the chains in the list work, and since Arbitrum is not part of it, it errored out.

I think 2 things can be improved:

  1. Make it possible to support more chains - I'm already providing the RPC url and the chain Id and I don't see why not the user can provide the rest information listed above, if they really want to use a chain not in this list.
  2. Until (1) is fixed, throw an error with a clear message saying chain XXX is not supported because XYZ...