Arbitrum Token Bridge

The canonical token-bridge of Arbitrum

Are you a developer looking to explore the Arbitrum token bridge and its underlying technology? Then you've come to the right place! We'll walk you through the steps to run the Arbitrum token bridge website locally on your machine.

Offchain Labs ❤️ Open-source

Interested in contributing to this repo? We welcome your contribution. Check out the contribution guidelines and instructions here.

---

Prerequisites for running the code

• Install Node.js for your platform

• Install Node Version Manager (nvm) to setup the correct Node version for the project.

• Install VS Code for your platform

• Install Yarn (version 1) - Package manager

• Within VS Code, we use a some tools to automate things (e.g. code formatting), maintain consistency and reduce noise for code reviews. For the optimal development experience, install the following tools:

  • Prettier - Automatic code formatting
    • Find Prettier integration for your code editor here
  • EditorConfig - Automatic file formatting
    • Find EditorConfig integration for your code editor here
  • ESLint - Static analysis for JavaScript
    • Find ESLint integration for your code editor here

---

Steps to run the code locally

1. Clone the Arbitrum token bridge repository from Github onto your local machine

   $ git clone https://github.com/OffchainLabs/arb-token-bridge

2. Use the Node version as per project settings to avoid any errors before project installation.

   $ nvm use

3. Install dependencies in all packages using yarn.

   $ yarn

4. Set env vars:

   1. Copy the existing env.local.sample file present.

      $ cp ./packages/arb-token-bridge-ui/.env.local.sample  ./packages/arb-token-bridge-ui/.env

   2. In .env created, add NEXT_PUBLIC_INFURA_KEY=my-infura-key

   3. Set NEXT_PUBLIC_WALLETCONNECT_PROJECT_ID to your WalletConnect project ID. You can create a new project on the WalletConnect dashboard.

   4. For custom urls, set optional vars:

   • NEXT_PUBLIC_ETHEREUM_RPC_URL=my-eth-node
   • NEXT_PUBLIC_GOERLI_RPC_URL=my-goerli-node (see .env.sample) If no custom URL is provided, Infura will be used by default.

5. Build the project and internal packages

   $ yarn build

6. Finally, running the project

   1. (back in root dir:)

      $ yarn dev

   2. Visit http://localhost:3000/

---

Testing changes

It is important for any code change to pass both unit and end-to-end tests. This is generally done before raising the PR to ensure it doesn't break any existing feature.

Run Unit Tests

1. Run the token bridge UI locally on http://localhost:3000/
2. Run the tests

   $ yarn test:ci

Run End-to-End (E2E) Tests

1. Set up the Nitro test node

   1. First, make sure you have a Nitro test node running. Follow the instructions here.

   2. When the Nitro test-node is up and running you should see logs like sequencer_1 and staker-unsafe_1 in the terminal. This can take up to 10 minutes.

2. At the root of the token bridge UI:

   1. Run:

   $ cp ./packages/arb-token-bridge-ui/.e2e.env.sample ./packages/arb-token-bridge-ui/.e2e.env

   2. In the newly created file, .e2e.env, update your NEXT_PUBLIC_INFURA_KEY

3. Run the token bridge UI locally on http://localhost:3000/ with:

   $ yarn dev

4. Run e2e tests

   $ yarn test:e2e

Read more about the test setup here.

---