Relay transactions manually

Run Supersim

This exercise needs to be done on Supersim. You cannot use the devnets because you cannot disable autorelay on them.

1. Follow the installation guide.

2. Run Supersim without --interop.relay.

   ./supersim

Create the state for relaying messages

The results of this step are similar to what the message passing tutorial would produce if you did not have autorelay on.

Execute this script.

#! /bin/sh
 
rm -rf manual-relay
mkdir -p manual-relay/onchain
cd manual-relay/onchain
 
PRIVATE_KEY=0xac0974bec39a17e36ba4a6b4d238ff944bacb478cbed5efcae784d7bf4f2ff80
USER_ADDRESS=`cast wallet address --private-key $PRIVATE_KEY`
URL_CHAIN_A=http://localhost:9545
URL_CHAIN_B=http://localhost:9546
 
forge init
cd lib
npm install @eth-optimism/contracts-bedrock
cd ..
echo @eth-optimism/=lib/node_modules/@eth-optimism/ >> remappings.txt
 
cat > src/Greeter.sol <<EOF
//SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
contract Greeter {
    string greeting;
 
    event SetGreeting(
        address indexed sender,     // msg.sender
        string greeting
    );
 
    function greet() public view returns (string memory) {
        return greeting;
    }
 
    function setGreeting(string memory _greeting) public {
        greeting = _greeting;
        emit SetGreeting(msg.sender, _greeting);
    }
}
EOF
 
cat > src/GreetingSender.sol <<EOF
//SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import { Predeploys } from "@eth-optimism/contracts-bedrock/src/libraries/Predeploys.sol";
import { IL2ToL2CrossDomainMessenger } from "@eth-optimism/contracts-bedrock/src/L2/IL2ToL2CrossDomainMessenger.sol";
 
import { Greeter } from "src/Greeter.sol";
 
contract GreetingSender {
    IL2ToL2CrossDomainMessenger public immutable messenger =
        IL2ToL2CrossDomainMessenger(Predeploys.L2_TO_L2_CROSS_DOMAIN_MESSENGER);
 
    address immutable greeterAddress;
    uint256 immutable greeterChainId;
 
    constructor(address _greeterAddress, uint256 _greeterChainId) {
        greeterAddress = _greeterAddress;
        greeterChainId = _greeterChainId;
    }
 
    function setGreeting(string calldata greeting) public {
        bytes memory message = abi.encodeCall(
            Greeter.setGreeting,
            (greeting)
        );
        messenger.sendMessage(greeterChainId, greeterAddress, message);
    }
}
EOF
 
CHAIN_ID_B=`cast chain-id --rpc-url $URL_CHAIN_B`
GREETER_B_ADDRESS=`forge create --rpc-url $URL_CHAIN_B --private-key $PRIVATE_KEY Greeter --broadcast | awk '/Deployed to:/ {print $3}'`
GREETER_A_ADDRESS=`forge create --rpc-url $URL_CHAIN_A --private-key $PRIVATE_KEY --broadcast GreetingSender --constructor-args $GREETER_B_ADDRESS $CHAIN_ID_B | awk '/Deployed to:/ {print $3}'`
 
echo Setup done
 
cd ..
 
cat > sendAndRelay.sh <<EOF
#! /bin/sh
PRIVATE_KEY=$PRIVATE_KEY
USER_ADDRESS=$USER_ADDRESS
URL_CHAIN_A=$URL_CHAIN_A
URL_CHAIN_B=$URL_CHAIN_B
GREETER_A_ADDRESS=$GREETER_A_ADDRESS
GREETER_B_ADDRESS=$GREETER_B_ADDRESS
CHAIN_ID_B=$CHAIN_ID_B
 
cast send -q --private-key \$PRIVATE_KEY --rpc-url \$URL_CHAIN_A \$GREETER_A_ADDRESS "setGreeting(string)" "Hello from chain A \$$"
 
cast logs "SentMessage(uint256,address,uint256,address,bytes)" --rpc-url \$URL_CHAIN_A | tail -14 > log-entry
TOPICS=\`cat log-entry | grep -A4 topics | awk '{print \$1}' | tail -4 | sed 's/0x//'\`
TOPICS=\`echo \$TOPICS | sed 's/ //g'\`
 
ORIGIN=0x4200000000000000000000000000000000000023
BLOCK_NUMBER=\`cat log-entry | awk '/blockNumber/ {print \$2}'\`
LOG_INDEX=\`cat log-entry | awk '/logIndex/ {print \$2}'\`
TIMESTAMP=\`cast block \$BLOCK_NUMBER --rpc-url \$URL_CHAIN_A | awk '/timestamp/ {print \$2}'\`
CHAIN_ID_A=\`cast chain-id --rpc-url \$URL_CHAIN_A\`
SENT_MESSAGE=\`cat log-entry | awk '/data/ {print \$2}'\`
LOG_ENTRY=0x\`echo \$TOPICS\$SENT_MESSAGE | sed 's/0x//'\`
 
RPC_PARAMS=\$(cat <<INNER_END_OF_FILE
{
    "origin": "\$ORIGIN",
    "blockNumber": "\$BLOCK_NUMBER",
    "logIndex": "\$LOG_INDEX",
    "timestamp": "\$TIMESTAMP",
    "chainId": "\$CHAIN_ID_A",
    "payload": "\$LOG_ENTRY"
}
INNER_END_OF_FILE
)
 
ACCESS_LIST=\`cast rpc admin_getAccessListForIdentifier --rpc-url http://localhost:8420 "\$RPC_PARAMS" | jq .accessList\`
 
echo Old greeting
cast call \$GREETER_B_ADDRESS "greet()(string)" --rpc-url \$URL_CHAIN_B
 
cast send -q \$ORIGIN "relayMessage((address,uint256,uint256,uint256,uint256),bytes)" "(\$ORIGIN,\$BLOCK_NUMBER,\$LOG_INDEX,\$TIMESTAMP,\$CHAIN_ID_A)" \$LOG_ENTRY --access-list "\$ACCESS_LIST" --rpc-url \$URL_CHAIN_B --private-key \$PRIVATE_KEY
 
echo New greeting
cast call \$GREETER_B_ADDRESS "greet()(string)" --rpc-url \$URL_CHAIN_B
 
EOF
 
chmod +x sendAndRelay.sh
 
echo Set these environment variables
echo GREETER_A_ADDRESS=$GREETER_A_ADDRESS
echo GREETER_B_ADDRESS=$GREETER_B_ADDRESS
echo PRIVATE_KEY=$PRIVATE_KEY

Setup

We are going to use a Node (opens in a new tab) project.

1. Initialize a new Node project.

   mkdir -p manual-relay/offchain
   cd manual-relay/offchain
   npm init -y
   npm install --save-dev -y viem @eth-optimism/viem
   mkdir src

2. Export environment variables. This is necessary because those variables are currently limited to the shell process. We need them in the Node process that the shell creates.

   export GREETER_A_ADDRESS GREETER_B_ADDRESS PRIVATE_KEY

Manual relaying app

1. Create a file manual-relay.mjs with:

   import {
       createWalletClient,
       http,
       publicActions,
       getContract,
   } from 'viem'
   import { privateKeyToAccount } from 'viem/accounts'
   import { supersimL2A, supersimL2B } from '@eth-optimism/viem/chains' 
   import { walletActionsL2, publicActionsL2 } from '@eth-optimism/viem'
    
   import { readFileSync } from 'fs';
    
   const greeterData = JSON.parse(readFileSync('../onchain/out/Greeter.sol/Greeter.json'))
   const greetingSenderData = JSON.parse(readFileSync('../onchain/out/Greeter.sol/Greeter.json'))
    
   const account = privateKeyToAccount(process.env.PRIVATE_KEY)
    
   const walletA = createWalletClient({
       chain: supersimL2A,
       transport: http(),
       account
   }).extend(publicActions)
       .extend(publicActionsL2())
   //    .extend(walletActionsL2())
    
   const walletB = createWalletClient({
       chain: supersimL2B,
       transport: http(),
       account
   }).extend(publicActions)
   //    .extend(publicActionsL2())
       .extend(walletActionsL2())
    
   const greeter = getContract({
       address: process.env.GREETER_B_ADDRESS,
       abi: greeterData.abi,
       client: walletB
   })
    
   const greetingSender = getContract({
       address: process.env.GREETER_A_ADDRESS,
       abi: greetingSenderData.abi,
       client: walletA
   })
    
   const txnBHash = await greeter.write.setGreeting(
       ["Greeting directly to chain B"])
   await walletB.waitForTransactionReceipt({hash: txnBHash})
    
   const greeting1 = await greeter.read.greet()
   console.log(`Chain B Greeting: ${greeting1}`)
    
   const txnAHash = await greetingSender.write.setGreeting(
       ["Greeting through chain A"])
   const receiptA = await walletA.waitForTransactionReceipt({hash: txnAHash})
    
   const greeting2 = await greeter.read.greet()
   console.log(`Greeting before the relay transaction: ${greeting2}`)
    
   const sentMessages = await walletA.interop.getCrossDomainMessages({
     logs: receiptA.logs,
   })
   const sentMessage = sentMessages[0] // We only sent 1 message
   const relayMessageParams = await walletA.interop.buildExecutingMessage({
     log: sentMessage.log,
   })
   const relayMsgTxnHash = await walletB.interop.relayCrossDomainMessage(relayMessageParams)
    
   const receiptRelay = await walletB.waitForTransactionReceipt({
     hash: relayMsgTxnHash,
   })
    
   const greeting3 = await greeter.read.greet()
   console.log(`Greeting after the relay transaction: ${greeting3}`)
   Explanation

   import { supersimL2A, supersimL2B } from '@eth-optimism/viem/chains' 
   import { walletActionsL2, publicActionsL2 } from '@eth-optimism/viem'

   Import from the @eth-optimism/viem (opens in a new tab) package.

   const walletA = createWalletClient({
       chain: supersimL2A,
       transport: http(),
       account
   }).extend(publicActions)
       .extend(publicActionsL2())
   //    .extend(walletActionsL2())
    
   const walletB = createWalletClient({
       chain: supersimL2B,
       transport: http(),
       account
   }).extend(publicActions)
   //    .extend(publicActionsL2())
       .extend(walletActionsL2())

   In addition to extending the wallets with Viem public actions (opens in a new tab), extend with the OP-Stack actions. On wallet A we need the public actions, those that only read information. On wallet B we need the wallet actions, the ones that require an account.

   const receiptA = await walletA.waitForTransactionReceipt({hash: txnAHash})

   To relay a message we need the information in the receipt. Also, we need to wait until the transaction with the relayed message is actually part of a block.

   const greeting2 = await greeter.read.greet()
   console.log(`Greeting before the relay transaction: ${greeting2}`)

   Show the user that until the relay transaction happens on chain B, the greeting is unchanged.

   const sentMessages = await walletA.interop.getCrossDomainMessages({
     logs: receiptA.logs,
   })
   const sentMessage = sentMessages[0] // We only sent 1 message

   A single transaction can send multiple messages. But here we know we sent just one, so we look for the first one in the list.

   const relayMessageParams = await walletA.interop.buildExecutingMessage({
     log: sentMessage.log,
   })
   const relayMsgTxnHash = await walletB.interop.relayCrossDomainMessage(relayMessageParams)
    
   const receiptRelay = await walletB.waitForTransactionReceipt({
     hash: relayMsgTxnHash,
   })

   Here we first send the relay message on chain B, and then wait for the receipt for it.

2. Run JavaScript program, and see that the message is relayed.

   node manual-relay.mjs

Debugging

To see what messages were relayed by a specific transaction you can use this code:

import { decodeRelayedL2ToL2Messages } from '@eth-optimism/viem'
 
const decodedRelays = decodeRelayedL2ToL2Messages(
    {receipt: receiptRelay})
 
console.log(decodedRelays)
console.log(decodedRelays.successfulMessages[0].log)