From a5034cb1c0ddb65594d1a35fd97484ac843f59c9 Mon Sep 17 00:00:00 2001 From: eddie <66155195+just-toby@users.noreply.github.com> Date: Mon, 13 Nov 2023 15:10:44 -0800 Subject: [PATCH] fix: reset token selections when changing chains on /add (#7561) * fix: reset token selections when changing chains on /add * fix: tests * fix: add e2e test * fix: remove .only --- cypress/e2e/add-liquidity.test.ts | 10 +++++++ .../PoolDetails/PoolDetailsHeader.test.tsx | 27 +++++++++++++++++++ .../PoolDetails/PoolDetailsLink.test.tsx | 27 +++++++++++++++++++ .../PoolDetails/PoolDetailsStats.test.tsx | 24 +++++++++++++++++ .../PoolDetailsStatsButtons.test.tsx | 24 +++++++++++++++++ .../PoolDetailsLink.test.tsx.snap | 2 +- .../PoolDetailsStats.test.tsx.snap | 2 +- src/lib/hooks/useCurrency.ts | 5 +++- .../__snapshots__/index.test.tsx.snap | 2 +- src/pages/PoolDetails/index.test.tsx | 24 +++++++++++++++++ 10 files changed, 143 insertions(+), 4 deletions(-) diff --git a/cypress/e2e/add-liquidity.test.ts b/cypress/e2e/add-liquidity.test.ts index c38c01c681..4d0d3400d2 100644 --- a/cypress/e2e/add-liquidity.test.ts +++ b/cypress/e2e/add-liquidity.test.ts @@ -16,6 +16,16 @@ describe('Add Liquidity', () => { cy.contains('0.05% fee tier') }) + it('clears the token selection when chain changes', () => { + cy.visit('/add/0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984/ETH/500') + cy.get('#add-liquidity-input-tokena .token-symbol-container').should('contain.text', 'UNI') + cy.get('#add-liquidity-input-tokenb .token-symbol-container').should('contain.text', 'ETH') + cy.get('[data-testid="chain-selector"]').last().click() + cy.contains('Polygon').click() + cy.get('#add-liquidity-input-tokenb .token-symbol-container').should('contain.text', 'ETH') + cy.get('#add-liquidity-input-tokena .token-symbol-container').should('not.contain.text', 'UNI') + }) + it('does not crash if token is duplicated', () => { cy.visit('/add/0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984/0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984') cy.get('#add-liquidity-input-tokena .token-symbol-container').should('contain.text', 'UNI') diff --git a/src/components/Pools/PoolDetails/PoolDetailsHeader.test.tsx b/src/components/Pools/PoolDetails/PoolDetailsHeader.test.tsx index 6794976444..56671aa80a 100644 --- a/src/components/Pools/PoolDetails/PoolDetailsHeader.test.tsx +++ b/src/components/Pools/PoolDetails/PoolDetailsHeader.test.tsx @@ -1,9 +1,36 @@ import userEvent from '@testing-library/user-event' +import store from 'state' +import { addSerializedToken } from 'state/user/reducer' import { act, render, screen } from 'test-utils/render' import { PoolDetailsHeader } from './PoolDetailsHeader' describe('PoolDetailsHeader', () => { + beforeEach(() => { + store.dispatch( + addSerializedToken({ + serializedToken: { + chainId: 1, + address: '0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48', + symbol: 'USDC', + name: 'USD Coin', + decimals: 6, + }, + }) + ) + store.dispatch( + addSerializedToken({ + serializedToken: { + chainId: 1, + address: '0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2', + symbol: 'WETH', + name: 'Wrapped Ether', + decimals: 18, + }, + }) + ) + }) + const mockProps = { chainId: 1, poolAddress: '0x88e6a0c2ddd26feeb64f039a2c41296fcb3f5640', diff --git a/src/components/Pools/PoolDetails/PoolDetailsLink.test.tsx b/src/components/Pools/PoolDetails/PoolDetailsLink.test.tsx index ba80690467..1536d7fa5f 100644 --- a/src/components/Pools/PoolDetails/PoolDetailsLink.test.tsx +++ b/src/components/Pools/PoolDetails/PoolDetailsLink.test.tsx @@ -1,11 +1,38 @@ import { ChainId } from '@uniswap/sdk-core' import { USDC_MAINNET } from 'constants/tokens' +import store from 'state' +import { addSerializedToken } from 'state/user/reducer' import { usdcWethPoolAddress, validPoolToken0, validPoolToken1 } from 'test-utils/pools/fixtures' import { render, screen } from 'test-utils/render' import { PoolDetailsLink } from './PoolDetailsLink' describe('PoolDetailsHeader', () => { + beforeEach(() => { + store.dispatch( + addSerializedToken({ + serializedToken: { + chainId: 1, + address: '0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48', + symbol: 'USDC', + name: 'USD Coin', + decimals: 6, + }, + }) + ) + store.dispatch( + addSerializedToken({ + serializedToken: { + chainId: 1, + address: '0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2', + symbol: 'WETH', + name: 'Wrapped Ether', + decimals: 18, + }, + }) + ) + }) + it('renders link for pool address', async () => { const { asFragment } = render( { beforeEach(() => { // Enable network connections for retrieving token logos enableNetConnect() + store.dispatch( + addSerializedToken({ + serializedToken: { + chainId: 1, + address: '0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48', + symbol: 'USDC', + name: 'USD Coin', + decimals: 6, + }, + }) + ) + store.dispatch( + addSerializedToken({ + serializedToken: { + chainId: 1, + address: '0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2', + symbol: 'WETH', + name: 'Wrapped Ether', + decimals: 18, + }, + }) + ) }) it('renders stats text correctly', async () => { diff --git a/src/components/Pools/PoolDetails/PoolDetailsStatsButtons.test.tsx b/src/components/Pools/PoolDetails/PoolDetailsStatsButtons.test.tsx index 70e88857c5..034a69cb85 100644 --- a/src/components/Pools/PoolDetails/PoolDetailsStatsButtons.test.tsx +++ b/src/components/Pools/PoolDetails/PoolDetailsStatsButtons.test.tsx @@ -1,5 +1,7 @@ import userEvent from '@testing-library/user-event' import useMultiChainPositions from 'components/AccountDrawer/MiniPortfolio/Pools/useMultiChainPositions' +import store from 'state' +import { addSerializedToken } from 'state/user/reducer' import { mocked } from 'test-utils/mocked' import { useMultiChainPositionsReturnValue, validPoolToken0, validPoolToken1 } from 'test-utils/pools/fixtures' import { act, render, screen } from 'test-utils/render' @@ -24,6 +26,28 @@ describe('PoolDetailsStatsButton', () => { beforeEach(() => { mocked(useMultiChainPositions).mockReturnValue(useMultiChainPositionsReturnValue) + store.dispatch( + addSerializedToken({ + serializedToken: { + chainId: 1, + address: '0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48', + symbol: 'USDC', + name: 'USD Coin', + decimals: 6, + }, + }) + ) + store.dispatch( + addSerializedToken({ + serializedToken: { + chainId: 1, + address: '0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2', + symbol: 'WETH', + name: 'Wrapped Ether', + decimals: 18, + }, + }) + ) }) it('loading skeleton shown correctly', () => { diff --git a/src/components/Pools/PoolDetails/__snapshots__/PoolDetailsLink.test.tsx.snap b/src/components/Pools/PoolDetails/__snapshots__/PoolDetailsLink.test.tsx.snap index 259de24149..71bdd53d57 100644 --- a/src/components/Pools/PoolDetails/__snapshots__/PoolDetailsLink.test.tsx.snap +++ b/src/components/Pools/PoolDetails/__snapshots__/PoolDetailsLink.test.tsx.snap @@ -541,7 +541,7 @@ exports[`PoolDetailsHeader renders link for token address 1`] = ` class="c5" > UNKNOWN logo UNKNOWN logo UNKNOWN logo { beforeEach(() => { jest.spyOn(Router, 'useParams').mockReturnValue(validParams) mocked(usePoolData).mockReturnValue(validPoolDataResponse) + store.dispatch( + addSerializedToken({ + serializedToken: { + chainId: 1, + address: '0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48', + symbol: 'USDC', + name: 'USD Coin', + decimals: 6, + }, + }) + ) + store.dispatch( + addSerializedToken({ + serializedToken: { + chainId: 1, + address: '0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2', + symbol: 'WETH', + name: 'Wrapped Ether', + decimals: 18, + }, + }) + ) }) it('not found page displayed when given no poolAddress', () => {