Skip to content
This repository has been archived by the owner on Feb 23, 2024. It is now read-only.

Commit

Permalink
test: tx list when wallet changes (#174)
Browse files Browse the repository at this point in the history
* test: fuel change accounts and tx list

* fix: test

* test: switch to account 1
  • Loading branch information
matt-user authored Oct 24, 2023
1 parent 5c5f888 commit 8491e6d
Show file tree
Hide file tree
Showing 4 changed files with 136 additions and 38 deletions.
59 changes: 58 additions & 1 deletion packages/app/playwright/commons/fuelWallet.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import { expect } from '../e2e/fixtures';
import { FUEL_MNEMONIC, FUEL_WALLET_PASSWORD } from '../mocks';

import { getButtonByText } from './button';
import { getByAriaLabel } from './locator';

export async function walletSetup(
context: BrowserContext,
Expand Down Expand Up @@ -65,9 +66,65 @@ export async function walletSetup(
await addButton.click({ timeout: 9000 });
}

export async function walletConnect(context: BrowserContext) {
export async function addAccount(context: BrowserContext) {
const walletPage = context.pages().find((page) => {
const url = page.url();
return url.includes('/popup.html#/wallet');
});

if (!walletPage) {
throw new Error('Wallet page could not be found.');
}

const accountsButton = getByAriaLabel(walletPage, 'Accounts');
await accountsButton.click();
const addAccountButton = getByAriaLabel(walletPage, 'Add account');
await addAccountButton.click();
}

export async function switchAccount(
context: BrowserContext,
accountName: string
) {
const walletPage = context.pages().find((page) => {
const url = page.url();
return url.includes('/popup.html#/wallet');
});

if (!walletPage) {
throw new Error('Wallet page could not be found.');
}

const accountsButton = getByAriaLabel(walletPage, 'Accounts');
await accountsButton.click();
const accountButton = getByAriaLabel(walletPage, accountName, true);
await accountButton.click();
}

export async function walletConnect(
context: BrowserContext,
accountNames?: string[],
connectCurrentAccount: boolean = true
) {
const walletPage = await getWalletPage(context);

if (!connectCurrentAccount) {
const disconnectCurrenctAccountButton = walletPage.getByRole('switch', {
checked: true,
});
await disconnectCurrenctAccountButton.click();
}

await Promise.all(
accountNames.map(async (accountName) => {
const accountConnectionButton = getByAriaLabel(
walletPage,
accountName
).getByRole('switch');
await accountConnectionButton.click();
})
);

const nextButton = getButtonByText(walletPage, 'Next');
await nextButton.click();
const connectButton = getButtonByText(walletPage, 'Connect');
Expand Down
8 changes: 6 additions & 2 deletions packages/app/playwright/commons/locator.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,11 @@
import type { Page } from '@playwright/test';

export function getByAriaLabel(page: Page, selector: string) {
return page.locator(`[aria-label*="${selector}"]`);
export function getByAriaLabel(
page: Page,
selector: string,
exact: boolean = false
) {
return page.getByLabel(selector, { exact });
}

export async function waitAriaLabel(page: Page, selector: string) {
Expand Down
86 changes: 52 additions & 34 deletions packages/app/playwright/e2e/Bridge.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,8 @@ import {
walletApprove,
walletConnect,
hasText,
addAccount,
switchAccount,
} from '../commons';
import { ETH_MNEMONIC, FUEL_MNEMONIC } from '../mocks';

Expand All @@ -28,6 +30,7 @@ import {
goToBridgePage,
goToTransactionsPage,
hasDropdownSymbol,
proceedAnyways,
} from './utils/bridge';

const { FUEL_PROVIDER_URL, VITE_ETH_ERC20, VITE_FUEL_FUNGIBLE_ASSET_ID } =
Expand All @@ -41,6 +44,9 @@ test.describe('Bridge', () => {

test.beforeEach(async ({ context, extensionId, page }) => {
await walletSetup(context, extensionId, page);
await addAccount(context);
await addAccount(context);
await switchAccount(context, 'Account 1');
client = createPublicClient({
chain: foundry,
transport: http(),
Expand Down Expand Up @@ -83,8 +89,8 @@ test.describe('Bridge', () => {
// Connect fuel
const connectFuel = getByAriaLabel(page, 'Connect Fuel Wallet');
await connectFuel.click();
await getByAriaLabel(page, 'Connect to Fuel Wallet').click();
await walletConnect(context);
await getByAriaLabel(page, 'Connect to Fuel Wallet', true).click();
await walletConnect(context, ['Account 2']);
});

const INITIATE_DEPOSIT =
Expand All @@ -109,7 +115,7 @@ test.describe('Bridge', () => {
await hasDropdownSymbol(page, 'ETH');
const depositInput = page.locator('input');
await depositInput.fill(DEPOSIT_AMOUNT);
const depositButton = getByAriaLabel(page, 'Deposit');
const depositButton = getByAriaLabel(page, 'Deposit', true);
await depositButton.click();
});

Expand Down Expand Up @@ -255,21 +261,7 @@ test.describe('Bridge', () => {
// For some reason we need this even if we wait for load state on the metamask notification page
await page.waitForTimeout(3000);

let metamaskNotificationPage = context
.pages()
.find((p) => p.url().includes('notification'));
if (!metamaskNotificationPage) {
metamaskNotificationPage = await context.waitForEvent('page', {
predicate: (page) => page.url().includes('notification'),
});
}
const proceedAnyways = metamaskNotificationPage.getByText(
'I want to proceed anyway'
);
const count = await proceedAnyways.count();
if (count) {
await proceedAnyways.click();
}
await proceedAnyways(context);

// Timeout needed until https://github.com/Synthetixio/synpress/issues/795 is fixed
await page.waitForTimeout(10000);
Expand Down Expand Up @@ -370,7 +362,7 @@ test.describe('Bridge', () => {
await test.step('Fill data and click on deposit', async () => {
await hasDropdownSymbol(page, 'TKN');
// Deposit asset
const depositButton = getByAriaLabel(page, 'Deposit');
const depositButton = getByAriaLabel(page, 'Deposit', true);

const depositInput = page.locator('input');
await depositInput.fill(DEPOSIT_AMOUNT);
Expand Down Expand Up @@ -552,21 +544,7 @@ test.describe('Bridge', () => {
// For some reason we need this even if we wait for load state on the metamask notification page
await page.waitForTimeout(3000);

let metamaskNotificationPage = context
.pages()
.find((p) => p.url().includes('notification'));
if (!metamaskNotificationPage) {
metamaskNotificationPage = await context.waitForEvent('page', {
predicate: (page) => page.url().includes('notification'),
});
}
const proceedAnyways = metamaskNotificationPage.getByText(
'I want to proceed anyway'
);
const count = await proceedAnyways.count();
if (count) {
await proceedAnyways.click();
}
await proceedAnyways(context);

// Timeout needed until https://github.com/Synthetixio/synpress/issues/795 is fixed
await page.waitForTimeout(5000);
Expand Down Expand Up @@ -640,5 +618,45 @@ test.describe('Bridge', () => {
expect(addressAfterRefresh).toEqual(address);
expect(balanceTextAfterRefresh).toEqual(balanceText);
});

await test.step('Check if transaction list reacts correctly to fuel wallet changes', async () => {
await goToTransactionsPage(page);

await test.step('Change to account 2 should show loading and empty feedback', async () => {
await switchAccount(context, 'Account 2');
const loading = getByAriaLabel(page, 'Loading Bridge Transactions');
await loading.innerText();
const noActivity = page.getByText('No activity yet');
await noActivity.innerText();
const subText = page.getByText(
"When you make a transaction you'll see it here"
);
await subText.innerText();
});

await test.step('Change to account 3 should show connect, but not loading', async () => {
await switchAccount(context, 'Account 3');
const loading = getByAriaLabel(page, 'Loading Bridge Transactions');
expect(await loading.count()).toBe(0);
const notDetected = page.getByText('Wallet not detected');
await notDetected.innerText();
const subText = page.getByText(
'Connect a wallet to see your transactions'
);
await subText.innerText();
const connectButton = getButtonByText(page, 'Connect Fuel Wallet');
expect(await connectButton.count()).toBe(1);
});

await test.step('Change to account 1 should show loading and transactions', async () => {
await switchAccount(context, 'Account 1');
const loading = getByAriaLabel(page, 'Loading Bridge Transactions');
await loading.innerText();
await checkTxItemDone(page, depositEthTxId);
await checkTxItemDone(page, depositERC20TxId);
await checkTxItemDone(page, withdrawEthTxId);
await checkTxItemDone(page, withdrawERC20TxId);
});
});
});
});
21 changes: 20 additions & 1 deletion packages/app/playwright/e2e/utils/bridge.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import { expect, type Page } from '@playwright/test';
import { expect } from '@playwright/test';
import type { BrowserContext, Page } from '@playwright/test';

import { shortAddress } from '../../../src/systems/Core/utils';
import { getButtonByText, getByAriaLabel } from '../../commons';
Expand Down Expand Up @@ -43,3 +44,21 @@ export const checkTxItemDone = async (page: Page, txHash: string) => {
const settledText = await settled.innerText();
expect(settledText).toBeTruthy();
};

export const proceedAnyways = async (context: BrowserContext) => {
let metamaskNotificationPage = context
.pages()
.find((p) => p.url().includes('notification'));
if (!metamaskNotificationPage) {
metamaskNotificationPage = await context.waitForEvent('page', {
predicate: (page) => page.url().includes('notification'),
});
}
const proceedAnyways = metamaskNotificationPage.getByText(
'I want to proceed anyway'
);
const count = await proceedAnyways.count();
if (count) {
await proceedAnyways.click();
}
};

0 comments on commit 8491e6d

Please sign in to comment.