1. Submitted a transaction (hanging on sending)
2. Right-clicked to open in block explorer -> Etherscan returns 'can not find tx hash'
3. Right click to speed up & submit
4. Error pops up.

Both MM and Rainbow are installed on Brave desktop, but the tx was sent through the Rainbow extension.

Checking which network is currently connected is one of the most commonly needed actions in a wallet, so it should be possible to do this immediately and easily by looking at the main page of the extension popup. There is a miniscule network icon within the icon in the top left corner, but this is far too small for it to be easy to differentiate, so currently you have to press n or click that icon.

Ideally the network name would be visible on the main popup, as well as the icon.

Using fresh Brave browser profile with only rainbow wallet installed.
Have transferred all my wallets over from metamask.
Disabled brave wallets.

Rainbow will never connect to any website, including opensea, uniswap, etc.

When selecting what wallet to connect, on selecting "metamask" I will get redirected to download metamask rather than rainbow wallet opening. Likewise when I select "browser wallet".

Is there a way to force Rainbow wallet to open and connect?

conflicts with other browser extensions

There seems to be an overflow (maybe?) where simulations of token transfers, approvals, etc. show as "unlimited" when sufficiently large. I've only noticed this with tokens with 18 decimals as of now.

Examples:

Approving 1 WETH (18 decimals):

Withdrawing 10 DAI (18 decimals) from a contract:

Approving 100 USDC (6 decimals):

I'm testing on a local Dapp on latest Chrome on MacOS. Metamask and Coinbase extensions work fine. Rainbow is also able to connect to the page and sign a message. But for every other action, like minting a token, it fails. I see this error spamming my console:

inpage.js:1 Uncaught (in promise) TypeError: Error in invocation of runtime.sendMessage(optional string extensionId, any message, optional object options, optional function callback): chrome.runtime.sendMessage() called from a webpage must specify an Extension ID (string) for its first argument.

And for an example mint function, I get this error:

Error: missing revert data in call exception; Transaction reverted without a reason string [ See: https://links.ethers.org/v5-errors-CALL_EXCEPTION ] (data="0x", transaction={"from":"REMOVED_FOR_GITHUB","to":"REMOVED_FOR_GITHUB","data":"REMOVED_FOR_GITHUB","accessList":null}, error={}, code=CALL_EXCEPTION, version=providers/5.7.2) at _Logger.makeError (index.ts:269:28) at _Logger.throwError (index.ts:281:20) at checkError (json-rpc-provider.ts:66:16) at Web3Provider.<anonymous> (json-rpc-provider.ts:642:20) at Generator.throw (<anonymous>) at rejected (json-rpc-provider.ts:20:1)

The exact same action and calldata works fine on metamask and coinbase.

This wallet should have an anti-phishing detect like metamask

https://github.com/MetaMask/eth-phishing-detect

What was the reason for disabling hardware wallet support on Firefox? Is it possible to bring that back anytime soon? I'd prefer firefox over chrome for privacy reasons.

#907

Is there an existing issue for this?

• I have searched the existing issues

RainbowKit Version

1.1.3

wagmi Version

1.4.5

Current Behavior

TypeError: Error in invocation of runtime.sendMessage(optional string extensionId, any message, optional object options, optional function callback): chrome.runtime.sendMessage() called from a webpage must specify an Extension ID (string) for its first argument.

Expected Behavior

No error lol

Steps To Reproduce

  "dependencies": {
    "@headlessui/react": "^1.7.17",
    "@heroicons/react": "^2.0.18",
    "@rainbow-me/rainbowkit": "^1.1.3",
    "@rainbow-me/rainbowkit-siwe-next-auth": "^0.3.2",
    "alchemy-sdk": "^2.10.1",
    "ethers": "^5.7.2",
    "mongoose": "^8.0.0",
    "next": "^14.0.1",
    "react": "^18",
    "react-dom": "^18",
    "react-hot-toast": "^2.4.1",
    "siwe": "^2.1.4",
    "swr": "^2.2.4",
    "viem": "^1.18.0",
    "wagmi": "^1.4.5"
  },

clicking connect just throws error

Link to Minimal Reproducible Example (CodeSandbox, StackBlitz, etc.)

No response

Anything else?

No response

Getting a few weird issues when using Rainbow + remix.ethereum.org + OP Sepolia

I can connect fine but for some reason Remix doesn't detect any accounts at first

I have to go to the extension, click "switch wallet", then click again on the wallet that is already connected.

I'm then able to see the wallet but Remix thinks the wallet has no balance (it does).

When deploying a contract I get a failed simulation that appears to be trying to simulate against Ethereum mainnet even though the transaction is against OP Sepolia.

Lastly when I deploy a contract remix either hangs or crashes.

Every time I open up or try to do any action using the browser extension my CPUs go crazy.
I can actually hear them spin up. % usage jumps to ~!5%. The extension itself becomes really slow.
When I initially open it, it's basically unusable, so I wait 2-3 seconds to "cool down" to around 7-8% CPU usage, before clicking or performing any next action.

I've had this issue since the launch of the extension (Oct '23) and disabled it immediately again after installing.
There's some DM history on twitter (@wslyvh).

I recently formatted and did a clean install of OS + Browser + extensions, so wanted to give it another try but still experiencing the same issues.

Laptop: System76 Lemur Pro (11th gen, i7, 40GB ram)
OS: Pop_OS 22.04
Firefox version: 122.0
Rainbow extension version: 1.3.62

Only 1 wallet address is added: wslyvh.eth

To ensure safety, it's best to set the token approve amount to match the transaction amount by default.

Alternatively, we could incorporate a feature allowing users to adjust the token approve amount as needed.

See the example below:

When a contract interaction is expected to revert, I would expect the primary action to be disabled and a proper error message (from revert data) to be displayed (for this case "Token ID is taken"):

Can repro by performing mint(69) on https://etherscan.io/address/0xFBA3912Ca04dd458c843e2EE08967fC04f3579c2#writeContract.

Is there an existing issue for this?

• I have searched the existing issues

RainbowKit Version

2.0.0

wagmi Version

2.5.6

Current Behavior

Expected Behavior

Normal icon of some site

Steps To Reproduce

appIcon using getDefaultConfig

I use real domain, icon URL and project ID

export const config = getDefaultConfig({
  ...
  appUrl: 'https://real-domain.com,
  appIcon: 'https://real-domain.com/icon.png',
  projectId: '01001001110100100010010',
  ...
})

Link to Minimal Reproducible Example (CodeSandbox, StackBlitz, etc.)

No response

Anything else?

I did not find any information regarding the icon even in the open repository of rainbowkit.com

hehe i’m first

I have seen wallet plugins that support bybit wallet, but the network does not support mantle, mantle is a second layer with a large number of users, looking forward to adding it.

network Name: Mantle
rpc url: https://mantle.public-rpc.com/
chain ID: 5000
Currency symbol: MNT
Blocks the browser: https://explorer.mantle.xyz/

Auditing rainbow is complicated, because it's too big. Size can easily be reduced by removing and replacing dependencies.

1. ethers v5 could be replaced with v6 or viem. They both use better cryptography and native bigints instead of bn.js and bignumber.js. Viem is friendly to wagmi, which you are already using.
2. bignumber.js direct dep can be removed in favor of native bigints
3. buffer can be replaced with native uint8array

Probably a deep dive into all deps would reveal hundreds of kilobytes of unused code.

On most DAPPs, the rainbow browser-extension can connect using the metamask option (e.g.: https://app.aave.com/), however, it seems that on DAPPs that are using rainbowkit, unless they enable "rainbow" as a wallet, the browser extension cannot connect using the "metamask" option (it just shows a link to download the extension) (e.g: https://app.stcelo.xyz/stake).
Since you develop both softwares, is there a way to make one of the other allow the extension to connect as if it was metamask?
Thanks!

Using wagmi 2.6.x

import { getConnectorClient } from '@wagmi/core'

const client = await getConnectorClient({ ... }, {
  account: '0x...',
  chainId: 314159,
  connector: ...,
})

await client.request({
  method: 'wallet_watchAsset',
  params: {
    type: 'ERC20',
    options: {
      address: '0xaC26a4Ab9cF2A8c5DBaB6fb4351ec0F4b07356c4',
      symbol: 'WFIL',
      decimals: 18,
    },
  },
})

When sending the wallet_watchAsset request, a window pops up to approve adding the token:

However, when clicking Approve, an error is thrown: User rejected the request.

I'm using json rpc middlewares with https://github.com/MetaMask/eth-json-rpc-middleware and it seems working with the most of injectable wallets. And recently I've discovered it doesn't work with Rainbow's so I dived deeper and discovered that your sendAsync method doesn't accept second argument - callback and instead returns just promise.

Example of problem:

window.rainbow.sendAsync(jsonRpcRequest, (err, jsonRpcResponse) => {
 // it'll never happen, callback is never called
})

I always get this error when I ran "yarn setup" command.

Node.js version: v18.16.1

When I try to add addresses from Trezor T it sees only one. I use different path it finds it seems to be ok, but when I'm adding the second address it is not there and still only the first address is visible in the wallet. Same problem is with signing transaction, it fails despite I confirm on wallet.

Also claiming points with Trezor T is not working at all, with the first address ofc, I can't add more than just the first address.

Is there an existing issue for this?

• I have searched the existing issues

RainbowKit Version

2.0.0

wagmi Version

2.5.6

Current Behavior

I already add a custom chain to getDefaultConfig

1. When I used switchChain from useSwitchChain wagmi for Rainbow wallet to switch to this chain, error occured like this:

When I used switchChain for other wallets like MetaMask, it worked, but rainbow didn't

2. When I tried using wallet_addEthereumChain to add this chain to Rainbow wallet, though I approved the addition of this chain, the error occured. I checked Rainbow wallet networks, this custom chain is already added but error showed:

Expected Behavior

When I used switchChain from useSwitchChain wagmi for Rainbow wallet to switch to a custom chain, it should add the custom chain to RainBow wallet and switch to it

If I use wallet_addEthereumChain, Rainbow wallet should add the chain and not show any error

Steps To Reproduce

No response

Link to Minimal Reproducible Example (CodeSandbox, StackBlitz, etc.)

No response

Anything else?

No response

Hey there! I've been really enjoying the browser extension, but I wanted to highlight that it doesn't recognize the Ledger Stax in the WebHID connection dialog. I'm pretty sure it's simply a matter of adding the Stax's USB identifier to the code where you open up the WebHID connection, and it'll just work from there.

Steps to reproduce the issue:

1. Host this HTML file on a local web server and open it in a web browser:

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>accountsChanged Test</title>
</head>

<body>
  <script>
    const wallets = [];
    window.addEventListener('eip6963:announceProvider', e => wallets.push(e.detail));
    window.dispatchEvent(new Event('eip6963:requestProvider'));

    for (const wallet of wallets) {
      wallet.provider.addListener?.('accountsChanged', console.log) ?? wallet.provider.on('accountsChanged', console.log);
    }
  </script>
</body>

</html>

2. Connect your wallet using the wallet UI.
3. Disconnect your wallet using the wallet UI.

Expected result: two accountsChanged events are emitted. One upon connection and one upon disconnection. The DevTools console log should look like this:

> ['0xaaa..aaa']
> []

Actual result: only one accountsChanged event is emitted, upon connection. The DevTools console log looks like this:

> ['0xaaa..aaa']

Here's the relevant part of EIP-1193:

accountsChanged

If the accounts available to the Provider change, the Provider MUST emit the event named accountsChanged with value accounts: string[], containing the account addresses per the eth_accounts Ethereum RPC method.

The “accounts available to the Provider” change when the return value of eth_accounts changes.

Since the return value of eth_accounts changes when the wallet disconnects (from an array with 1 address to an empty array), the accountsChanged event must be emitted.

I performed the above steps with MetaMask and Brave Wallet, and they both emit 2 events as expected.

When using the send feature, the transaction appears to hang within the extension and never get submitted. Specifically in this case, I was sending ETH on mainnet.

See the below image:

I tried sending funds to both internal addresses within the app as well as external addresses. Regardless, the transaction hangs indefinitely.

I am using Ubuntu/Chrome. The rainbow plugin shows it is on v1.2.56

Note: This issue is present on Windows/Chrome as well.

BIP44 e.g. : m / purpose' / coin_type' / account' / change / address_index

In general I find that Rainbow has way better UX than notable competitors. However I've noticed a few areas where it has significant room for improvement. One is renaming wallets, which I find incredibly painful. Currently the process is:

1. Click the current wallet's dropdown or press w to get a list of all wallets
2. Scroll down to find the wallet you want to rename
3. Click the icon to the right of the wallet (with three dots in a circle)
4. Click "Rename wallet"
5. Click to focus the text field where the name goes
6. Put the new name in
7. Click done

This requires far too many clicks. Imagine you want to rename 5 wallets. This would require 25 clicks plus 5 scrollings on top of typing the 5 names!

This process is even worse when importing a new wallet by specifying a private key, because you can't specify a name during the import, requiring 3 mouse clicks to initiate the import, plus the 5 extra for the rename. Worse, the new wallet gets buried at the end of the list of wallets in step 2 above, and you can't search for it unless you already know the address, because it doesn't have a name yet. So you have to scroll all the way down the list to find it. That means that on top of the unavoidable pasting of the private key and typing of the wallet names, importing and naming 5 new wallets would require something like 40 clicks plus a lot of scrolling!

Fortunately, all of these problems can be fixed very easily. All of the following suggestions can be implemented independently from each other, and all of them would considerably improve the UX:

• Autofocus the name text field to eliminate step 5 above.
• Provide a keyboard shortcut to rename the currently selected wallet.
• Allow clicking directly on the wallet name on the main wallet page in order to edit it.
• When importing a new wallet, ask for the name on the same form where you ask for the private key (but also auto-generate a unique name like "Imported wallet 1" so you're not forcing the user to think of a name in that moment).
• When importing a new wallet, automatically switch to the newly imported wallet.

I appreciate the minimalism in the transaction view (where a transaction is displayed to the user for them to sign), but the lack of features there does make some transactions difficult or outright impossible. These could be hidden away on a dropdown, hotkey or gear icon somewhere, but they should be there.

I'll list a few here but if others have more suggestions I'm happy to add them to the list:

Viewing Approval Amount

Currently I do not know if a dapp prompted me to approve an exact amount of tokens, infinite amount or a 0 amount (to revoke approval). The function name is displayed, but that's it. Some of the blame here should be shifted to bad dapp design, but still - we should be able to see that, with bonus points for being able to edit the amount :)

Current View:

It should also be possible to display what token is being approved, for what address, and if using something like Permit2 with an expiry, when it is valid until.

Editing Gas Limit

Estimating gas limits is hard. I know. In general I'd be OK with the wallet largely overestimating this to avoid running into "out of gas" reverts, but ultimately we need a way to set this ourselves. For example, this TX ran out of gas with ~170k estimated and I had to resubmit it with a higher gas limit to get it through (had to use another wallet in order to do this). Went through here with ~198k.

Similarly to the previous point, we should be able to see what the value is currently set at, and edit it if necessary. Most users should not care about this or need this, but the feature should be hidden away somewhere for those that do.

Apparently, wallet_switchEthereumChain doesn't work with networks added through wallet_addEthereumChain
is this intentional?

Steps

1. Add a custom network

window.rainbow.request({
    "method": "wallet_addEthereumChain",
    "params": [
        {
            "chainId": "0x2329",
            "chainName": "Evmos",
            "nativeCurrency": {
                "decimals": 18,
                "name": "Evmos",
                "symbol": "EVMOS"
            },
            "rpcUrls": [
                "http://localhost:3000/api/eth-json-rpc/evmos"
            ],
            "blockExplorerUrls": [
                "https://escan.live"
            ]
        }
    ]
})

(this works, this adds the network to my wallet, it doesn't auto switch to it after that though as is the behavior in other wallets)
2. Try to switch to the network

window.rainbow.request({
    "method": "wallet_switchEthereumChain",
    "params": [
        {
            "chainId": "0x2329",
        }
    ]
})

I get the following error

{
    "name": "Invalid Request",
    "message": "Chain Id not supported",
    "code": -32600
}

digging the code a little bit it seems that only what's in this list here is supported, is that correct?

wallet_addEthereumChain seems to check for a featureFlags.custom_rpc flag, but wallet_switchEthereumChain right below it doesnt
https://github.com/rainbow-me/provider/blob/586aa46965b41173bd071d7ca2bdccf70ef10b0c/src/handleProviderRequest.ts#L239

Hi! Loving the browser extension. I have used it to onboard several new users to crypto! While taking a fresh look at Rainbow, I put together several suggestions for improvements that I think could be beneficial:

Improvements:

• Users should have the option to add/change RPC endpoints. This could be added under the ‘Transactions’ option within the wallet settings. With this addition, users could also have the ability to add new networks not currently supported by Rainbow.
• Users should have the option to manually hide tokens. Currently, the only option for hiding tokens is a built-in ‘Hide tokens under $1 balance’ setting.
• Currently, tokens are sorted by highest balance. In my opinion, users should have the option to sort by network as well.
• The browser extension should have a discover page to mimic the mobile app. The discover page could direct users to the official websites of certain dApps.