EatTheBlocks Forum

Day 6 MetaMask Saying there is a contract error

I am doing the front end for Day 6 and I keep getting this error

This is my index.js code so far :

import Web3 from 'web3';
import EtherWallet from '../build/contracts/EtherWallet.json';

let web3;
let etherWallet;

//Initialize Web3
const initWeb3 = () => {
  return new Promise((resolve, reject) => {
if(typeof window.ethereum !== 'undefined') {
  const web3 = new Web3(window.ethereum);
  window.ethereum.enable()
    .then(() => {
      resolve(
        new Web3(window.ethereum)
      );
    })
    .catch(e => {
      reject(e);
    });
  return;
}
if(typeof window.web3 !== 'undefined') {
  return resolve(
    new Web3(window.web3.currentProvider)
  );
}
resolve(new Web3('http://localhost:9545'));
  });
};

const initContract = async () => {
  const networkId = await web3.eth.net.getId();
  return new web3.eth.Contract(
EtherWallet.abi, 
EtherWallet
  .networks[networkId]
  .address
  );
};

const initApp = () => {

const $deposit = document.getElementById('deposit');
const $depositResult = document.getElementById('deposit-result');

const $send = document.getElementById('send');
const $sendResult = document.getElementById('send-result');

const $balance = document.getElementById('balance');

let accounts = [];
  web3.eth.getAccounts().then(_accounts =>{
accounts = _accounts;
  });


  $deposit.addEventListener('submit', e => {
//prevent form from submitting otherwise page will reload
e.preventDefault();
//list of all inputs being submitted
const amount  = e.target.elements[0].value;
etherWallet.methods
.deposit()
.call()
 .then(() => {
    $depositResult.innerHTML = `The amount of ${amount} was successfully deposited`;
  
  })
  .catch(() => {
   $depositResult.innerHTML = 'Ooops... there was an error while trying to deposit';
  });
  });


$send.addEventListener('submit', e => {
  e.preventDefault();
  const address = e.target.elements[0].value;
  const amount =  e.target.elements[1].value;

  etherWallet.methods
  .send(address,amount)
  .send({from: accounts[0]})
  .then(()  => {
  $sendResult.innerHTML =`$The address of ${address} and amount of ${amount} was successfully sent`;


  }).catch(()=> {
$sendResult.innerHTML = `The address is ${address} and the amount is ${amount}` ;


  });



});


$balance.addEventListener('submit', e => {
  e.preventDefault();
  
  etherWallet.methods
  .balanceOF()
  .send({from: accounts[0]})
  .then(()   => {

$balance.innerHTML = `You have a balance of ${balanceOF}`;


  });





});



};

document.addEventListener('DOMContentLoaded', () => {
  initWeb3()
.then(_web3 => {
  web3 = _web3;
  return initContract();
})
.then(_etherWallet => {
  etherWallet = _etherWallet;
  initApp(); 
})
.catch(e => console.log(e.message));
});

Which action are you trying to do?

Also:

  • is Metamask pointing to correct network?
  • Have you reset accounts in Metamask?
  • Is the smart contract in the correct state?

I am trying to do the action of sending Ether to an Address.

  • Yes MetaMask Is pointing to my Ganache Instance
  • Yes I reset accounts in metamask
  • I am not sure, I think it should be. How do I check for correct state ?

now I get this error

mmm… can you try to git clone the end folder of the repo and try to run it?

Also, have you synchronized the private keys of Ganache and Metamask? If no, the addresses of Metamask will have no fake ether on Ganache and you wont be able to use them to send any transaction.

By the way, by checking the state, I just mean to make sure that you have run your migration and that it put the right data in the smart contract. For example some smart contracts have some initialization logic, like setting an admin address that protect access to some function, etc…

ok will do ! Thank you