How to get access to the MetaMask RPC error in front end application

Question

In my front end, I want to be able to display an error to the user if they can't perform a certain transaction. When I use 'try catch' when calling a function that fails, it catches: "Error: cannot estimate gas; transaction may fail or may require manual gas limit..." which is all one string. I noticed that in the console I get "MetaMask - RPC Error: execution reverted: ..." which is an object that contains the information I want but I can't seem to get the object in my front end to display it's message. Is there a way to easily show why a transaction reverted in the front end?

Currently I do:

try{
 await contract.someFunction()
}catch(e){
 
}

Which catches the long string and not the metamask object

Answer 1

This example shows you how to get the transaction receipt after the transaction is mined, as well ass catch the error. With metamask it returns an error object with a "message" value so "e.message" other wallets return different errors so it's safer to just store e if you are using multiple wallets.

let err;
let transaction;
let receipt;
        
const sendFunction = async () => {
   try {
     transaction = await contract.someFunction();
     // wait() has the logic to return receipt once the transaction has received one confirmation
     receipt = await wait(transaction);
 } catch(e) {
     err = e.message;
 }

}