RPC Error: Request of type 'wallet_requestPermissions' already pending for origin

[ashish-mehta]

1. Goto https://docs.metamask.io/guide/getting-started.html#connecting-to-metamask
2. Make sure you are logged out from metamask
3. Enable ethereum
4. Close the metamask window without logging in
5. Open console in developer tools f12
6. Click the enable ethereum again
7. One can see the errors: MetaMask - RPC Error: Request of type 'wallet_requestPermissions' already pending for origin https://docs.metamask.io.

What to do in this situation?

Originally posted by @ashish-mehta in #7710 (comment)

[Gudahtt]

The request is still pending in this scenario I think? So the user can click on the MetaMask icon in the toolbar and confirm or deny the request.

This problem seems similar to #10085, which we have a planned UX improvement to address: #10302

[namnm]

This happens in a case like:

1. User click on button, our code call the method eth_requestAccounts
2. The popup open, but user does not click on Next or Cancel, but click outsite of the popup (they may try to go back to the page)
3. So now the popup is in the background, the button stuck in loading state forever. If refresh the browser, the button can be clicked, but it will rejects with the error Request of type 'wallet_requestPermissions' already pending for origin. This can only be resolved if user manually open the extension via MetaMask icon toolbar and click Next or Cancel to resolve it from there

Is there anyway to cancel/close the popup programmatically? So that we can use timeout to check and close the pop up from our code?

[chisqrd]

is there a workaround in the meantime? i ran into the same situation while trying to deposit some funds into polygon.curve.fi and the interface is coming back with an "Returned error: execution reverted" error. On the console, I can see the following:

MetaMask - RPC Error: Request of type 'wallet_requestPermissions' already pending for origin https://polygon.curve.fi. Please wait.

[jkirkpatrick]

Any update? It's been 5 months... I've seen how this built-in behavior of MetaMask causes extremely high levels of attrition and frustration of users on our site

[Gudahtt]

This was addressed in #12643

[ThePrimeagen]

This same error seems to happen if you do the following actions.

1. request auth to metamask
2. Refresh the website which will re-request the auth (but the meta mask window is still open from previous call) which cases the the same error as above (request in flight).

There is some interesting side effects from this.
event accountsChanged will not get called UNLESS repeating calls to the contract (its extremely odd, a while true loop calling eth_accounts will make it work)

Best work around I have come up with is await ethereum.request({method: "eth_accounts"}) and wait for the return result to be an array. here is the code

export async function waitForAccount(): Promise<void> {
    while (true) {
        try {
            const accounts = await getEthereum().request({method: 'eth_accounts'});
            if (accounts.length > 0) {
                break;
            }
        } catch (e) { }
    }
}

[Ravi16786]

Request of type 'eth_requestAccounts' already pending for origin https://dex.shardeumswap.finance. Please wait.
what is the solution

[ProductOfAmerica]

I found this solution, using TWO useEffect() calls to work perfectly for me, removing the errors:

'use client';

import {useEffect, useState} from 'react';

export default function ConnectWallet() {
    const [account, setAccount] = useState(null);
    const [isMetaMaskInstalled, setIsMetaMaskInstalled] = useState(false);
    const [isConnecting, setIsConnecting] = useState(false);

    // Check if MetaMask is installed
    useEffect(() => {
        if (typeof window !== 'undefined' && typeof window.ethereum !== 'undefined') {
            setIsMetaMaskInstalled(true);
        }
    }, []);

    // Attempt to connect to MetaMask
    useEffect(() => {
        const connectWallet = async () => {
            if (!isMetaMaskInstalled) return;

            setIsConnecting(true);
            try {
                await window.ethereum.request({method: 'eth_requestAccounts'});
                const accounts = await window.ethereum.request({method: 'eth_accounts'});
                setAccount(accounts[0]);
            } catch (error) {
                console.error("Failed to connect to MetaMask:", error);
                // Handle errors here
            } finally {
                setIsConnecting(false);
            }
        };

        connectWallet();
    }, [isMetaMaskInstalled]);

    return (
        <div>
            {isConnecting ? 'Connecting...' : account ? `Connected: ${account}` : 'Not connected'}
        </div>
    );
}