MetaMask - RPC Error: Permissions request already pending, in Angular 10

Question

I have integrated the MetaMask with Angular and while opening up the MetaMask extension from the code I am getting this error.

Following is my code for opening up the extension. I am calling this function on a click to open MetaMask where its giving that error

MetaMask - RPC Error: Permissions request already pending; please wait. {code: -32002, message: "Permissions request already pending; please wait."}

ethEnabled(template?): any
  {
    if ((window as any).web3)
    {
      (window as any).web3 = new Web3((window as any).web3.currentProvider);
      (window as any).ethereum.enable();
      console.log((window as any).ethereum.enable());

    }
    else
    {
      this.modalRef = this.modalService.show(template);
    }
  }

Alacritas Alacritas · Accepted Answer · 2021-01-16T04:43:39

This error is actually expected; it happens when you've already submitted a permissions request, but the user has either not logged into MetaMask or not granted permissions to your app.

If the user logs into MetaMask and accepts the permissions request, this error will not occur anymore.

This is explained in the docs, where it says You should always disable the "connect" button while the connection request is pending (otherwise this error occurs).

Here is one way to handle this:

Disable the button while the request is pending
If the user is not connected after a certain waiting period (10-20 seconds, perhaps?), show a message under the button requesting the user to complete the MetaMask connection.

There is more information and a nice example in their docs here.

MetaMask - RPC Error: Permissions request already pending, in Angular 10

2 Answers