Ways to invoke contract methods

Question

I'm just starting learning development on Ethereum. So far I created a couple of local projects using truffle / web3js / react-native. Right now I started solving exercises on https://ethernaut.openzeppelin.com/.

I'm a little bit confused when it comes to invoking methods from the contract. In my local web3js project, when I was sending ether to payable function I was doing it like this:

await myContract.methods.myPayableMethod().send({
        from: accounts[0],
        value: ethValue
      });

On the Ethernaut I had to invoke payable method like this:

await ethernautContract.contribute({value: ethValue})

instead of this:

await ethernautContract.methods.contribute().send({
        from: accounts[0],
        value: ethValue
      });

Can anyone please explain whats the difference between the contracts, so that methods have to be invoked differently?

Answer 1

Each web3 javascript library will expose the contract methods in its own way. From the intro page of Ethernaut:

ethernaut is a TruffleContract object that wraps the Ethernaut.sol contract that has been deployed to the blockchain.

We can see that their contracts are instantiated as @truffle/contract which has a method calling procedure that looks like:

instance.someFunction(5);

On the other hand, web3js, the "classic" web3 library will expose a calling procedure involving the methods object:

myContract.methods.myMethod([param1[, param2[, ...]]]).call(options [, defaultBlock] [, callback])

Extra: you may also encounter usage of ethers.js, a library that in this case has a similar structure to truffle's instance.method.