when you write web3.eth.getAccounts().then(console.log)[3] the result of the getAccounts() is being passed in to console.log which is a function. The [3] bit is then being tacked on to the end which is meaningless.
const get3rdAccount = async () => {
const accounts = await web3.eth.getAccounts()
return accounts[3]
}
will do what you need. (or you can also use the callback approach as outlined by @Marez if you prefer)
The idea of "gasless" transactions is that a user signs a message, and sends that message to a gas relayer. The relayer is a separate entity, which collects the messages from the users, and sends the transactions. This way, the user doesn't need to pay for the transaction, only the relayer does. Then, optionally, the user can pay in tokens or other means of payment to the relayer.
The users' funds are stored in a smart contract, and only with a valid signature provided by the user, can funds be sent from that contract. In your example, you're calling a function on a contract as the user. Since all actual transactions on the network require gas, this will simply send a transaction directly to the contract, rather than using a gas relayer.
To send transactions to the gas station network, you can use their JavaScript libraries, for example:
const { RelayProvider } = require('@opengsn/gsn')
const provider = new RelayProvider(web3.currentProvider, ...);
const web3 = new Web3(provider);
const counterContract = new web3.eth.Contract(abi, ...);
await counterContract.methods.addValue().send({ ... });
This will use the RelayProvider to sign the transaction and send it to a gas relayer, who will then send the transaction to your contract, on behalf of the user.
There's a more detailed guide for using OpenGSN here: https://docs.opengsn.org/gsn-provider/getting-started.html
Best Answer
As pointed out by @Ismael in the comment and after some days spent working with both library I can confirm what he has written.
Truffle-contract is based on the stable version of web3 (v0.20), so it use promises and allow you to perform contract operation and methods in Javascript.
Web3 v1.0.0 (which is still in beta) use Promise and Promievents, so web3.eth.Contract allows you to interact with your contract like truffle-conctract but it has in my opinion more funcionalities.
One thing to note is that the utility of truffle test docs and docs gives you an istance of web3 and truffle-contract so (if I'm not wrong) you can't for now use web3.eth.Contract in .js truffle test.