-
Notifications
You must be signed in to change notification settings - Fork 5
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Rewrite convert stables tests (#517)
- Loading branch information
Showing
10 changed files
with
684 additions
and
663 deletions.
There are no files selected for viewing
247 changes: 124 additions & 123 deletions
247
packages/app/src/features/dialogs/convert-stables/ConvertStablesDialog.PageObject.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,123 +1,124 @@ | ||
| // import { DialogPageObject, TxOverviewWithRoute } from '@/features/dialogs/common/Dialog.PageObject' | ||
| // import { testIds } from '@/ui/utils/testIds' | ||
| // import { Locator, Page, expect } from '@playwright/test' | ||
|
|
||
| // export class ConvertStablesDialogPageObject extends DialogPageObject { | ||
| // constructor(page: Page) { | ||
| // super(page, /Convert Tokens/) | ||
| // } | ||
|
|
||
| // // # region locators | ||
| // locateAssetInSelector(): Locator { | ||
| // return this.region.getByTestId(testIds.component.AssetSelector.trigger).first() | ||
| // } | ||
|
|
||
| // locateAssetOutSelector(): Locator { | ||
| // return this.region.getByTestId(testIds.component.AssetSelector.trigger).last() | ||
| // } | ||
|
|
||
| // locateAssetInInput(): Locator { | ||
| // return this.region.getByTestId(testIds.component.AssetInput.input).first() | ||
| // } | ||
|
|
||
| // locateAssetOutInput(): Locator { | ||
| // return this.region.getByTestId(testIds.component.AssetInput.input).last() | ||
| // } | ||
|
|
||
| // locateAssetInMaxButton(): Locator { | ||
| // return this.region.getByTestId(testIds.component.AssetInput.maxButton).first() | ||
| // } | ||
|
|
||
| // locateAssetOutMaxButton(): Locator { | ||
| // return this.region.getByTestId(testIds.component.AssetInput.maxButton).last() | ||
| // } | ||
| // // #endregion locators | ||
|
|
||
| // // #region actions | ||
| // async selectAssetInAction(asset: string): Promise<void> { | ||
| // const selector = this.locateAssetInSelector() | ||
| // await this.selectOptionByLabelAction(selector, asset) | ||
| // } | ||
|
|
||
| // async selectAssetOutAction(asset: string): Promise<void> { | ||
| // const selector = this.locateAssetOutSelector() | ||
| // await this.selectOptionByLabelAction(selector, asset) | ||
| // } | ||
|
|
||
| // async openAssetInSelectorAction(): Promise<void> { | ||
| // await this.locateAssetInSelector().click() | ||
| // } | ||
|
|
||
| // async openAssetOutSelectorAction(): Promise<void> { | ||
| // await this.locateAssetOutSelector().click() | ||
| // } | ||
|
|
||
| // async fillAmountInAction(amount: number): Promise<void> { | ||
| // await this.locateAssetInInput().fill(amount.toString()) | ||
| // } | ||
|
|
||
| // async fillAmountOutAction(amount: number): Promise<void> { | ||
| // await this.locateAssetOutInput().fill(amount.toString()) | ||
| // } | ||
|
|
||
| // async clickMaxAmountInAction(): Promise<void> { | ||
| // await this.locateAssetInMaxButton().click() | ||
| // } | ||
|
|
||
| // async clickMaxAmountOutAction(): Promise<void> { | ||
| // await this.locateAssetOutMaxButton().click() | ||
| // } | ||
|
|
||
| // async clickBackToSavingsButton(): Promise<void> { | ||
| // await this.page.getByRole('button', { name: 'Back to Savings' }).click() | ||
| // await this.region.waitFor({ | ||
| // state: 'detached', | ||
| // }) | ||
| // } | ||
| // // #endregion actions | ||
|
|
||
| // // #region assertions | ||
| // async expectSuccessPage(): Promise<void> { | ||
| // await expect(this.page.getByText('Congrats, all done!')).toBeVisible() | ||
| // } | ||
|
|
||
| // async expectTransactionOverview(transactionOverview: TxOverviewWithRoute): Promise<void> { | ||
| // await this.expectTransactionOverviewRoute(transactionOverview.routeItems) | ||
| // await this.expectOutcomeText(transactionOverview.outcome) | ||
| // if (transactionOverview.outcomeUsd) { | ||
| // await this.expectOutcomeUsdText(transactionOverview.outcomeUsd) | ||
| // } | ||
| // } | ||
|
|
||
| // async expectAssetInSelectorSelectedOption(option: string): Promise<void> { | ||
| // await expect(this.locateAssetInSelector()).toHaveText(option) | ||
| // } | ||
|
|
||
| // async expectAssetOutSelectorSelectedOption(option: string): Promise<void> { | ||
| // await expect(this.locateAssetOutSelector()).toHaveText(option) | ||
| // } | ||
|
|
||
| // async expectSelectorOptions(options: string[]): Promise<void> { | ||
| // const selectorOptions = await this.page.getByTestId(testIds.component.AssetSelector.option).all() | ||
| // expect(selectorOptions).toHaveLength(options.length) | ||
|
|
||
| // for (const [index, option] of selectorOptions.entries()) { | ||
| // await expect(option).toContainText(options[index]!) | ||
| // } | ||
| // } | ||
|
|
||
| // async expectAssetInInputValue(value: string): Promise<void> { | ||
| // await expect(this.locateAssetInInput()).toHaveValue(value) | ||
| // } | ||
|
|
||
| // async expectAssetOutInputValue(value: string): Promise<void> { | ||
| // await expect(this.locateAssetOutInput()).toHaveValue(value) | ||
| // } | ||
|
|
||
| // async expectSingleInputError(error: string): Promise<void> { | ||
| // const inputError = this.page.getByTestId(testIds.component.AssetInput.error) | ||
| // await expect(inputError).toHaveCount(1) | ||
| // await expect(inputError).toHaveText(error) | ||
| // } | ||
| // // #endregion assertions | ||
| // } | ||
| import { DialogPageObject, TxOverviewWithRoute } from '@/features/dialogs/common/Dialog.PageObject' | ||
| import { TestContext } from '@/test/e2e/setup' | ||
| import { testIds } from '@/ui/utils/testIds' | ||
| import { Locator, expect } from '@playwright/test' | ||
|
|
||
| export class ConvertStablesDialogPageObject extends DialogPageObject { | ||
| constructor(testContext: TestContext<any>) { | ||
| super({ testContext, header: /Convert Tokens/ }) | ||
| } | ||
|
|
||
| // # region locators | ||
| locateAssetInSelector(): Locator { | ||
| return this.region.getByTestId(testIds.component.AssetSelector.trigger).first() | ||
| } | ||
|
|
||
| locateAssetOutSelector(): Locator { | ||
| return this.region.getByTestId(testIds.component.AssetSelector.trigger).last() | ||
| } | ||
|
|
||
| locateAssetInInput(): Locator { | ||
| return this.region.getByTestId(testIds.component.AssetInput.input).first() | ||
| } | ||
|
|
||
| locateAssetOutInput(): Locator { | ||
| return this.region.getByTestId(testIds.component.AssetInput.input).last() | ||
| } | ||
|
|
||
| locateAssetInMaxButton(): Locator { | ||
| return this.region.getByTestId(testIds.component.AssetInput.maxButton).first() | ||
| } | ||
|
|
||
| locateAssetOutMaxButton(): Locator { | ||
| return this.region.getByTestId(testIds.component.AssetInput.maxButton).last() | ||
| } | ||
| // #endregion locators | ||
|
|
||
| // #region actions | ||
| async selectAssetInAction(asset: string): Promise<void> { | ||
| const selector = this.locateAssetInSelector() | ||
| await this.selectOptionByLabelAction(selector, asset) | ||
| } | ||
|
|
||
| async selectAssetOutAction(asset: string): Promise<void> { | ||
| const selector = this.locateAssetOutSelector() | ||
| await this.selectOptionByLabelAction(selector, asset) | ||
| } | ||
|
|
||
| async openAssetInSelectorAction(): Promise<void> { | ||
| await this.locateAssetInSelector().click() | ||
| } | ||
|
|
||
| async openAssetOutSelectorAction(): Promise<void> { | ||
| await this.locateAssetOutSelector().click() | ||
| } | ||
|
|
||
| async fillAmountInAction(amount: number): Promise<void> { | ||
| await this.locateAssetInInput().fill(amount.toString()) | ||
| } | ||
|
|
||
| async fillAmountOutAction(amount: number): Promise<void> { | ||
| await this.locateAssetOutInput().fill(amount.toString()) | ||
| } | ||
|
|
||
| async clickMaxAmountInAction(): Promise<void> { | ||
| await this.locateAssetInMaxButton().click() | ||
| } | ||
|
|
||
| async clickMaxAmountOutAction(): Promise<void> { | ||
| await this.locateAssetOutMaxButton().click() | ||
| } | ||
|
|
||
| async clickBackToSavingsButton(): Promise<void> { | ||
| await this.page.getByRole('button', { name: 'Back to Savings' }).click() | ||
| await this.region.waitFor({ | ||
| state: 'detached', | ||
| }) | ||
| } | ||
| // #endregion actions | ||
|
|
||
| // #region assertions | ||
| async expectSuccessPage(): Promise<void> { | ||
| await expect(this.page.getByText('Congrats, all done!')).toBeVisible() | ||
| } | ||
|
|
||
| async expectTransactionOverview(transactionOverview: TxOverviewWithRoute): Promise<void> { | ||
| await this.expectTransactionOverviewRoute(transactionOverview.routeItems) | ||
| await this.expectOutcomeText(transactionOverview.outcome) | ||
| if (transactionOverview.outcomeUsd) { | ||
| await this.expectOutcomeUsdText(transactionOverview.outcomeUsd) | ||
| } | ||
| } | ||
|
|
||
| async expectAssetInSelectorSelectedOption(option: string): Promise<void> { | ||
| await expect(this.locateAssetInSelector()).toHaveText(option) | ||
| } | ||
|
|
||
| async expectAssetOutSelectorSelectedOption(option: string): Promise<void> { | ||
| await expect(this.locateAssetOutSelector()).toHaveText(option) | ||
| } | ||
|
|
||
| async expectSelectorOptions(options: string[]): Promise<void> { | ||
| const selectorOptions = await this.page.getByTestId(testIds.component.AssetSelector.option).all() | ||
| expect(selectorOptions).toHaveLength(options.length) | ||
|
|
||
| for (const [index, option] of selectorOptions.entries()) { | ||
| await expect(option).toContainText(options[index]!) | ||
| } | ||
| } | ||
|
|
||
| async expectAssetInInputValue(value: string): Promise<void> { | ||
| await expect(this.locateAssetInInput()).toHaveValue(value) | ||
| } | ||
|
|
||
| async expectAssetOutInputValue(value: string): Promise<void> { | ||
| await expect(this.locateAssetOutInput()).toHaveValue(value) | ||
| } | ||
|
|
||
| async expectSingleInputError(error: string): Promise<void> { | ||
| const inputError = this.page.getByTestId(testIds.component.AssetInput.error) | ||
| await expect(inputError).toHaveCount(1) | ||
| await expect(inputError).toHaveText(error) | ||
| } | ||
| // #endregion assertions | ||
| } |
126 changes: 64 additions & 62 deletions
126
packages/app/src/features/dialogs/convert-stables/ConvertStablesDialog.test-e2e.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,75 +1,77 @@ | ||
| // import { SavingsPageObject } from '@/pages/Savings.PageObject' | ||
| // import { DEFAULT_BLOCK_NUMBER } from '@/test/e2e/constants' | ||
| // import { setupFork } from '@/test/e2e/forking/setupFork' | ||
| // import { setup } from '@/test/e2e/setup' | ||
| // import { test } from '@playwright/test' | ||
| // import { mainnet } from 'viem/chains' | ||
| // import { ConvertStablesDialogPageObject } from './ConvertStablesDialog.PageObject' | ||
| import { SavingsPageObject } from '@/pages/Savings.PageObject' | ||
| import { DEFAULT_BLOCK_NUMBER } from '@/test/e2e/constants' | ||
| import { setup } from '@/test/e2e/setup' | ||
| import { test } from '@playwright/test' | ||
| import { mainnet } from 'viem/chains' | ||
| import { ConvertStablesDialogPageObject } from './ConvertStablesDialog.PageObject' | ||
|
|
||
| // test.describe('Convert Stables Dialog', () => { | ||
| // const fork = setupFork({ blockNumber: DEFAULT_BLOCK_NUMBER, chainId: mainnet.id, useTenderlyVnet: true }) | ||
| // let savingsPage: SavingsPageObject | ||
| // let convertStablesDialog: ConvertStablesDialogPageObject | ||
| test.describe('Convert Stables Dialog', () => { | ||
| let savingsPage: SavingsPageObject | ||
| let convertStablesDialog: ConvertStablesDialogPageObject | ||
|
|
||
| // test.beforeEach(async ({ page }) => { | ||
| // await setup(page, fork, { | ||
| // initialPage: 'savings', | ||
| // account: { | ||
| // type: 'connected-random', | ||
| // assetBalances: { | ||
| // ETH: 1, | ||
| // DAI: 10_000, | ||
| // }, | ||
| // }, | ||
| // }) | ||
| test.beforeEach(async ({ page }) => { | ||
| const testContext = await setup(page, { | ||
| blockchain: { | ||
| blockNumber: DEFAULT_BLOCK_NUMBER, | ||
| chainId: mainnet.id, | ||
| }, | ||
| initialPage: 'savings', | ||
| account: { | ||
| type: 'connected-random', | ||
| assetBalances: { | ||
| ETH: 1, | ||
| DAI: 10_000, | ||
| }, | ||
| }, | ||
| }) | ||
|
|
||
| // savingsPage = new SavingsPageObject(page) | ||
| // await savingsPage.clickConvertStablesButtonAction() | ||
| // convertStablesDialog = new ConvertStablesDialogPageObject(page) | ||
| // }) | ||
| savingsPage = new SavingsPageObject(testContext) | ||
| await savingsPage.clickConvertStablesButtonAction() | ||
| convertStablesDialog = new ConvertStablesDialogPageObject(testContext) | ||
| }) | ||
|
|
||
| // test('has correct selectors configuration', async ({ page }) => { | ||
| // await convertStablesDialog.expectAssetInSelectorSelectedOption('DAI') | ||
| // await convertStablesDialog.openAssetInSelectorAction() | ||
| // await convertStablesDialog.expectSelectorOptions(['USDC', 'USDS']) | ||
| // await page.keyboard.press('Escape') // closing selector | ||
| test('has correct selectors configuration', async ({ page }) => { | ||
| await convertStablesDialog.expectAssetInSelectorSelectedOption('DAI') | ||
| await convertStablesDialog.openAssetInSelectorAction() | ||
| await convertStablesDialog.expectSelectorOptions(['USDC', 'USDS']) | ||
| await page.keyboard.press('Escape') // closing selector | ||
|
|
||
| // await convertStablesDialog.expectAssetOutSelectorSelectedOption('USDC') | ||
| // await convertStablesDialog.openAssetOutSelectorAction() | ||
| // await convertStablesDialog.expectSelectorOptions(['USDS']) // no DAI option cause already selected in first selector | ||
| // }) | ||
| await convertStablesDialog.expectAssetOutSelectorSelectedOption('USDC') | ||
| await convertStablesDialog.openAssetOutSelectorAction() | ||
| await convertStablesDialog.expectSelectorOptions(['USDS']) // no DAI option cause already selected in first selector | ||
| }) | ||
|
|
||
| // test('first selector can override second selector', async () => { | ||
| // await convertStablesDialog.expectAssetInSelectorSelectedOption('DAI') | ||
| // await convertStablesDialog.expectAssetOutSelectorSelectedOption('USDC') | ||
| test('first selector can override second selector', async () => { | ||
| await convertStablesDialog.expectAssetInSelectorSelectedOption('DAI') | ||
| await convertStablesDialog.expectAssetOutSelectorSelectedOption('USDC') | ||
|
|
||
| // await convertStablesDialog.selectAssetInAction('USDC') // choosing already selected in second selector option | ||
| await convertStablesDialog.selectAssetInAction('USDC') // choosing already selected in second selector option | ||
|
|
||
| // await convertStablesDialog.expectAssetOutSelectorSelectedOption('DAI') // fist selector can override second | ||
| // await convertStablesDialog.openAssetOutSelectorAction() | ||
| // await convertStablesDialog.expectSelectorOptions(['USDS']) | ||
| // }) | ||
| await convertStablesDialog.expectAssetOutSelectorSelectedOption('DAI') // fist selector can override second | ||
| await convertStablesDialog.openAssetOutSelectorAction() | ||
| await convertStablesDialog.expectSelectorOptions(['USDS']) | ||
| }) | ||
|
|
||
| // test('changing value of any input updates both inputs', async () => { | ||
| // await convertStablesDialog.fillAmountInAction(5000) | ||
| // await convertStablesDialog.expectAssetInInputValue('5000') | ||
| // await convertStablesDialog.expectAssetOutInputValue('5000') | ||
| test('changing value of any input updates both inputs', async () => { | ||
| await convertStablesDialog.fillAmountInAction(5000) | ||
| await convertStablesDialog.expectAssetInInputValue('5000') | ||
| await convertStablesDialog.expectAssetOutInputValue('5000') | ||
|
|
||
| // await convertStablesDialog.clickMaxAmountInAction() | ||
| // await convertStablesDialog.expectAssetInInputValue('10000') | ||
| // await convertStablesDialog.expectAssetOutInputValue('10000') | ||
| await convertStablesDialog.clickMaxAmountInAction() | ||
| await convertStablesDialog.expectAssetInInputValue('10000') | ||
| await convertStablesDialog.expectAssetOutInputValue('10000') | ||
|
|
||
| // await convertStablesDialog.fillAmountOutAction(8_000) | ||
| // await convertStablesDialog.expectAssetInInputValue('8000') | ||
| // await convertStablesDialog.expectAssetOutInputValue('8000') | ||
| await convertStablesDialog.fillAmountOutAction(8_000) | ||
| await convertStablesDialog.expectAssetInInputValue('8000') | ||
| await convertStablesDialog.expectAssetOutInputValue('8000') | ||
|
|
||
| // await convertStablesDialog.clickMaxAmountOutAction() | ||
| // await convertStablesDialog.expectAssetInInputValue('10000') | ||
| // await convertStablesDialog.expectAssetOutInputValue('10000') | ||
| // }) | ||
| await convertStablesDialog.clickMaxAmountOutAction() | ||
| await convertStablesDialog.expectAssetInInputValue('10000') | ||
| await convertStablesDialog.expectAssetOutInputValue('10000') | ||
| }) | ||
|
|
||
| // test('displays validation error only for first input', async () => { | ||
| // await convertStablesDialog.fillAmountInAction(20_000) | ||
| // await convertStablesDialog.expectSingleInputError('Exceeds your balance') | ||
| // }) | ||
| // }) | ||
| test('displays validation error only for first input', async () => { | ||
| await convertStablesDialog.fillAmountInAction(20_000) | ||
| await convertStablesDialog.expectSingleInputError('Exceeds your balance') | ||
| }) | ||
| }) |
Oops, something went wrong.