From 403d594bdd272f3b810873d602d9c3dd2badf656 Mon Sep 17 00:00:00 2001 From: Micaela Estabillo Date: Thu, 10 Oct 2024 15:04:51 -0700 Subject: [PATCH] test: prepare-bridge-page --- .../prepare-bridge-page.test.tsx.snap | 258 +++++++++++++++++- .../prepare/prepare-bridge-page.test.tsx | 62 ++++- 2 files changed, 314 insertions(+), 6 deletions(-) diff --git a/ui/pages/bridge/prepare/__snapshots__/prepare-bridge-page.test.tsx.snap b/ui/pages/bridge/prepare/__snapshots__/prepare-bridge-page.test.tsx.snap index 03af05d50d09..b406cafe0941 100644 --- a/ui/pages/bridge/prepare/__snapshots__/prepare-bridge-page.test.tsx.snap +++ b/ui/pages/bridge/prepare/__snapshots__/prepare-bridge-page.test.tsx.snap @@ -1,6 +1,6 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`PrepareBridgePage should render the component 1`] = ` +exports[`PrepareBridgePage should render the component, with initial state 1`] = `
`; + +exports[`PrepareBridgePage should render the component, with inputs set 1`] = ` +
+
+
+
+
+ +
+
+
+ +
+
+
+
+
+

+ +

+
+ + $0.00 + +
+
+
+
+ +
+
+
+ +
+
+
+ +
+
+
+
+
+

+ +

+
+ + $0.00 + +
+
+
+
+
+
+`; diff --git a/ui/pages/bridge/prepare/prepare-bridge-page.test.tsx b/ui/pages/bridge/prepare/prepare-bridge-page.test.tsx index 8b6099eff709..75b99441cee8 100644 --- a/ui/pages/bridge/prepare/prepare-bridge-page.test.tsx +++ b/ui/pages/bridge/prepare/prepare-bridge-page.test.tsx @@ -1,5 +1,6 @@ import React from 'react'; -import { renderWithProvider } from '../../../../test/jest'; +import { act } from '@testing-library/react'; +import { fireEvent, renderWithProvider } from '../../../../test/jest'; import configureStore from '../../../store/store'; import { createBridgeMockStore } from '../../../../test/jest/mock-store'; import { CHAIN_IDS } from '../../../../shared/constants/network'; @@ -17,16 +18,15 @@ describe('PrepareBridgePage', () => { global.ethereumProvider = provider as any; }); - it('should render the component', () => { + it('should render the component, with initial state', async () => { const mockStore = createBridgeMockStore( { srcNetworkAllowlist: [CHAIN_IDS.MAINNET, CHAIN_IDS.OPTIMISM], destNetworkAllowlist: [CHAIN_IDS.OPTIMISM], }, {}, - { fromTokenInputValue: 1 }, ); - const { container, getByRole } = renderWithProvider( + const { container, getByRole, getByTestId } = renderWithProvider( , configureStore(mockStore), ); @@ -35,5 +35,59 @@ describe('PrepareBridgePage', () => { expect(getByRole('button', { name: /ETH/u })).toBeInTheDocument(); expect(getByRole('button', { name: /Select token/u })).toBeInTheDocument(); + + expect(getByTestId('from-amount')).toBeInTheDocument(); + expect(getByTestId('from-amount').closest('input')).not.toBeDisabled(); + await act(() => { + fireEvent.change(getByTestId('from-amount'), { target: { value: '2' } }); + }); + expect(getByTestId('from-amount').closest('input')).toHaveValue(2); + + expect(getByTestId('to-amount')).toBeInTheDocument(); + expect(getByTestId('to-amount').closest('input')).toBeDisabled(); + + expect(getByTestId('switch-tokens').closest('button')).toBeDisabled(); + }); + + it('should render the component, with inputs set', async () => { + const mockStore = createBridgeMockStore( + { + srcNetworkAllowlist: [CHAIN_IDS.MAINNET, CHAIN_IDS.LINEA_MAINNET], + destNetworkAllowlist: [CHAIN_IDS.LINEA_MAINNET], + }, + { + fromTokenInputValue: 1, + fromToken: { address: '0x3103910' }, + toToken: { + iconUrl: 'http://url', + symbol: 'UNI', + address: '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984', + }, + toChainId: CHAIN_IDS.LINEA_MAINNET, + }, + {}, + ); + const { container, getByRole, getByTestId } = renderWithProvider( + , + configureStore(mockStore), + ); + + expect(container).toMatchSnapshot(); + + expect(getByRole('button', { name: /ETH/u })).toBeInTheDocument(); + expect(getByRole('button', { name: /UNI/u })).toBeInTheDocument(); + + expect(getByTestId('from-amount')).toBeInTheDocument(); + expect(getByTestId('from-amount').closest('input')).not.toBeDisabled(); + expect(getByTestId('from-amount').closest('input')).toHaveValue(1); + await act(() => { + fireEvent.change(getByTestId('from-amount'), { target: { value: '2' } }); + }); + expect(getByTestId('from-amount').closest('input')).toHaveValue(2); + + expect(getByTestId('to-amount')).toBeInTheDocument(); + expect(getByTestId('to-amount').closest('input')).toBeDisabled(); + + expect(getByTestId('switch-tokens').closest('button')).not.toBeDisabled(); }); });