Docs Icon ChevronRight For Developers Icon ChevronRight Playwright Utils

Playwright 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.

Fixtures

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.

1// e2e.test.ts
2import { test } from '@fuel-wallet/playwright-utils';
3
4test.use({ pathToExtension: './path/to/extension' });
5// OR
6const fuelPathToExtension = await downloadFuel(FUEL_WALLET_VERSION);
7test.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.

FuelWalletTestHelper

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

walletSetup

1static async walletSetup(
2    context: BrowserContext,
3    fuelExtensionId: string,
4    fuelProviderUrl: string,
5    chainName: string,
6    mnemonic: string = FUEL_MNEMONIC,
7    password: string = FUEL_WALLET_PASSWORD
8): Promise<FuelWalletTestHelper>

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

walletConnect

1async walletConnect(
2    accountNames?: string[],
3    connectCurrentAccount: boolean = true
4): 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.

walletApprove

1async 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.

getWalletNotificationPage

1async getWalletPopupPage(): Promise<Page>

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

addAssetThroughSettings

1async addAssetThroughSettings(
2    assetId: string,
3    name: string,
4    symbol: string,
5    decimals: number,
6    imageUrl?: string
7): Promise<void>

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

addAssetFromHomeBalance

1async addAssetFromHomeBalance(
2    assetId: string,
3    name: string,
4    symbol: string,
5    decimals: number,
6    imageUrl?: string
7): 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.

addAccount

1async addAccount(): Promise<void>

This function adds an account to the wallet.

switchAccount

1async 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.

addNetwork

1async 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.

switchNetwork

1async 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.

Mocks

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