From 5313ce6ff77c2cdcee8042f80e2e288cc4fcadbb Mon Sep 17 00:00:00 2001 From: devtealeaf Date: Thu, 5 Sep 2024 12:45:54 +0300 Subject: [PATCH 1/3] form fixes --- src/constants/index.ts | 14 +- src/layouts/Layout.astro | 1 + .../Vault/components/InvestForm/index.tsx | 528 ++++++------ .../Vault/functions/handleInputKeyDown.ts | 27 + src/modules/Vault/functions/index.ts | 8 +- .../Vault/tests/handleInputKeyDown.test.ts | 79 ++ src/utils/functions/get1InchRoutes.ts | 9 +- tests/e2e/vaults.test.ts | 752 +++++++++--------- 8 files changed, 755 insertions(+), 663 deletions(-) create mode 100644 src/modules/Vault/functions/handleInputKeyDown.ts create mode 100644 src/modules/Vault/tests/handleInputKeyDown.test.ts diff --git a/src/constants/index.ts b/src/constants/index.ts index 0c4f3030..022aa252 100644 --- a/src/constants/index.ts +++ b/src/constants/index.ts @@ -129,13 +129,13 @@ const CHAINS = [ explorer: "https://polygonscan.com/address/", active: true, // main page active networks }, - // { - // name: "Base", - // id: "8453", - // logoURI: "https://www.base.org/document/favicon-32x32.png", - // explorer: "https://basescan.org/address/", - // active: true, // main page active networks - // }, + { + name: "Base", + id: "8453", + logoURI: "https://www.base.org/document/favicon-32x32.png", + explorer: "https://basescan.org/address/", + active: true, // main page active networks + }, ]; const YEARN_PROTOCOLS = ["aave", "stargate", "stmatic", "compound"]; diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index 9e9cd2ef..a2d181df 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -346,6 +346,7 @@ const { title } = Astro.props as IProps; box-sizing:border-box; box-shadow:0 1px 8px rgba(0,0,0,0.5); display:none; + pointer-events: none; } .toLeft { top:230px !important; diff --git a/src/modules/Vault/components/InvestForm/index.tsx b/src/modules/Vault/components/InvestForm/index.tsx index 857c1076..0a2c5ca5 100644 --- a/src/modules/Vault/components/InvestForm/index.tsx +++ b/src/modules/Vault/components/InvestForm/index.tsx @@ -47,6 +47,7 @@ import { getAssetAllowance, getPlatformBalance, getAssetsBalances, + handleInputKeyDown, } from "../../functions"; import { DEFAULT_ERROR } from "@constants"; @@ -893,6 +894,7 @@ const InvestForm: React.FC = ({ network, vault }) => { (obj: any) => Number(obj?.amountIn) > 0 || Number(obj?.amountOut) > 0 ); } + setZapTokens(outData); let amounts; @@ -918,12 +920,12 @@ const InvestForm: React.FC = ({ network, vault }) => { ); } ///// index ^ 1 --> XOR - amounts = amounts.map((thisAmount, index) => { return !thisAmount ? parseUnits(amount, decimals) - zapAmounts[1][index ^ 1] : thisAmount; }); + const previewDepositAssets = await _publicClient?.readContract({ address: vault.address, abi: VaultABI, @@ -954,7 +956,7 @@ const InvestForm: React.FC = ({ network, vault }) => { } } } catch (err) { - console.error("ZAP DEPOSIT ERROR:", err); + console.error("zap deposit failed"); } finally { setLoader(false); } @@ -1621,6 +1623,7 @@ const InvestForm: React.FC = ({ network, vault }) => { const previewDeposit = async (asset: string, amount: string) => { if (!Number(amount)) return; + setLoader(true); if (defaultOption?.assetsArray) { const changedInput = defaultOption?.assetsArray?.indexOf(asset); @@ -1654,8 +1657,8 @@ const InvestForm: React.FC = ({ network, vault }) => { (token) => token.address === option[changedInput ? 0 : 1] ); - const decimals = token ? token.decimals + 18 : 24; - + const decimals = token ? token.decimals : 18; + // const decimals = token ? token.decimals + 18 : 24; amounts.push(parseUnits("1", decimals)); } } @@ -2116,26 +2119,9 @@ const InvestForm: React.FC = ({ network, vault }) => { handleInputChange(e.target.value, e.target.id) } type="text" - onKeyDown={(evt) => { - const currentValue = inputs[asset]; - - if ( - !/[\d.]/.test(evt.key) && - evt.key !== "Backspace" && - evt.key !== "ArrowLeft" && - evt.key !== "ArrowRight" - ) { - evt.preventDefault(); - } - - if ( - evt.key === "." && - currentValue && - currentValue.includes(".") - ) { - evt.preventDefault(); - } - }} + onKeyDown={(evt) => + handleInputKeyDown(evt, inputs[asset]) + } /> + ) : ( <> - {option?.length > 1 || - (defaultOption?.assets === option[0] && - option.length < 2) ? ( + {tab === "Deposit" ? ( <> - {button === "deposit" ? ( - - ) : button === "needApprove" ? ( -
- {option.map( - (asset: any, index: number) => - allowance && - formatUnits( - allowance[asset], - Number(getTokenData(asset)?.decimals) - ) < inputs[asset] && ( - - ) - )} -
- ) : button === "insufficientBalance" ? ( - - ) : ( - - )} - - ) : ( -
- {vault?.strategyInfo?.shortName === "CCF" && - defaultOption?.assets?.includes(option[0]) ? ( + {option?.length > 1 || + (defaultOption?.assets === option[0] && + option.length < 2) ? ( <> {button === "deposit" ? ( ) : button === "needApprove" ? (
- {option.map((asset: any, index: number) => { - if ( + {option.map( + (asset: any, index: number) => allowance && formatUnits( allowance[asset], Number(getTokenData(asset)?.decimals) - ) < inputs[asset] - ) { - isAnyCCFOptionVisible = true; - return ( + ) < inputs[asset] && ( - ); - } else { - return null; - } - })} - {!isAnyCCFOptionVisible && ( + ) + )} +
+ ) : button === "insufficientBalance" ? ( + + ) : ( + + )} + + ) : ( +
+ {vault?.strategyInfo?.shortName === "CCF" && + defaultOption?.assets?.includes(option[0]) ? ( + <> + {button === "deposit" ? ( + ) : button === "needApprove" ? ( +
+ {option.map((asset: any, index: number) => { + if ( + allowance && + formatUnits( + allowance[asset], + Number(getTokenData(asset)?.decimals) + ) < inputs[asset] + ) { + isAnyCCFOptionVisible = true; + return ( + + ); + } else { + return null; + } + })} + {!isAnyCCFOptionVisible && ( + + )} +
+ ) : button === "insufficientBalance" ? ( + + ) : ( + )} -
- ) : button === "insufficientBalance" ? ( - + ) : ( - - )} - - ) : ( - <> - {button === "insufficientBalance" ? ( - - ) : button === "needApprove" ? ( - - ) : button === "deposit" ? ( - + ) : button === "needApprove" ? ( + + ) : button === "deposit" ? ( + + ) : ( + )} - - ) : ( - + )} - +
)} - - )} - - ) : ( - <> - {button === "insufficientBalance" ? ( - - ) : button === "needApprove" ? ( - - ) : button === "withdraw" ? ( - + ) : ( - + <> + {button === "insufficientBalance" ? ( + + ) : button === "needApprove" ? ( + + ) : button === "withdraw" ? ( + + ) : ( + + )} + )} )} diff --git a/src/modules/Vault/functions/handleInputKeyDown.ts b/src/modules/Vault/functions/handleInputKeyDown.ts new file mode 100644 index 00000000..14a3cc6c --- /dev/null +++ b/src/modules/Vault/functions/handleInputKeyDown.ts @@ -0,0 +1,27 @@ +const handleInputKeyDown = ( + evt: React.KeyboardEvent, + currentValue: string +): void => { + if ( + !/[\d.]/.test(evt.key) && + evt.key !== "Backspace" && + evt.key !== "ArrowLeft" && + evt.key !== "ArrowRight" + ) { + evt.preventDefault(); + } + + if (evt.key === "0" && currentValue === "0") { + evt.preventDefault(); + } + + if (/^\d/.test(evt.key) && currentValue === "0" && evt.key !== ".") { + evt.preventDefault(); + } + + if (evt.key === "." && currentValue && currentValue.includes(".")) { + evt.preventDefault(); + } +}; + +export { handleInputKeyDown }; diff --git a/src/modules/Vault/functions/index.ts b/src/modules/Vault/functions/index.ts index 0f5f160e..e1362315 100644 --- a/src/modules/Vault/functions/index.ts +++ b/src/modules/Vault/functions/index.ts @@ -1,5 +1,11 @@ import { getAssetAllowance } from "./getAssetAllowance"; import { getPlatformBalance } from "./getPlatformBalance"; import { getAssetsBalances } from "./getAssetsBalances"; +import { handleInputKeyDown } from "./handleInputKeyDown"; -export { getAssetAllowance, getPlatformBalance, getAssetsBalances }; +export { + getAssetAllowance, + getPlatformBalance, + getAssetsBalances, + handleInputKeyDown, +}; diff --git a/src/modules/Vault/tests/handleInputKeyDown.test.ts b/src/modules/Vault/tests/handleInputKeyDown.test.ts new file mode 100644 index 00000000..b3cd5eac --- /dev/null +++ b/src/modules/Vault/tests/handleInputKeyDown.test.ts @@ -0,0 +1,79 @@ +import { describe, it, expect, vi } from "vitest"; +import { handleInputKeyDown } from "../functions"; + +describe("handleInputKeyDown", () => { + it("should allow digits to be entered", () => { + const preventDefault = vi.fn(); + const event = { + key: "1", + preventDefault, + } as unknown as React.KeyboardEvent; + + handleInputKeyDown(event, ""); + + expect(preventDefault).not.toHaveBeenCalled(); + }); + + it("should prevent multiple leading zeroes", () => { + const preventDefault = vi.fn(); + const event = { + key: "0", + preventDefault, + } as unknown as React.KeyboardEvent; + + handleInputKeyDown(event, "0"); + + expect(preventDefault).toHaveBeenCalled(); + }); + + it("should allow a single decimal point", () => { + const preventDefault = vi.fn(); + const event = { + key: ".", + preventDefault, + } as unknown as React.KeyboardEvent; + + handleInputKeyDown(event, "123"); + + expect(preventDefault).not.toHaveBeenCalled(); + }); + + it("should prevent multiple decimal points", () => { + const preventDefault = vi.fn(); + const event = { + key: ".", + preventDefault, + } as unknown as React.KeyboardEvent; + + handleInputKeyDown(event, "123."); + + expect(preventDefault).toHaveBeenCalled(); + }); + + it("should allow backspace and arrow keys", () => { + const preventDefault = vi.fn(); + + ["Backspace", "ArrowLeft", "ArrowRight"].forEach((key) => { + const event = { + key, + preventDefault, + } as unknown as React.KeyboardEvent; + + handleInputKeyDown(event, "123"); + + expect(preventDefault).not.toHaveBeenCalled(); + }); + }); + + it("should prevent invalid characters", () => { + const preventDefault = vi.fn(); + const event = { + key: "a", + preventDefault, + } as unknown as React.KeyboardEvent; + + handleInputKeyDown(event, "123"); + + expect(preventDefault).toHaveBeenCalled(); + }); +}); diff --git a/src/utils/functions/get1InchRoutes.ts b/src/utils/functions/get1InchRoutes.ts index 0b5e88ee..ba39fe2c 100644 --- a/src/utils/functions/get1InchRoutes.ts +++ b/src/utils/functions/get1InchRoutes.ts @@ -54,8 +54,13 @@ export const get1InchRoutes = async ( try { const response = await axios.get(url); - setError(false); + if (!response?.data[0]?.amountOut) { + throw new Error( + `1inch status: ${response?.data?.[0]?.aggApiReply.status}` + ); + } + setError(false); return { symbol: symbol as string, address: address, @@ -71,7 +76,7 @@ export const get1InchRoutes = async ( console.log(`Retrying (${currentRetry}/${maxRetries})...`, url); await new Promise((resolve) => setTimeout(resolve, 1000)); } else { - console.error("1INCH API ERROR:", error); + console.error("1inch api error:", error); setError(true); return { diff --git a/tests/e2e/vaults.test.ts b/tests/e2e/vaults.test.ts index 3003625e..b3c6d2b8 100644 --- a/tests/e2e/vaults.test.ts +++ b/tests/e2e/vaults.test.ts @@ -75,21 +75,21 @@ const formatTVL = (value: number): string => { }; test.beforeEach(async ({ page }) => { - // try { - // const response = await axios.get("https://api.stabilitydao.org/"); - - // const vaultsData = response.data?.vaults || {}; - - // allVaults = await Promise.all( - // CHAINS.map(async (chain) => { - // const chainVaults = vaultsData[chain] || {}; - // return Object.values(chainVaults).map((vault) => vault); - // }) - // ); - // allVaults = allVaults.flat(); - // } catch (error) { - // throw new Error(`API Error: ${error}`); - // } + try { + const response = await axios.get("https://api.stabilitydao.org/"); + + const vaultsData = response.data?.vaults || {}; + + allVaults = await Promise.all( + CHAINS.map(async (chain) => { + const chainVaults = vaultsData[chain] || {}; + return Object.values(chainVaults).map((vault) => vault); + }) + ); + allVaults = allVaults.flat(); + } catch (error) { + throw new Error(`API Error: ${error}`); + } await page.goto("/", { waitUntil: "load", timeout: 60000 }); await page.waitForTimeout(5000); @@ -113,432 +113,432 @@ test.describe("Vaults page tests", () => { expect(isCorrectPageURL).toBeTruthy(); } }); - // test("should be active vaults", async ({ page }) => { - // await page.waitForSelector("[data-testid='vault']"); + test("should be active vaults", async ({ page }) => { + await page.waitForSelector("[data-testid='vault']"); + + const activeVaults = await page.getByTestId("vault").count(); + + await expect(activeVaults).toBe(CURRENT_ACTIVE_VAULTS); + }); + + test("should be hide portfolio data", async ({ page }) => { + await page.getByTestId("visibleSwitcher").click(); + + let allValuesAreMasked = true; + + for (const value of PORTFOLIO_VALUES) { + const portfolioValue = await page + .getByTestId(`portfolio${value}`) + .textContent(); + + if (portfolioValue !== "****") { + allValuesAreMasked = false; + } + } + + await expect(allValuesAreMasked).toBeTruthy(); + }); + + test("should be change APR by latest/24h/7d", async ({ page }) => { + await page.getByTestId("hideSwapFee").first().click(); + + const APRTimeSwitcher = await page.getByTestId("APRTimeSwitcher").first(); + + const APRTypes = await page.getByTestId("APRType"); + + const vaults = await page.getByTestId("vault"); + const vaultsCount = await vaults.count(); + + const vaultsAPR = allVaults.map((vault) => vault.apr); + + const incomeLatestAPRs: number[] = vaultsAPR.map(({ incomeLatest }) => + Number(Number(incomeLatest).toFixed(2)) + ); + const income24hAPRs: number[] = vaultsAPR.map(({ income24h }) => + Number(Number(income24h).toFixed(2)) + ); + const incomeWeekAPRs: number[] = vaultsAPR.map(({ incomeWeek }) => + Number(Number(incomeWeek).toFixed(2)) + ); + + const allAPRs = [incomeLatestAPRs, income24hAPRs, incomeWeekAPRs]; + + for (let i = 0; i < allAPRs.length; i++) { + await APRTimeSwitcher.click(); + await page.waitForTimeout(500); + + await APRTypes.nth(i).click(); + await page.waitForTimeout(500); + + const currentArr = allAPRs[i]; - // const activeVaults = await page.getByTestId("vault").count(); + let isCorrectly = true; - // await expect(activeVaults).toBe(CURRENT_ACTIVE_VAULTS); - // }); + for (let j = 0; j < vaultsCount; j++) { + const vault = vaults.nth(j); - // test("should be hide portfolio data", async ({ page }) => { - // await page.getByTestId("visibleSwitcher").click(); + let value = await vault + .locator("td") + .nth(3) + .locator("p") + .first() + .textContent(); - // let allValuesAreMasked = true; + if ( + !currentArr.includes(Number(Number(value?.slice(0, -1)).toFixed(2))) + ) { + isCorrectly = false; + } + } + expect(isCorrectly).toBeTruthy(); + } + }); - // for (const value of PORTFOLIO_VALUES) { - // const portfolioValue = await page - // .getByTestId(`portfolio${value}`) - // .textContent(); + test("should be search", async ({ page }) => { + const search = await page.getByPlaceholder("Search"); - // if (portfolioValue !== "****") { - // allValuesAreMasked = false; - // } - // } + await search.fill(SEARCH_VALUES.valid); + await search.waitFor(); - // await expect(allValuesAreMasked).toBeTruthy(); - // }); + const vaults = await page.getByTestId("vault"); + const vaultsCount = await vaults.count(); - // test("should be change APR by latest/24h/7d", async ({ page }) => { - // await page.getByTestId("hideSwapFee").first().click(); + const searchResult = []; - // const APRTimeSwitcher = await page.getByTestId("APRTimeSwitcher").first(); + for (let i = 0; i < vaultsCount; i++) { + const vault = vaults.nth(i); + const symbolTd = await vault.locator("td").nth(0).innerText(); + const assetsTd = await vault.locator("td").nth(1).innerText(); - // const APRTypes = await page.getByTestId("APRType"); + if ( + symbolTd.includes(SEARCH_VALUES.valid) || + assetsTd.includes(SEARCH_VALUES.valid) + ) { + searchResult.push(symbolTd); + } + } - // const vaults = await page.getByTestId("vault"); - // const vaultsCount = await vaults.count(); + await expect(searchResult.length).toBe(vaultsCount); - // const vaultsAPR = allVaults.map((vault) => vault.apr); + await search.fill(SEARCH_VALUES.invalidByLaguage); + await search.waitFor(); - // const incomeLatestAPRs: number[] = vaultsAPR.map(({ incomeLatest }) => - // Number(Number(incomeLatest).toFixed(2)) - // ); - // const income24hAPRs: number[] = vaultsAPR.map(({ income24h }) => - // Number(Number(income24h).toFixed(2)) - // ); - // const incomeWeekAPRs: number[] = vaultsAPR.map(({ incomeWeek }) => - // Number(Number(incomeWeek).toFixed(2)) - // ); + let vaultsAfterInvalidSearch = await page.getByTestId("vault").count(); - // const allAPRs = [incomeLatestAPRs, income24hAPRs, incomeWeekAPRs]; + await expect(vaultsAfterInvalidSearch).toBe(0); - // for (let i = 0; i < allAPRs.length; i++) { - // await APRTimeSwitcher.click(); - // await page.waitForTimeout(500); + await search.fill(SEARCH_VALUES.invalidByNumber); + await search.waitFor(); - // await APRTypes.nth(i).click(); - // await page.waitForTimeout(500); + vaultsAfterInvalidSearch = await page.getByTestId("vault").count(); - // const currentArr = allAPRs[i]; + await expect(vaultsAfterInvalidSearch).toBe(0); + }); - // let isCorrectly = true; + test("should be filter by network", async ({ page }) => { + await page.waitForTimeout(5000); - // for (let j = 0; j < vaultsCount; j++) { - // const vault = vaults.nth(j); + const networks = await page.getByTestId("network"); + const networksCount = await networks.count(); - // let value = await vault - // .locator("td") - // .nth(3) - // .locator("p") - // .first() - // .textContent(); + const currentNetworks = []; - // if ( - // !currentArr.includes(Number(Number(value?.slice(0, -1)).toFixed(2))) - // ) { - // isCorrectly = false; - // } - // } - // expect(isCorrectly).toBeTruthy(); - // } - // }); + for (let i = 0; i < networksCount; i++) { + const networkName = await networks.nth(i).getAttribute("title"); - // test("should be search", async ({ page }) => { - // const search = await page.getByPlaceholder("Search"); + currentNetworks.push(networkName); + } - // await search.fill(SEARCH_VALUES.valid); - // await search.waitFor(); + // to be all networks + await expect(currentNetworks).toEqual(NETWORKS); - // const vaults = await page.getByTestId("vault"); - // const vaultsCount = await vaults.count(); + for (let i = 0; i < NETWORKS.length; i++) { + await networks.nth(i).click(); + if (i === 1) await networks.nth(i).click(); - // const searchResult = []; + await page.waitForTimeout(3000); - // for (let i = 0; i < vaultsCount; i++) { - // const vault = vaults.nth(i); - // const symbolTd = await vault.locator("td").nth(0).innerText(); - // const assetsTd = await vault.locator("td").nth(1).innerText(); + const vaults = await page.getByTestId("vault"); + const vaultsCount = await vaults.count(); - // if ( - // symbolTd.includes(SEARCH_VALUES.valid) || - // assetsTd.includes(SEARCH_VALUES.valid) - // ) { - // searchResult.push(symbolTd); - // } - // } + let networkVaultsCount = 0; - // await expect(searchResult.length).toBe(vaultsCount); + for (let j = 0; j < vaultsCount; j++) { + const vault = vaults.nth(j); - // await search.fill(SEARCH_VALUES.invalidByLaguage); - // await search.waitFor(); + const name = await vault + .locator("td") + .nth(0) + .getByRole("img") + .nth(0) + .getAttribute("alt"); + if (name === NETWORKS[i]) { + networkVaultsCount++; + } + } - // let vaultsAfterInvalidSearch = await page.getByTestId("vault").count(); + await expect(networkVaultsCount).toEqual(vaultsCount); + } + }); - // await expect(vaultsAfterInvalidSearch).toBe(0); + test("should be filter by stablecoins", async ({ page }) => { + const stablecoinsFilter = await page.getByTestId("filter").first(); - // await search.fill(SEARCH_VALUES.invalidByNumber); - // await search.waitFor(); + await stablecoinsFilter.click(); + await stablecoinsFilter.waitFor(); - // vaultsAfterInvalidSearch = await page.getByTestId("vault").count(); + const vaults = await page.getByTestId("vault"); + const vaultsCount = await vaults.count(); - // await expect(vaultsAfterInvalidSearch).toBe(0); - // }); + let stablecoinsVaultsCount = 0; - // test("should be filter by network", async ({ page }) => { - // await page.waitForTimeout(5000); + for (let i = 0; i < vaultsCount; i++) { + const vault = vaults.nth(i); - // const networks = await page.getByTestId("network"); - // const networksCount = await networks.count(); + const assets = await vault.locator("td").nth(1).textContent(); - // const currentNetworks = []; + const isStablecoins = assets + ?.split("+") + .every((asset) => asset.includes("USD") || asset.includes("DAI")); - // for (let i = 0; i < networksCount; i++) { - // const networkName = await networks.nth(i).getAttribute("title"); + if (isStablecoins) stablecoinsVaultsCount++; + } - // currentNetworks.push(networkName); - // } + await expect(stablecoinsVaultsCount).toEqual(vaultsCount); + }); - // // to be all networks - // await expect(currentNetworks).toEqual(NETWORKS); + test("should be all strategy filters", async ({ page }) => { + const strategiesCount = await page.getByTestId("strategy").count(); - // for (let i = 0; i < NETWORKS.length; i++) { - // await networks.nth(i).click(); - // if (i === 1) await networks.nth(i).click(); + const dropdownStrategyes = []; - // await page.waitForTimeout(3000); + for (let i = 0; i < strategiesCount; i++) { + const strategy = await page.getByTestId("strategy").nth(i).textContent(); - // const vaults = await page.getByTestId("vault"); - // const vaultsCount = await vaults.count(); + dropdownStrategyes.push(strategy); + } - // let networkVaultsCount = 0; + expect(dropdownStrategyes).toEqual(STRATEGIES); + expect(strategiesCount).toBe(STRATEGIES.length); + }); - // for (let j = 0; j < vaultsCount; j++) { - // const vault = vaults.nth(j); + test("should be filter by strategy", async ({ page }) => { + const strategiesCount = await page.getByTestId("strategy").count(); - // const name = await vault - // .locator("td") - // .nth(0) - // .getByRole("img") - // .nth(0) - // .getAttribute("alt"); - // if (name === NETWORKS[i]) { - // networkVaultsCount++; - // } - // } + for (let i = 0; i < strategiesCount; i++) { + const strategyName = await page + .getByTestId("strategy") + .nth(i) + .textContent(); - // await expect(networkVaultsCount).toEqual(vaultsCount); - // } - // }); + await page.getByTestId("strategyFilterDropdown").click(); + await page.waitForTimeout(500); - // test("should be filter by stablecoins", async ({ page }) => { - // const stablecoinsFilter = await page.getByTestId("filter").first(); + await page.getByTestId("strategy").nth(i).click(); + await page.waitForTimeout(500); - // await stablecoinsFilter.click(); - // await stablecoinsFilter.waitFor(); + const vaults = await page.getByTestId("vault"); + const vaultsCount = await vaults.count(); - // const vaults = await page.getByTestId("vault"); - // const vaultsCount = await vaults.count(); + let strategyVaultsCount = 0; - // let stablecoinsVaultsCount = 0; + for (let i = 0; i < vaultsCount; i++) { + const vault = vaults.nth(i); - // for (let i = 0; i < vaultsCount; i++) { - // const vault = vaults.nth(i); + const symbol = await vault.locator("td").first().textContent(); - // const assets = await vault.locator("td").nth(1).textContent(); + if (strategyName === symbol?.slice(-strategyName?.length)) + strategyVaultsCount++; + } + await expect(strategyVaultsCount).toEqual(vaultsCount); + } + }); - // const isStablecoins = assets - // ?.split("+") - // .every((asset) => asset.includes("USD") || asset.includes("DAI")); + test("should be sort", async ({ page }) => { + const allSorts = await page.getByTestId("sort"); + + let isSortedCorrectly; + + for (const { name, queue, dataType } of SORT_CASES) { + for (const sortOrder of ["desc", "asc"]) { + const sortCol = await allSorts.nth(queue); + + await sortCol.click(); + await sortCol.waitFor(); + + const vaults = await page.getByTestId("vault"); + const vaultsCount = await vaults.count(); + + const formattedValues = []; + + switch (dataType) { + case "text": + for (let i = 0; i < vaultsCount; i++) { + let value = ""; + const vault = vaults.nth(i); + if (name === "SYMBOL") { + value = + (await vault + .locator("td") + .nth(queue) + .locator("p") + .first() + .textContent()) || ""; + } + if (name === "ASSETS") { + value = + (await vault + .locator("td") + .nth(queue) + .locator("span") + .first() + .textContent()) || ""; + } + + formattedValues.push(value); + } + break; + case "APR": + for (let i = 0; i < vaultsCount; i++) { + const vault = vaults.nth(i); + + let value = await vault + .locator("td") + .nth(queue) + .locator("p") + .first() + .textContent(); + + if (value === "-") value = "0%"; + + const formattedValue = Number(value?.slice(0, -1)); + + if (!isNaN(formattedValue)) { + formattedValues.push(formattedValue); + } else { + throw new Error(`Invalid APR: ${formattedValue}`); + } + } + break; + case "withCurrency": + for (let i = 0; i < vaultsCount; i++) { + const vault = vaults.nth(i); + + const vsHoldTdCount = await vault + .getByTestId("vsHoldAPRTable") + .locator("td") + .count(); + + const price = await vault + .locator("td") + .nth(queue + vsHoldTdCount) + .textContent(); + + const formattedPrice = Number(price?.slice(1)); + + if (!isNaN(formattedPrice)) { + formattedValues.push(formattedPrice); + } else { + throw new Error(`Invalid price value: ${price}`); + } + } + break; + case "withFormat": + for (let i = 0; i < vaultsCount; i++) { + const vault = vaults.nth(i); + + const vsHoldTdCount = await vault + .getByTestId("vsHoldAPRTable") + .locator("td") + .count(); + + const TVL = await vault + .locator("td") + .nth(queue + vsHoldTdCount) + .textContent(); + + let formattedTVL = TVL?.slice(1)?.includes("K") + ? Number(TVL?.slice(1, -1)) * 1000 + : Number(TVL?.slice(1)); + + if (!isNaN(formattedTVL)) { + formattedValues.push(formattedTVL); + } else { + throw new Error(`Invalid TVL value: ${TVL}`); + } + } + break; + default: + throw new Error(`Invalid data type: ${dataType}`); + } + + if (dataType === "text") { + isSortedCorrectly = formattedValues.every((value, index, array) => { + return ( + index === 0 || + (sortOrder === "desc" + ? array[index - 1]?.localeCompare(value) >= 0 + : array[index - 1]?.localeCompare(value) <= 0) + ); + }); + } else { + isSortedCorrectly = formattedValues.every((value, index, array) => { + return ( + index === 0 || + (sortOrder === "desc" + ? array[index - 1] >= value + : array[index - 1] <= value) + ); + }); + } + + await expect(isSortedCorrectly).toBeTruthy(); + } + } + }); - // if (isStablecoins) stablecoinsVaultsCount++; - // } + test("should be tvl", async ({ page }) => { + try { + const TVLs = allVaults.map((vault) => vault.tvl); - // await expect(stablecoinsVaultsCount).toEqual(vaultsCount); - // }); + const totalTVL = TVLs.reduce((acc, tvl) => acc + tvl, 0); + const formattedTVL = formatTVL(totalTVL); - // test("should be all strategy filters", async ({ page }) => { - // const strategiesCount = await page.getByTestId("strategy").count(); + await page.waitForSelector("[data-testid='tvl']"); - // const dropdownStrategyes = []; + const pageTVL = await page.getByTestId("tvl").textContent(); - // for (let i = 0; i < strategiesCount; i++) { - // const strategy = await page.getByTestId("strategy").nth(i).textContent(); + expect(pageTVL).toBe(formattedTVL); + } catch (error) { + console.error("Error fetching or processing data:", error); + } + }); - // dropdownStrategyes.push(strategy); - // } + test("should be share price", async ({ page }) => { + const pageSharePrices = await page.getByTestId("sharePrice"); + const pageSharePricesCount = await pageSharePrices.count(); - // expect(dropdownStrategyes).toEqual(STRATEGIES); - // expect(strategiesCount).toBe(STRATEGIES.length); - // }); + const APISharePrices = allVaults.map((vault) => + Number(Number(vault.sharePrice).toFixed(3)) + ); - // test("should be filter by strategy", async ({ page }) => { - // const strategiesCount = await page.getByTestId("strategy").count(); + let isCorrectSharePrices = true; - // for (let i = 0; i < strategiesCount; i++) { - // const strategyName = await page - // .getByTestId("strategy") - // .nth(i) - // .textContent(); + for (let i = 0; i < pageSharePricesCount; i++) { + const sharePrice = (await pageSharePrices.nth(i).textContent())?.slice(1); - // await page.getByTestId("strategyFilterDropdown").click(); - // await page.waitForTimeout(500); + if (!APISharePrices?.includes(Number(sharePrice))) + isCorrectSharePrices = false; + } - // await page.getByTestId("strategy").nth(i).click(); - // await page.waitForTimeout(500); + expect(isCorrectSharePrices).toBeTruthy(); + }); - // const vaults = await page.getByTestId("vault"); - // const vaultsCount = await vaults.count(); + test("should be correct footer links", async ({ page }) => { + for (let i = 0; i < LINKS.length; i++) { + const href = await page.locator("footer a").nth(i).getAttribute("href"); - // let strategyVaultsCount = 0; - - // for (let i = 0; i < vaultsCount; i++) { - // const vault = vaults.nth(i); - - // const symbol = await vault.locator("td").first().textContent(); - - // if (strategyName === symbol?.slice(-strategyName?.length)) - // strategyVaultsCount++; - // } - // await expect(strategyVaultsCount).toEqual(vaultsCount); - // } - // }); - - // test("should be sort", async ({ page }) => { - // const allSorts = await page.getByTestId("sort"); - - // let isSortedCorrectly; - - // for (const { name, queue, dataType } of SORT_CASES) { - // for (const sortOrder of ["desc", "asc"]) { - // const sortCol = await allSorts.nth(queue); - - // await sortCol.click(); - // await sortCol.waitFor(); - - // const vaults = await page.getByTestId("vault"); - // const vaultsCount = await vaults.count(); - - // const formattedValues = []; - - // switch (dataType) { - // case "text": - // for (let i = 0; i < vaultsCount; i++) { - // let value = ""; - // const vault = vaults.nth(i); - // if (name === "SYMBOL") { - // value = - // (await vault - // .locator("td") - // .nth(queue) - // .locator("p") - // .first() - // .textContent()) || ""; - // } - // if (name === "ASSETS") { - // value = - // (await vault - // .locator("td") - // .nth(queue) - // .locator("span") - // .first() - // .textContent()) || ""; - // } - - // formattedValues.push(value); - // } - // break; - // case "APR": - // for (let i = 0; i < vaultsCount; i++) { - // const vault = vaults.nth(i); - - // let value = await vault - // .locator("td") - // .nth(queue) - // .locator("p") - // .first() - // .textContent(); - - // if (value === "-") value = "0%"; - - // const formattedValue = Number(value?.slice(0, -1)); - - // if (!isNaN(formattedValue)) { - // formattedValues.push(formattedValue); - // } else { - // throw new Error(`Invalid APR: ${formattedValue}`); - // } - // } - // break; - // case "withCurrency": - // for (let i = 0; i < vaultsCount; i++) { - // const vault = vaults.nth(i); - - // const vsHoldTdCount = await vault - // .getByTestId("vsHoldAPRTable") - // .locator("td") - // .count(); - - // const price = await vault - // .locator("td") - // .nth(queue + vsHoldTdCount) - // .textContent(); - - // const formattedPrice = Number(price?.slice(1)); - - // if (!isNaN(formattedPrice)) { - // formattedValues.push(formattedPrice); - // } else { - // throw new Error(`Invalid price value: ${price}`); - // } - // } - // break; - // case "withFormat": - // for (let i = 0; i < vaultsCount; i++) { - // const vault = vaults.nth(i); - - // const vsHoldTdCount = await vault - // .getByTestId("vsHoldAPRTable") - // .locator("td") - // .count(); - - // const TVL = await vault - // .locator("td") - // .nth(queue + vsHoldTdCount) - // .textContent(); - - // let formattedTVL = TVL?.slice(1)?.includes("K") - // ? Number(TVL?.slice(1, -1)) * 1000 - // : Number(TVL?.slice(1)); - - // if (!isNaN(formattedTVL)) { - // formattedValues.push(formattedTVL); - // } else { - // throw new Error(`Invalid TVL value: ${TVL}`); - // } - // } - // break; - // default: - // throw new Error(`Invalid data type: ${dataType}`); - // } - - // if (dataType === "text") { - // isSortedCorrectly = formattedValues.every((value, index, array) => { - // return ( - // index === 0 || - // (sortOrder === "desc" - // ? array[index - 1]?.localeCompare(value) >= 0 - // : array[index - 1]?.localeCompare(value) <= 0) - // ); - // }); - // } else { - // isSortedCorrectly = formattedValues.every((value, index, array) => { - // return ( - // index === 0 || - // (sortOrder === "desc" - // ? array[index - 1] >= value - // : array[index - 1] <= value) - // ); - // }); - // } - - // await expect(isSortedCorrectly).toBeTruthy(); - // } - // } - // }); - - // test("should be tvl", async ({ page }) => { - // try { - // const TVLs = allVaults.map((vault) => vault.tvl); - - // const totalTVL = TVLs.reduce((acc, tvl) => acc + tvl, 0); - // const formattedTVL = formatTVL(totalTVL); - - // await page.waitForSelector("[data-testid='tvl']"); - - // const pageTVL = await page.getByTestId("tvl").textContent(); - - // expect(pageTVL).toBe(formattedTVL); - // } catch (error) { - // console.error("Error fetching or processing data:", error); - // } - // }); - - // test("should be share price", async ({ page }) => { - // const pageSharePrices = await page.getByTestId("sharePrice"); - // const pageSharePricesCount = await pageSharePrices.count(); - - // const APISharePrices = allVaults.map((vault) => - // Number(Number(vault.sharePrice).toFixed(3)) - // ); - - // let isCorrectSharePrices = true; - - // for (let i = 0; i < pageSharePricesCount; i++) { - // const sharePrice = (await pageSharePrices.nth(i).textContent())?.slice(1); - - // if (!APISharePrices?.includes(Number(sharePrice))) - // isCorrectSharePrices = false; - // } - - // expect(isCorrectSharePrices).toBeTruthy(); - // }); - - // test("should be correct footer links", async ({ page }) => { - // for (let i = 0; i < LINKS.length; i++) { - // const href = await page.locator("footer a").nth(i).getAttribute("href"); - - // expect(href).toBe(LINKS[i]); - // } - // }); + expect(href).toBe(LINKS[i]); + } + }); }); From 0cc7d941e61266cf0962ea2019235107925878bc Mon Sep 17 00:00:00 2001 From: devtealeaf Date: Thu, 5 Sep 2024 12:46:12 +0300 Subject: [PATCH 2/3] version upd --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 0656a388..676ad880 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "stability-ui", "type": "module", - "version": "0.9.5-alpha", + "version": "0.9.6-alpha", "scripts": { "dev": "astro dev", "start": "astro dev", From 466ed17f27156c7caa0c2eec1c0062fef6cd02f0 Mon Sep 17 00:00:00 2001 From: devtealeaf Date: Thu, 5 Sep 2024 12:50:59 +0300 Subject: [PATCH 3/3] lint fix --- src/modules/Vault/components/InvestForm/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/modules/Vault/components/InvestForm/index.tsx b/src/modules/Vault/components/InvestForm/index.tsx index 0a2c5ca5..e908b935 100644 --- a/src/modules/Vault/components/InvestForm/index.tsx +++ b/src/modules/Vault/components/InvestForm/index.tsx @@ -955,7 +955,7 @@ const InvestForm: React.FC = ({ network, vault }) => { setButton("deposit"); } } - } catch (err) { + } catch { console.error("zap deposit failed"); } finally { setLoader(false);