The client side application always throws the above error. I have connected the ganache account(by copying the private key)also with the correct port number in Metamask extension as well as in the truffle-config.js file but the error seems consistent.
App={
contracts:{},
loading:false,
load: async() => {
await App.loadWeb3();
await App.loadAccount();
await App.loadContract();
await App.render();
// await App.renderTask();
},
// https://medium.com/metamask/https-medium-com-metamask-breaking-change-injecting-web3-7722797916a8
loadWeb3: async () => {
if (typeof web3 !== 'undefined') {
App.web3Provider = web3.currentProvider
web3 = new Web3(web3.currentProvider)
} else {
window.alert("Please connect to Metamask.")
}
// Modern dapp browsers...
if (window.ethereum) {
window.web3 = new Web3(ethereum)
try {
// Request account access if needed
await ethereum.enable()
// Acccounts now exposed
web3.eth.sendTransaction({/* ... */})
} catch (error) {
// User denied account access...
}
}
// Legacy dapp browsers...
else if (window.web3) {
App.web3Provider = web3.currentProvider
window.web3 = new Web3(web3.currentProvider)
// Acccounts always exposed
web3.eth.sendTransaction({/* ... */})
}
// Non-dapp browsers...
else {
console.log('Non-Ethereum browser detected. You should consider trying MetaMask!')
}
},
loadAccount: async() => {
App.account= web3.eth.accounts[0];
console.log(App.account)
},
loadContract: async() => {
const todoList = $.getJSON('TodoList.json');//Getting the smart contract json file
//To do operations with our contract using truffle we need to do this
App.contracts.TodoList = TruffleContract(todoList);
App.contracts.TodoList.setProvider(App.web3Provider);//Also need to set the provider of web3
//Creating a (deployed)contract instance from the actual blockchain of type App.
//Check that the same variable 'todoList' is used to get the json file too
App.todoList = App.contracts.TodoList.deployed();// <<<<-------- Here is the error I guess
},
render: async() => {
//To Prevent double render
if(App.loading){
return
}
//Update app loading state
App.setLoading(true);
//Then render account
$('#account').html(App.account)
//Then update loading state
App.setLoading(false);
},
setLoading:(status)=> {
App.loading=status;
const loader=$('#loader');
const content=$('#content');
if(status){
loader.show()
content.hide()
}else{
loader.hide()
content.show()
}
},
}
$(()=>{
$(window).load(()=>{
App.load()
})
})
I have mentioned with <<<---- comment where the error occurs exactly I'm newly learning blockchain from this tutorial. Please help me out.Thanks in advance :)