Gracefully handling errors useContractRead in react

[owade]

I have the following code which displays two errors in console in the case of wrong arguments.

const { data, isError } =  useContractRead({
    address: '0x18B2A687610328590Bc8F2e5fEdDe3b582A49cdA',
    abi: PancakePredictionV2,
    functionName: 'userRounds',
    onError(error) {
      console.log('Error', error)
    },
    args: [addr, index],
  });



  return {data,isError}

The error logged in the console is:

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={"to":"0x18B2A687610328590Bc8F2e5fEdDe3b582A49cdA","data":"0xdd1f7596000000000000000000000000d1bbda3da12bf086145ef8553aecdbf4c7883844000000000000000000000000000000000000000000000000000000000000000d","accessList":null}, error={"reason":"processing response error","code":"SERVER_ERROR","body":"{\"jsonrpc\":\"2.0\",\"id\":44,\"error\":{\"code\":-32000,\"message\":\"execution reverted\"}}","error":{"code":-32000},"requestBody":"{\"method\":\"eth_call\",\"params\":[{\"to\":\"0x18b2a687610328590bc8f2e5fedde3b582a49cda\",\"data\":\"0xdd1f7596000000000000000000000000d1bbda3da12bf086145ef8553aecdbf4c7883844000000000000000000000000000000000000000000000000000000000000000d\"},\"latest\"],\"id\":44,\"jsonrpc\":\"2.0\"}","requestMethod":"POST","url":"https://bsc-dataseed1.binance.org:443"}, code=CALL_EXCEPTION, version=providers/5.7.2)
    at Logger.makeError (index.js?dd68:224:1)
    at Logger.throwError (index.js?dd68:233:1)
    at checkError (json-rpc-provider.js?8679:64:1)
    at JsonRpcProvider.eval (json-rpc-provider.js?8679:575:1)
    at Generator.throw (<anonymous>)
    at rejected (json-rpc-provider.js?8679:6:42)

It looks like ethers.js logger class is higher in the call stack and runs before wagmi. Is there way to catch these types of errors in wagmi ? Or maybe how can i use async/await with wagmi?

I have used ethers directly with async await and it catches the error as required.

const useRounds = async (addr: string, index: string) => {
const ethers = require('ethers');
const provider = new ethers.providers.JsonRpcProvider('https://bsc-dataseed1.binance.org:443');

const contract = new ethers.Contract("0x18B2A687610328590Bc8F2e5fEdDe3b582A49cdA", PancakePredictionV2, provider);

let works = await contract.userRounds(addr, index);

return works;
 
}

And then calling it by:

  useRounds('0xd1BbDA3da12bf086145EF8553aecDbf4C7853977', '13')
    .then((res) => console.log(res))
    .catch((e) => console.log(e));

[mhpaler]

@owade ever make progress on this? Also looking for a more general way for handling errors in wagmi / react.

[1337-ishaan]

+1