Lesson8 Withdraw: TypeError: contract.withdraw is not a function

[Sakana-xc]

Hi guys, I met some weird situation.
I finished connect, fund, getBalance through the course, they worked fine. Then I start withdraw part, it said: ```TypeError:

contract.withdraw is not a function at HTMLButtonElement.withdraw (index.js:82:56)

Then I found out fund button was broken too, it said:

Error: invalid decimal value (argument="value", value="", code=INVALID_ARGUMENT, version=bignumber/5.6.0)

It's weird cuz I did not make any change to fund part, and it worked fine before.

Here is my index.js

import { ethers } from "./ethers-5.6.esm.min.js"
import { abi, contractAddress } from "./constants.js"

const connectButton = document.getElementById("connectButton")
const fundButton = document.getElementById("fundButton")
const balanceButton = document.getElementById("balanceButton")
const withdrawButton = document.getElementById("withdrawButton")

connectButton.onclick = connect
fundButton.onclick = fund
balanceButton.onclick = getBalance
withdrawButton.onclick = withdraw

console.log(ethers)

async function connect() {
    if (typeof window.ethereum !== "undefined") {
        await window.ethereum.request({ method: "eth_requestAccounts" })
        connectButton.innerHTML = "Connected!"
    } else {
        connectButton.innerHTML.innerHTML = "Please install metamask!"
    }
}

async function fund() {
    const ethAmount = document.getElementById("ethAmount").value
    console.log(`Funding with ${ethAmount}...`)
    if (typeof window.ethereum !== "undefined") {
        //provider / connection to the blockchain
        //signer/ wallet /someone with somegas
        //contract that we are ingteracting with
        // ^ ABI, Address
        const provider = new ethers.providers.Web3Provider(window.ethereum)
        const signer = provider.getSigner()

        const contract = new ethers.Contract(contractAddress, abi, signer)
        try {
            const transactionResponse = await contract.fund({
                value: ethers.utils.parseEther(ethAmount),
            })
            await listenForTransactionMine(transactionResponse, provider)
            //Listen for the tx to be mined
            console.log("Done!")
        } catch (error) {
            console.log(error)
        }
    }
}

async function getBalance() {
    if (typeof window.ethereum !== "undefined") {
        const provider = new ethers.providers.Web3Provider(window.ethereum)
        const balance = await provider.getBalance(contractAddress)
        console.log(ethers.utils.formatEther(balance))
    }
}
function listenForTransactionMine(transactionResponse, provider) {
    console.log(`Mining ${transactionResponse.hash}...`)
    return new Promise((resolve, reject) => {
        provider.once(transactionResponse.hash, (transactionReceipt) => {
            console.log(
                `Completed with ${transactionReceipt.confirmations} confirmations`
            )
            resolve()
        })
    })

    //creat a listener for the blockchain
}

// fund function

//withdraw
async function withdraw() {
    if (typeof window.ethereum !== "undefined") {
        console.log("Withdrawing....")
        const provider = new ethers.providers.Web3Provider(window.ethereum)
        const signer = provider.getSigner()
        const contract = new ethers.Contract(contractAddress, abi, signer)

        try {
            const transactionResponse = await contract.withdraw()
            await listenForTransactionMine(transactionResponse, provider)
        } catch (error) {
            console.log(error)
        }
    }
}

Here is my repo:https://github.com/SakanaSachi/Html-FundMe-App.git

[Rishi860]

Your index.js file is fine and I checked through your front-end repo that also works.
I guess you are not entering the amount in the input field or the value entered in the field is not reaching your contract.
What does the console prints for this statement: console.log('Funding with ${ethAmount}...')

[Rishi860]

@SakanaSachi refer to this updated comment.

[Sakana-xc]

OMG thanks! You just remind me that I worte cheaper withdraw function and then I deleted the original one. I just cloned fundme.sol from lesson 7 repo and run yarn hardhat deploy, then copied the abi from artifacts, but now a new error poped up, it said:MetaMask - RPC Error: Internal JSON-RPC error.
Here is my backend repo after I replaced fundme.sol
https://github.com/SakanaSachi/Hardhat-Fund-Me

[Rishi860]

I guess it must be the noonce error. You must have restarted the hardhat node to recompile your .sol file. You need to reset the account in metamask to solve this issue.

[Sakana-xc]

I just reset the account, but still the same error inpage.js:1 MetaMask - RPC Error: Internal JSON-RPC error. {code: -32603, message: 'Internal JSON-RPC error.', data: {…}} code: -32603 data: {code: -32603, message: "Error: VM Exception while processing transaction: … with reason string 'You need to spend more ETH!'", data: {…}} message: "Internal JSON-RPC error." [[Prototype]]: Object, another browser shows the same. the other functions worked fine though..
I did some search on web and it mostly says something about settings, versions, gas limit etc, if it is not about the code I might just ignore it and move to next session.
Thanks for the help!

[Rishi860]

This is a custom error You need to spend more ETH! which we created if something fails and as it says, you need to increase the Eth amount in the transaction to cross a certain limit to even fund the contract.
Check your fundMe.sol file
require( msg.value.getConversionRate(s_priceFeed) >= MINIMUM_USD, "You need to spend more ETH!" );
just increase the amount and it should work.

Happy coding!