The contract is fully tested and has no issue, I'm having trouble writing data to the blockchain from the frontend, while the same function test successfully in the tests the don't work while coming from the frontend This image is the iamge of the web showing the error in the browser inspect counsel but also below is the code block in showing the javascript function that is being executed once the "place bid" button in clicked

async function placeBid(itemId) {
    console.log("In the place bid function");

    try {
        let item = await shambaContract.getItem(itemId);
        let earnestDeposit = BigInt(item.cost) / BigInt(2);

        console.log("Item ID:", itemId);
        console.log("Earnest Deposit:", earnestDeposit.toString());

        // Get signer from ethers.js
        const provider = new ethers.providers.BrowserProvider(window.ethereum);
        const signer = provider.getSigner();

        // Get contract with signer
        let escrowWithSigner = escrowContract.connect(signer);

        // Prompt MetaMask for transaction approval
        let tx = await escrowWithSigner.placeBid(itemId, { value: earnestDeposit });
        console.log("Transaction sent:", tx);

        // Wait for the transaction to be mined
        await tx.wait();
        alert("Bid placed successfully!");

        // Refresh item view
        ViewItem(itemId);
    } catch (error) {
        console.error("Error placing bid:", error);
        alert("Failed to place bid. Please try again.");
    }
}

Things to note 1.before my debugging effort the error first started occurring in the hardhat node terminal even before the conformation of the transaction in metamask.

2.The technology used include solidity,hardhat, ethers.js, ipfs for image deployment,metamask for handling the ethers wallet.

Please help if you can, it has been bothering me for almost 2 weeks.

I was tying to allow the logged in user to place a bid, and I was expecting him to be added to the blockchain as one of the bidders but its not working