Skip to content

Commit

Permalink
Merge pull request #983 from bancorprotocol/issue-#929
Browse files Browse the repository at this point in the history 
Small number display - subscript
  • Loading branch information
@GrandSchtroumpf
GrandSchtroumpf authored Jan 17, 2024
2 parents 933970e + 68bcdaf commit 9b7999e
Show file tree
Hide file tree
Showing 35 changed files with 757 additions and 560 deletions.
131 changes: 76 additions & 55 deletions e2e/pages/strategy.spec.ts
View file
Original file line number Diff line number Diff line change
@@ -1,65 +1,93 @@
import { test } from '@playwright/test';
import { mockApi } from '../utils/mock-api';
import { DebugDriver, removeFork, setupFork } from '../utils/DebugDriver';
import { CreateStrategyTestCase } from '../utils/strategy';
import * as recurring from '../tests/strategy/recurring/';
import * as disposable from '../tests/strategy/disposable/';
import * as overlapping from '../tests/strategy/overlapping/';

import { StrategyType } from './../utils/strategy/template';
import { navigateTo, screenshot } from '../utils/operators';
import { mockApi } from '../utils/mock-api';
import { DebugDriver, removeFork, setupFork } from '../utils/DebugDriver';
import {
MyStrategyDriver,
OverlappingStrategyTestCase,
RecurringStrategyTestCase,
} from '../utils/strategy';

type TestCase = (RecurringStrategyTestCase | OverlappingStrategyTestCase) & {
type: StrategyType;
};

const testCases: TestCase[] = [
const testCases: CreateStrategyTestCase[] = [
{
type: 'recurring',
setting: 'limit_limit',
base: 'ETH',
quote: 'DAI',
buy: {
min: '1500',
max: '1500',
budget: '10',
budgetFiat: '10',
input: {
type: 'recurring',
setting: 'limit_limit',
base: 'ETH',
quote: 'DAI',
buy: {
min: '1500',
max: '1500',
budget: '10',
budgetFiat: '10',
},
sell: {
min: '1700',
max: '1700',
budget: '2',
budgetFiat: '3334',
},
},
sell: {
min: '1700',
max: '1700',
budget: '2',
budgetFiat: '3334',
output: {
create: {
totalFiat: '$3,344.42',
buy: {
min: '1,500.00 DAI',
max: '1,500.00 DAI',
budget: '10.00 DAI',
fiat: '$10.00',
},
sell: {
min: '1,700.00 DAI',
max: '1,700.00 DAI',
budget: '2.00 ETH',
fiat: '$3,334.42',
},
},
},
},
{
type: 'overlapping',
base: 'BNT',
quote: 'USDC',
buy: {
min: '0.3',
max: '0.545454',
budget: '12.501572',
budgetFiat: '12.5',
input: {
type: 'overlapping',
base: 'BNT',
quote: 'USDC',
buy: {
min: '0.3',
max: '0.545454',
budget: '12.501572',
budgetFiat: '12.5',
},
sell: {
min: '0.33',
max: '0.6',
budget: '30',
budgetFiat: '12.61',
},
spread: '10', // Need a large spread for tooltip test
},
sell: {
min: '0.33',
max: '0.6',
budget: '30',
budgetFiat: '12.61',
output: {
create: {
totalFiat: '$25.11',
buy: {
min: '0.30 USDC',
max: '0.545454 USDC',
budget: '12.50 USDC',
fiat: '$12.50',
},
sell: {
min: '0.33 USDC',
max: '0.60 USDC',
budget: '30.00 BNT',
fiat: '$12.61',
},
},
},
spread: '10', // Need a large spread for tooltip test
},
];

const testDescription = (testCase: TestCase) => {
if (testCase.type === 'overlapping') return 'Overlapping';
if (testCase.type === 'disposable') return `Disposable ${testCase.setting}`;
return `Recurring ${testCase.setting.split('_').join(' ')}`;
const testDescription = (testCase: CreateStrategyTestCase) => {
const input = testCase.input;
if (input.type === 'overlapping') return 'Overlapping';
if (input.type === 'disposable') return `Disposable ${input.setting}`;
return `Recurring ${input.setting.split('_').join(' ')}`;
};

test.describe('Strategies', () => {
Expand All @@ -75,13 +103,6 @@ test.describe('Strategies', () => {
await removeFork(testInfo);
});

test('First Strategy Page', async ({ page }) => {
await navigateTo(page, '/');
const driver = new MyStrategyDriver(page);
await driver.firstStrategy().waitFor({ state: 'visible' });
await screenshot(page, 'first-strategy');
});

const testStrategies = {
recurring,
disposable,
Expand All @@ -90,7 +111,7 @@ test.describe('Strategies', () => {

for (const testCase of testCases) {
test.describe(testDescription(testCase), () => {
const testSuite = testStrategies[testCase.type];
const testSuite = testStrategies[testCase.input.type];
for (const [, testFn] of Object.entries(testSuite)) {
testFn(testCase);
}
Expand Down
Binary file modified e2e/screenshots/[Create Overlapping Strategy] Form.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified e2e/screenshots/[Create Overlapping Strategy] My Strategy.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
11 changes: 7 additions & 4 deletions e2e/tests/strategy/disposable/delete.ts
View file
Original file line number Diff line number Diff line change
@@ -1,14 +1,17 @@
import { expect, test } from '@playwright/test';
import { MyStrategyDriver } from './../../../utils/strategy';
import {
CreateStrategyTestCase,
MyStrategyDriver,
} from './../../../utils/strategy';
import { waitModalOpen } from './../../../utils/modal';
import { CreateStrategyTemplate } from './../../../utils/strategy/template';
import { NotificationDriver } from './../../../utils/NotificationDriver';
import { ManageStrategyDriver } from './../../../utils/strategy/ManageStrategyDriver';

export const deleteStrategyTest = (testCase: CreateStrategyTemplate) => {
export const deleteStrategyTest = (testCase: CreateStrategyTestCase) => {
return test('Delete', async ({ page }) => {
const { input } = testCase;
const manage = new ManageStrategyDriver(page);
const strategy = await manage.createStrategy(testCase);
const strategy = await manage.createStrategy(input);
await strategy.clickManageEntry('manage-strategy-deleteStrategy');

const modal = await waitModalOpen(page);
Expand Down
49 changes: 18 additions & 31 deletions e2e/tests/strategy/overlapping/create.ts
View file
Original file line number Diff line number Diff line change
@@ -1,40 +1,35 @@
import { expect, test } from '@playwright/test';
import { CreateStrategyTemplate } from '../../../utils/strategy/template';
import { NotificationDriver } from '../../../utils/NotificationDriver';
import {
fiatPrice,
navigateTo,
screenshot,
tokenPrice,
waitFor,
} from '../../../utils/operators';
import { navigateTo, screenshot, waitFor } from '../../../utils/operators';
import {
CreateStrategyDriver,
CreateStrategyTestCase,
MyStrategyDriver,
assertOverlappingTestCase,
} from '../../../utils/strategy';
import { MainMenuDriver } from '../../../utils/MainMenuDriver';
import { checkApproval } from '../../../utils/modal';

export const createOverlappingStrategy = (testCase: CreateStrategyTemplate) => {
const { base, quote, buy, sell } = testCase;
const buyBudgetFiat = parseFloat(buy.budgetFiat ?? '0');
const sellBudgetFiat = parseFloat(sell.budgetFiat ?? '0');
export const createOverlappingStrategy = (testCase: CreateStrategyTestCase) => {
assertOverlappingTestCase(testCase);
const { base, quote, sell } = testCase.input;
const output = testCase.output.create;

return test(`Create ${base}->${quote}`, async ({ page }) => {
test.setTimeout(180_000);
await waitFor(page, `balance-${quote}`, 30_000);

await navigateTo(page, '/');
const myStrategies = new MyStrategyDriver(page);
const createForm = new CreateStrategyDriver(page, testCase);
const createForm = new CreateStrategyDriver(page, testCase.input);
await myStrategies.createStrategy();
await createForm.selectToken('base');
await createForm.selectToken('quote');
await createForm.selectSetting('overlapping');
await createForm.nextStep();

const overlappingForm = await createForm.fillOverlapping();
expect(overlappingForm.max()).toHaveValue(testCase.sell.max.toString());
expect(overlappingForm.max()).toHaveValue(sell.max.toString());

const mainMenu = new MainMenuDriver(page);
await mainMenu.hide();
Expand All @@ -61,26 +56,18 @@ export const createOverlappingStrategy = (testCase: CreateStrategyTemplate) => {
const strategy = await myStrategies.getStrategy(1);
await expect(strategy.pair()).toHaveText(`${base}/${quote}`);
await expect(strategy.status()).toHaveText('Active');
await expect(strategy.totalBudget()).toHaveText(
fiatPrice(buyBudgetFiat + sellBudgetFiat)
);
await expect(strategy.buyBudget()).toHaveText(
tokenPrice(buy.budget, quote)
);
await expect(strategy.buyBudgetFiat()).toHaveText(fiatPrice(buyBudgetFiat));
await expect(strategy.sellBudget()).toHaveText(
tokenPrice(sell.budget, base)
);
await expect(strategy.sellBudgetFiat()).toHaveText(
fiatPrice(sellBudgetFiat)
);
await expect(strategy.totalBudget()).toHaveText(output.totalFiat);
await expect(strategy.buyBudget()).toHaveText(output.buy.budget);
await expect(strategy.buyBudgetFiat()).toHaveText(output.buy.fiat);
await expect(strategy.sellBudget()).toHaveText(output.sell.budget);
await expect(strategy.sellBudgetFiat()).toHaveText(output.sell.fiat);
const sellTooltip = await strategy.priceTooltip('sell');
await expect(sellTooltip.minPrice()).toHaveText(
tokenPrice(sell.min, quote)
);
await expect(sellTooltip.minPrice()).toHaveText(output.sell.min);
await expect(sellTooltip.maxPrice()).toHaveText(output.sell.max);
await sellTooltip.waitForDetached();
const buyTooltip = await strategy.priceTooltip('buy');
await expect(buyTooltip.maxPrice()).toHaveText(tokenPrice(buy.max, quote));
await expect(buyTooltip.minPrice()).toHaveText(output.buy.min);
await expect(buyTooltip.maxPrice()).toHaveText(output.buy.max);
await buyTooltip.waitForDetached();
await notif.close();
await screenshot(page, `[Create Overlapping Strategy] My Strategy`);
Expand Down
40 changes: 14 additions & 26 deletions e2e/tests/strategy/recurring/create.ts
View file
Original file line number Diff line number Diff line change
@@ -1,29 +1,25 @@
import { expect, test } from '@playwright/test';
import { CreateStrategyTemplate } from '../../../utils/strategy/template';
import { checkApproval } from '../../../utils/modal';
import { NotificationDriver } from '../../../utils/NotificationDriver';
import {
fiatPrice,
navigateTo,
tokenPrice,
waitFor,
} from '../../../utils/operators';
import { navigateTo, tokenPrice, waitFor } from '../../../utils/operators';
import {
CreateStrategyDriver,
CreateStrategyTestCase,
MyStrategyDriver,
assertRecurringTestCase,
} from '../../../utils/strategy';

export const createRecurringStrategy = (testCase: CreateStrategyTemplate) => {
const { base, quote, buy, sell } = testCase;
const buyBudgetFiat = parseFloat(buy.budgetFiat ?? '0');
const sellBudgetFiat = parseFloat(sell.budgetFiat ?? '0');
export const createRecurringStrategy = (testCase: CreateStrategyTestCase) => {
assertRecurringTestCase(testCase);
const { base, quote, buy, sell } = testCase.input;
const output = testCase.output.create;

return test(`Create`, async ({ page }) => {
await waitFor(page, `balance-${quote}`, 30_000);

await navigateTo(page, '/');
const myStrategies = new MyStrategyDriver(page);
const createForm = new CreateStrategyDriver(page, testCase);
const createForm = new CreateStrategyDriver(page, testCase.input);
await myStrategies.createStrategy();
await createForm.selectToken('base');
await createForm.selectToken('quote');
Expand All @@ -35,7 +31,7 @@ export const createRecurringStrategy = (testCase: CreateStrategyTemplate) => {
// Assert 100% outcome
await expect(buyForm.outcomeValue()).toHaveText(`0.006666 ${base}`);
await expect(buyForm.outcomeQuote()).toHaveText(tokenPrice(buy.min, quote));
await expect(sellForm.outcomeValue()).toHaveText(`3,400 ${quote}`);
await expect(sellForm.outcomeValue()).toHaveText(`3,400.00 ${quote}`);
await expect(sellForm.outcomeQuote()).toHaveText(
tokenPrice(sell.min, quote)
);
Expand All @@ -59,18 +55,10 @@ export const createRecurringStrategy = (testCase: CreateStrategyTemplate) => {
const strategy = await myStrategies.getStrategy(1);
await expect(strategy.pair()).toHaveText(`${base}/${quote}`);
await expect(strategy.status()).toHaveText('Active');
await expect(strategy.totalBudget()).toHaveText(
fiatPrice(buyBudgetFiat + sellBudgetFiat)
);
await expect(strategy.buyBudget()).toHaveText(
tokenPrice(buy.budget, quote)
);
await expect(strategy.buyBudgetFiat()).toHaveText(fiatPrice(buyBudgetFiat));
await expect(strategy.sellBudget()).toHaveText(
tokenPrice(sell.budget, base)
);
await expect(strategy.sellBudgetFiat()).toHaveText(
fiatPrice(sellBudgetFiat)
);
await expect(strategy.totalBudget()).toHaveText(output.totalFiat);
await expect(strategy.buyBudget()).toHaveText(output.buy.budget);
await expect(strategy.buyBudgetFiat()).toHaveText(output.buy.fiat);
await expect(strategy.sellBudget()).toHaveText(output.sell.budget);
await expect(strategy.sellBudgetFiat()).toHaveText(output.sell.fiat);
});
};
13 changes: 7 additions & 6 deletions e2e/tests/strategy/recurring/delete.ts
View file
Original file line number Diff line number Diff line change
@@ -1,16 +1,17 @@
import { expect, test } from '@playwright/test';
import { MyStrategyDriver } from './../../../utils/strategy';
import {
CreateStrategyTestCase,
MyStrategyDriver,
} from './../../../utils/strategy';
import { waitModalOpen } from './../../../utils/modal';
import { CreateStrategyTemplate } from './../../../utils/strategy/template';
import { NotificationDriver } from './../../../utils/NotificationDriver';
import { ManageStrategyDriver } from './../../../utils/strategy/ManageStrategyDriver';

export const deleteStrategyTest = (testCase: CreateStrategyTemplate) => {
export const deleteStrategyTest = (testCase: CreateStrategyTestCase) => {
const { input } = testCase;
return test('Delete', async ({ page }) => {
test.setTimeout(45_000);

const manage = new ManageStrategyDriver(page);
const strategy = await manage.createStrategy(testCase);
const strategy = await manage.createStrategy(input);
await strategy.clickManageEntry('manage-strategy-deleteStrategy');

const modal = await waitModalOpen(page);
Expand Down
9 changes: 5 additions & 4 deletions e2e/tests/strategy/recurring/deposit.ts
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,13 @@
import { expect, test } from '@playwright/test';
import { tokenPrice } from './../../../utils/operators';
import { CreateStrategyTemplate } from './../../../utils/strategy/template';
import { NotificationDriver } from './../../../utils/NotificationDriver';
import { ManageStrategyDriver } from './../../../utils/strategy/ManageStrategyDriver';
import { CreateStrategyTestCase } from '../../../utils/strategy';

export const depositStrategyTest = (testCase: CreateStrategyTemplate) => {
export const depositStrategyTest = (testCase: CreateStrategyTestCase) => {
const { input } = testCase;
return test('Deposit', async ({ page }) => {
const { base, quote, buy, sell } = testCase;
const { base, quote, buy, sell } = input;

const buyBudget = parseFloat(buy.budget);
const sellBudget = parseFloat(sell.budget);
Expand All @@ -16,7 +17,7 @@ export const depositStrategyTest = (testCase: CreateStrategyTemplate) => {
const newSellBudget = (sellBudget + depositSellBudget).toString();

const manage = new ManageStrategyDriver(page);
const strategy = await manage.createStrategy(testCase);
const strategy = await manage.createStrategy(input);
await strategy.clickManageEntry('manage-strategy-depositFunds');

await manage.waitForEditPage('deposit');
Expand Down
Loading

0 comments on commit 9b7999e

Please sign in to comment.