error with usePrepareContractWrite and useContractWrite

[lilyanB]

Hello,
context:
I use NextJS/typescript and wagmi for interact with EVM blockchain/contracts.

I want to interact with a contract.

When I use useContractWrite:

With text:

import { stringToBytes } from "viem";

// Define a function to convert a string to ASCII bytes
function stringToAsciiBytes(inputString: string): number[] {
   const recipientAddress = "tb1q9rka9ve8drus9nutrscfc57m9yylghjr2hluj2";
   const recipientBytes = "0x65a45c57636f9BcCeD4fe193A602008578BcA90b";
   return recipientBytes 
}


  const { data, isLoading, isSuccess, write } = useContractWrite({
    address: wBTCContract,
    abi: [
      {
        inputs: [
          {
            internalType: "bytes",
            name: "to",
            type: "bytes",
          },
          {
            internalType: "uint256",
            name: "amount",
            type: "uint256",
          },
        ],
        name: "withdraw",
        outputs: [
          {
            internalType: "bool",
            name: "",
            type: "bool",
          },
        ],
        stateMutability: "nonpayable",
        type: "function",
      },
    ],
    functionName: "withdraw",
    gas: 1_000_000n,
  });

<button
        disabled={!write}
        onClick={() => {
          const recipientAddress = "tb1q9rka9ve8drus9nutrscfc57m9yylghjr2hluj2";
          const recipientBytes = stringToAsciiBytes(recipientAddress);
          console.log("recipientBytes : ", recipientBytes);
          write({
            args: [recipientBytes, 100],
          });
        }}
      >

I have this error on my browser:

app-index.js:31 ContractFunctionExecutionError: The contract function "withdraw" reverted with the following signature:
0xfe382aa7

Unable to decode signature "0xfe382aa7" as it was not found on the provided ABI.
Make sure you are using the correct ABI and that the error exists on it.
You can look up the decoded signature here: https://openchain.xyz/signatures?query=0xfe382aa7.
 
Contract Call:
  address:   0x65a45c57636f9BcCeD4fe193A602008578BcA90b
  function:  withdraw(bytes to, uint256 amount)
  args:              (0x65a45c57636f9BcCeD4fe193A602008578BcA90b, 1)
  sender:    0x607Ec1a7F093801b40DaE21131dDAdB8ce991106

Docs: https://viem.sh/docs/contract/decodeErrorResult.html

With "stringToBytes"

import { stringToBytes } from "viem";

// Define a function to convert a string to ASCII bytes
function stringToAsciiBytes(inputString: string): number[] {
   const recipientAddress = "tb1q9rka9ve8drus9nutrscfc57m9yylghjr2hluj2";
   const recipientBytes = stringToBytes(recipientAddress);
   return recipientBytes 
}


  const { data, isLoading, isSuccess, write } = useContractWrite({
    address: wBTCContract,
    abi: [
      {
        inputs: [
          {
            internalType: "bytes",
            name: "to",
            type: "bytes",
          },
          {
            internalType: "uint256",
            name: "amount",
            type: "uint256",
          },
        ],
        name: "withdraw",
        outputs: [
          {
            internalType: "bool",
            name: "",
            type: "bool",
          },
        ],
        stateMutability: "nonpayable",
        type: "function",
      },
    ],
    functionName: "withdraw",
    gas: 1_000_000n,
  });

<button
        disabled={!write}
        onClick={() => {
          const recipientAddress = "tb1q9rka9ve8drus9nutrscfc57m9yylghjr2hluj2";
          const recipientBytes = stringToAsciiBytes(recipientAddress);
          console.log("recipientBytes : ", recipientBytes);
          write({
            args: [recipientBytes, 100],
          });
        }}
      >

I have this error on my browser:

TypeError: hex_.replace is not a function
    at padHex (webpack-internal:///(app-pages-browser)/./node_modules/viem/dist/esm/utils/data/pad.js:17:22)
    at encodeBytes (webpack-internal:///(app-pages-browser)/./node_modules/viem/dist/esm/utils/abi/encodeAbiParameters.js:157:74)
    at prepareParam (webpack-internal:///(app-pages-browser)/./node_modules/viem/dist/esm/utils/abi/encodeAbiParameters.js:70:16)
    at prepareParams (webpack-internal:///(app-pages-browser)/./node_modules/viem/dist/esm/utils/abi/encodeAbiParameters.js:44:29)
    at encodeAbiParameters (webpack-internal:///(app-pages-browser)/./node_modules/viem/dist/esm/utils/abi/encodeAbiParameters.js:32:28)
    at encodeFunctionData (webpack-internal:///(app-pages-browser)/./node_modules/viem/dist/esm/utils/abi/encodeFunctionData.js:37:87)
    at simulateContract (webpack-internal:///(app-pages-browser)/./node_modules/viem/dist/esm/actions/public/simulateContract.js:50:106)
    at Object.simulateContract (webpack-internal:///(app-pages-browser)/./node_modules/viem/dist/esm/clients/decorators/public.js:117:123)
    at prepareWriteContract (webpack-internal:///(app-pages-browser)/./node_modules/@wagmi/core/dist/chunk-LAFZBYO7.js:2144:50)
    at async writeContract (webpack-internal:///(app-pages-browser)/./node_modules/@wagmi/core/dist/chunk-LAFZBYO7.js:2420:17)

When I use usePrepareContractWrite:

  const { config } = usePrepareContractWrite({
    address: wBTCContract,
    abi: [
      {
        inputs: [
          {
            internalType: "bytes",
            name: "to",
            type: "bytes",
          },
          {
            internalType: "uint256",
            name: "amount",
            type: "uint256",
          },
        ],
        name: "withdraw",
        outputs: [
          {
            internalType: "bool",
            name: "",
            type: "bool",
          },
        ],
        stateMutability: "nonpayable",
        type: "function",
      },
    ],
    functionName: "withdraw",
    gas: 1_000_000n,
  });

Vscode display an error:

My code/project : https://github.com/lilyanB/coinlend/blob/writeContract/src/app/wbtc/page.tsx

If someone can help me please

[Ethaan]

I see this error also while doing my migration

1.- Make sure that wagmi and viem are up to date with latest
2.- is your ABI the latest for your contract address?

[lilyanB]

I thinks your sugestion are done:
1 :

  "dependencies": {
    "@rainbow-me/rainbowkit": "^1.0.10",
    "autoprefixer": "10.4.15",
    "next": "^13.4.19",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "tailwindcss": "3.3.3",
    "viem": "~1.6.7",
    "wagmi": "~1.3.10"

2:
My ABI it's just for this function:

/**
     * @dev Withraws ZRC20 tokens to external chains, this function causes cctx module to send out outbound tx to the outbound chain
     * this contract should be given enough allowance of the gas ZRC20 to pay for outbound tx gas fee.
     * @param to, recipient address.
     * @param amount, amount to deposit.
     * @return true/false if succeeded/failed.
     */
    function withdraw(bytes memory to, uint256 amount) external override returns (bool) {
        (address gasZRC20, uint256 gasFee) = withdrawGasFee();
        if (!IZRC20(gasZRC20).transferFrom(msg.sender, FUNGIBLE_MODULE_ADDRESS, gasFee)) {
            revert GasFeeTransferFailed();
        }
        _burn(msg.sender, amount);
        emit Withdrawal(msg.sender, to, amount, gasFee, PROTOCOL_FLAT_FEE);
        return true;
    }

[rafael-ab]

Any solution on this? I'm facing the same issue...

[rameshdon1]

@lilyanB @holy-pengy brother, Is there any solution to this.?
I am on polygon mumbai network.

  const { data, isLoading, isSuccess, write } = useContractWrite({
    address: "0xfcb2ed6f36dce0fcb048c65887d9f83e9df418e1",
    abi: [
      {
        inputs: [
          { internalType: 'bytes', name: 'ancillaryData', type: 'bytes' },
          { internalType: 'address', name: 'rewardToken', type: 'address' },
          { internalType: 'uint256', name: 'reward', type: 'uint256' },
          { internalType: 'uint256', name: 'proposalBond', type: 'uint256' },
          { internalType: 'uint256', name: 'liveness', type: 'uint256' },
        ],
        name: 'initialize',
        outputs: [
          { internalType: 'bytes32', name: 'questionID', type: 'bytes32' },
        ],
        stateMutability: 'nonpayable',
        type: 'function',
      },
    ],
    functionName: 'initialize',
    args: [ancillaryBytes, rewardToken, reward, proposalBond, liveness],
  });

When i run write(), I get this "TypeError: hex_.replace is not a function" error

May be I am not passing bytes correctly, how should I pass that first argument? Suppose the string that I need to convert to bytes and pass as argument is "Hello World". I am using stringToBytes here.

[fabdarice]

make sure to use toHex (and not toBytes)

[wahabshah21]

Maybe it will help someone. For me the order of arguments I was passing was wrong. One of them was misplaced. As soon as I adjusted them it worked fine,