Chroma

MetaMask

Testing with MetaMask wallet extension (EVM)

MetaMask is the leading wallet for EVM (Ethereum Virtual Machine) chains. Chroma provides full support for automating MetaMask wallet interactions using MetaMask Flask (v13.17.0). Download the extension via npx chroma download-extensions before running tests.

Setup

Create a test with MetaMask wallet using createWalletTest:

import { createWalletTest } from '@avalix/chroma'

const test = createWalletTest({
  wallets: [{
    type: 'metamask'
  }]
})

test('metamask test', async ({ wallets }) => {
  const metamask = wallets.metamask
})

Import Account

Import an account using a Secret Recovery Phrase (SRP). This runs MetaMask's onboarding flow (import wallet, set password, complete setup):

await metamask.importSeedPhrase({
  seedPhrase: 'test test test test test test test test test test test junk',
})

Never use real seed phrases in tests. Always use test accounts with no real funds.

Authorize Connection

When your dApp requests wallet access:

// Your dApp triggers a connection request
await page.click('button:has-text("Connect Wallet")')

// Approve the request
await metamask.authorize()

Confirm or Reject Transaction

When your dApp requests transaction signing or message signing:

// Your dApp triggers a transaction
await page.click('button:has-text("Submit")')

// Confirm the transaction
await metamask.confirm()

To reject a transaction or connection request:

await metamask.reject()

MetaMask uses confirm() and reject() instead of approveTx() and rejectTx() used by other Chroma wallets.

Complete Example

tests/metamask.spec.ts
import { createWalletTest, expect } from '@avalix/chroma'

const test = createWalletTest({
  wallets: [{
    type: 'metamask'
  }]
})

test.describe('MetaMask Wallet', () => {
  test.beforeEach(async ({ wallets }) => {
    const metamask = wallets.metamask
    await metamask.importSeedPhrase({
      seedPhrase: 'test test test test test test test test test test test junk',
    })
  })

  test('connect and send transaction', async ({ page, wallets }) => {
    const metamask = wallets.metamask

    await page.goto('http://localhost:3000')
    await page.click('button:has-text("Connect")')
    await metamask.authorize()

    await expect(page.locator('.connected')).toBeVisible()

    await page.fill('input[name="amount"]', '0.01')
    await page.click('button:has-text("Send")')
    await metamask.confirm()

    await expect(page.locator('.success')).toBeVisible()
  })
})

Troubleshooting

Extension not loading

Make sure you've downloaded the extensions:

npx chroma download-extensions

Chroma uses MetaMask Flask. The extension is installed under .chroma/metamask-extension-13.17.0.

Increase the timeout in your test:

test.setTimeout(60000)

Account not found

Ensure the seed phrase is imported before interacting with the dApp:

// Import FIRST
await metamask.importSeedPhrase({ seedPhrase: '...' })

// THEN navigate to dApp
await page.goto('http://localhost:3000')

On this page