How to check the state of a transaction in web3

In this tutorial, we are going to see how to check the state of a transaction with a transaction ID (or hash) using web3 in Javascript.

In this tutorial, we are going to see how to check the state of a transaction with a transaction ID (or hash) using web3 in Javascript.

Set up

The first step is to install the web3 dependency using the following command:

npm install web3

Then, to interact with a blockchain (Ethereum or BSC or any other) you need to create an instance of Web3 and give it a provider (like window.ethereum for browser wallets, for example).

After that, you need to connect to the user's wallet using any method you want. You can check out our guides if you want to learn how to connect to a wallet.

Once it's done, you have multiple ways to check a transaction status. We'll cover them all here.

How to get a transaction status from a transaction hash after calling sendRequest

If in your code you just called web3.eth.sendRequest({ ... }) then you can either:

  • pass a callback as second parameter
  • use the promise returned from that call
  • use the built-in event emitter

Passing a callback as second parameter

In the callback passed to sendRequest, the first parameter will hold an error if the transaction failed and the second parameter will be the hash of that transaction.

web3.eth.sendRequest({ ... }, (err, hash) => {
    // your code here
})

With that hash, you can call web3.eth.getTransaction or web3.eth.getTransactionReceipt. We will see these functions in detail later in this article.

Using the promise returned from the call

web3.eth.sendTransaction({
    ...
})
.then(function(receipt) {
    // your code here
});

With that code, the function inside the .then will be called once the transaction is completed. The receipt parameter will hold information about the transaction. We will see more details about the receipt below.

Using the built-in event emitter

web3.eth.sendTransaction({ ... })
.on('transactionHash', (hash) => {
    ...
})
.on('receipt', (receipt) => {
    ...
})
.on('confirmation', (confirmationNumber, receipt) => {
    ...
})
.on('error', console.error); // If a out of gas error, the second parameter is the receipt.

As you can see, the way it works is that you use the .on function and pass it the event name and a callback.

Here are all the events you can use:

  • sending : Fired immediately before transmitting the transaction request after the request body has been written to the client, but before the transaction hash is received. It returns a payload containing details about the transaction.

  • transactionHash : Fired when the transaction hash is available. It returns the transactionHash as a string.

  • receipt : Fired when the transaction receipt is available and returns the transaction receipt containing details about the transaction.

  • confirmation : Fired for every confirmation from confirmation 0 to the 12th confirmation. It returns the confirmation number as the first and the receipt as the second argument. As always, the receipt contains information about the transaction. On confirmation 0, you can see the block where the transaction is mined.

  • error : Fired if an error occurs while sending the transaction. If the transaction was rejected by the network with a receipt, the receipt will be available as a property on the error object.

The transaction receipt object

We've been talking a lot about it during that article. Here is what it contains :

  • status : TRUE if the transaction was successful, FALSE if the EVM reverted the transaction.
  • blockHash : The hash of the block where the transaction was in.
  • blockNumber : The block number where this transaction was in.
  • transactionHash : The hash of the transaction.
  • transactionIndex: The transactions' index position in the block.
  • from : The address of the sender.
  • to : The address of the receiver. It is null when it’s a contract creation transaction.
  • contractAddress : The contract address created, if the transaction was a contract creation, otherwise null.
  • cumulativeGasUsed : The total amount of gas used when the transaction was executed in the block.
  • gasUsed : The amount of gas used by the transaction alone.
  • logs : An array of log objects, that the transaction generated.

Getting the transaction status from a transaction hash

For that, you can either call web3.eth.getTransaction or web3.eth.getTransactionReceipt.

Using web3.eth.getTransactionReceipt :

web3.eth.getTransactionReceipt('transactionHash')
.then((receipt) => {
    ...
})

If the transaction is pending and has no receipt, the parameter receipt returned in the callback will be null otherwise it will be a receipt object like we've seen above.

Using web3.eth.getTransaction :

web3.eth.getTransaction('transactionHash')
.then((transaction) => {
    ...
})

The transaction object returned after calling getTransaction will hold the following information:

  • hash : The hash of the transaction.
  • nonce : The number of transactions made by the sender prior to this one.
  • blockHash : The hash of the block where this transaction was in. null if the transaction is pending.
  • blockNumber : The block number where this transaction was in. null if the transaction is pending.
  • transactionIndex : The transactions index position in the block. null if the transaction is pending.
  • from : The address of the sender.
  • to : The address of the receiver. It is null if it’s a contract creation transaction.
  • value : The value transferred in that transaction. The unit is wei.
  • gasPrice : The gas price provided by the sender in wei.
  • gas : The gas provided by the sender.
  • input : The data sent along with the transaction.

So using that function, you can make calls to getTransaction every 2-5 seconds using a setInterval and check the block hash every time to see if the transaction is still pending or not.

Thank you for reading this article 🙂