Icon LinkPlaywright Utils

The @fuels/playwright-utils package allows developers building frontend applications on fuel to test their application as it interacts with the fuel wallet. This package is compatible with the playwright Icon Link test framework.

Icon LinkFixtures

If you are not using any custom test fixtures in your playwright tests, import the fixtures directly from this package, and pass in the path to the fuel extension. You can download the extension manually or use our downloadFuel function.

// e2e.test.ts
import { test } from '@fuel-wallet/playwright-utils';
 
test.use({ pathToExtension: './path/to/extension' });
// OR
const fuelPathToExtension = await downloadFuel(FUEL_WALLET_VERSION);
test.use({ pathToExtension: fuelPathToExtension });

If you are using custom test fixtures in your playwright tests then setup the context and extensionId fixtures as shown in the playwright docs Icon Link.

Icon LinkFuelWalletTestHelper

The FuelWalletTestHelper is a class which allows you to interact with the fuel wallet extension.

Icon LinkwalletSetup

static async walletSetup(
    context: BrowserContext,
    fuelExtensionId: string,
    fuelProviderUrl: string,
    chainName: string,
    mnemonic: string = FUEL_MNEMONIC,
    password: string = FUEL_WALLET_PASSWORD
): Promise<FuelWalletTestHelper>

This function sets up your fuel wallet extension and returns an instance of FuelWalletTestHelper.

Icon LinkwalletConnect

async walletConnect(
    accountNames?: string[],
    connectCurrentAccount: boolean = true
): Promise<void>

This function connects fuel wallet accounts to your web application through the connect popup window. It will throw an error if the connect popup window does not appear.

Icon LinkwalletApprove

async walletApprove(): Promise<void>

This function approves a transaction through the transaction popup window. It will throw an error if the transaction popup window does not appear.

Icon LinkgetWalletNotificationPage

async getWalletPopupPage(): Promise<Page>

This function returns the wallet popup page. It will throw an error is the popup does not exist.

Icon LinkaddAssetThroughSettings

async addAssetThroughSettings(
    assetId: string,
    name: string,
    symbol: string,
    decimals: number,
    imageUrl?: string
): Promise<void>

This function adds an asset to the wallet through the settings.

Icon LinkaddAssetFromHomeBalance

async addAssetFromHomeBalance(
    assetId: string,
    name: string,
    symbol: string,
    decimals: number,
    imageUrl?: string
): Promise<void>

This functions adds an asset to the wallet from the home page. It will throw an error if the wallet does not have any of the asset.

Icon LinkaddAccount

async addAccount(): Promise<void>

This function adds an account to the wallet.

Icon LinkswitchAccount

async switchAccount(accountName: string): Promise<void>

This function switches to the account named accountName. It will throw an error if there are not accounts with accountName.

Icon LinkaddNetwork

async addNetwork(chainName: string, providerUrl: string): Promise<void>

This function adds a network to the wallet. It will not add the network if a network already exists with the same name.

Icon LinkswitchNetwork

async switchNetwork(chainName: string): Promise<void>

This function switches to the network named chainName. It will throw an error if there are no networks named chainName.

Icon LinkMocks

Mnemonic and password mock variables for the fuel wallet. These are the default mnemonic and password variables for the walletSetup function.