{
+ return {
+ timeStarted: 1,
+ timeOnly: true,
+ timerBase: 5,
+ warningTime: '0:30',
+ labelKey: 'swapNewQuoteIn',
+ infoTooltipLabelKey: 'swapQuotesAreRefreshed',
+ ...customProps,
+ };
+};
+
+describe('CountdownTimer', () => {
+ it('renders the component with initial props', () => {
+ const store = configureMockStore()(createSwapsMockStore());
+ const { getByTestId } = renderWithProvider(
+
+
+`;
diff --git a/ui/app/pages/swaps/dropdown-input-pair/dropdown-input-pair.test.js b/ui/app/pages/swaps/dropdown-input-pair/dropdown-input-pair.test.js
new file mode 100644
index 000000000..69420a56c
--- /dev/null
+++ b/ui/app/pages/swaps/dropdown-input-pair/dropdown-input-pair.test.js
@@ -0,0 +1,23 @@
+import React from 'react';
+
+import { renderWithProvider } from '../../../../../test/jest';
+import DropdownInputPair from '.';
+
+const createProps = (customProps = {}) => {
+ return {
+ ...customProps,
+ };
+};
+
+describe('DropdownInputPair', () => {
+ it('renders the component with initial props', () => {
+ const props = createProps();
+ const { getByPlaceholderText } = renderWithProvider(
+
+
+
+
+
+`;
diff --git a/ui/app/pages/swaps/dropdown-search-list/dropdown-search-list.test.js b/ui/app/pages/swaps/dropdown-search-list/dropdown-search-list.test.js
new file mode 100644
index 000000000..70f0e6a68
--- /dev/null
+++ b/ui/app/pages/swaps/dropdown-search-list/dropdown-search-list.test.js
@@ -0,0 +1,25 @@
+import React from 'react';
+
+import { renderWithProvider } from '../../../../../test/jest';
+import DropdownSearchList from '.';
+
+const createProps = (customProps = {}) => {
+ return {
+ startingItem: {
+ iconUrl: 'iconUrl',
+ symbol: 'symbol',
+ },
+ ...customProps,
+ };
+};
+
+describe('DropdownSearchList', () => {
+ it('renders the component with initial props', () => {
+ const props = createProps();
+ const { container, getByText } = renderWithProvider(
+
+
+
+
+
+ 
+
+
+
+
+
+
+ symbol
+
+
+
+
+`;
diff --git a/ui/app/pages/swaps/exchange-rate-display/exchange-rate-display.test.js b/ui/app/pages/swaps/exchange-rate-display/exchange-rate-display.test.js
new file mode 100644
index 000000000..b0aa8db60
--- /dev/null
+++ b/ui/app/pages/swaps/exchange-rate-display/exchange-rate-display.test.js
@@ -0,0 +1,28 @@
+import React from 'react';
+
+import { renderWithProvider } from '../../../../../test/jest';
+import ExchangeRateDisplay from '.';
+
+const createProps = (customProps = {}) => {
+ return {
+ primaryTokenValue: '2000000000000000000',
+ primaryTokenDecimals: 18,
+ primaryTokenSymbol: 'ETH',
+ secondaryTokenValue: '200000000000000000',
+ secondaryTokenDecimals: 18,
+ secondaryTokenSymbol: 'BAT',
+ ...customProps,
+ };
+};
+
+describe('ExchangeRateDisplay', () => {
+ it('renders the component with initial props', () => {
+ const props = createProps();
+ const { container, getByText } = renderWithProvider(
+
+
+ 1
+
+
+ ETH
+
+
+ =
+
+
+ 0.1
+
+
+ BAT
+
+
+
+
+
+
+
-
-
+`;
+
+exports[`FeeCard renders the component with initial props 2`] = `
+
+
+
+
+ -
- [swapUsingBestQuote] -
-
-
+ 6 quotes
+
+ - [swapNQuotes] -
-
-
-
-
+
+
-
diff --git a/ui/app/pages/swaps/fee-card/fee-card.test.js b/ui/app/pages/swaps/fee-card/fee-card.test.js
index 391cf5b7d..15c8b0c33 100644
--- a/ui/app/pages/swaps/fee-card/fee-card.test.js
+++ b/ui/app/pages/swaps/fee-card/fee-card.test.js
@@ -1,31 +1,61 @@
import React from 'react';
-import { render } from '@testing-library/react';
+import { renderWithProvider } from '../../../../../test/jest';
import { MAINNET_CHAIN_ID } from '../../../../../shared/constants/network';
-import FeeCard from './fee-card';
+import FeeCard from '.';
+
+const createProps = (customProps = {}) => {
+ return {
+ primaryFee: {
+ fee: '0.0441 ETH',
+ maxFee: '0.04851 ETH',
+ },
+ secondaryFee: {
+ fee: '$101.98',
+ maxFee: '$112.17',
+ },
+ hideTokenApprovalRow: false,
+ onFeeCardMaxRowClick: jest.fn(),
+ tokenApprovalTextComponent: (
+
+ ABC
+
+ ),
+ tokenApprovalSourceTokenSymbol: 'ABC',
+ onTokenApprovalClick: jest.fn(),
+ metaMaskFee: '0.875',
+ isBestQuote: true,
+ numberOfQuotes: 6,
+ onQuotesClick: jest.fn(),
+ tokenConversionRate: 0.015,
+ chainId: MAINNET_CHAIN_ID,
+ ...customProps,
+ };
+};
describe('FeeCard', () => {
- const createProps = (customProps = {}) => {
- return {
- primaryFee: '1 ETH',
- secondaryFee: '2500 USD',
- hideTokenApprovalRow: false,
- onFeeCardMaxRowClick: jest.fn(),
- tokenApprovalTextComponent: <>,
- tokenApprovalSourceTokenSymbol: 'ABC',
- onTokenApprovalClick: jest.fn(),
- metaMaskFee: '0.875',
- isBestQuote: true,
- numberOfQuotes: 6,
- onQuotesClick: jest.fn(),
- tokenConversionRate: 0.015,
- chainId: MAINNET_CHAIN_ID,
- ...customProps,
- };
- };
-
it('renders the component with initial props', () => {
- const { container } = render(
+ Quote includes a 0.875% MetaMask fee
+
+
-
-
-
-
- [swapEstimatedNetworkFee]
-
-
-
-
-
-
- 
-
-
-
-
-
-
-
-
-
-
-
- [swapMaxNetworkFees]
-
-
- [edit]
-
-
-
-
-
-
-
- [swapThisWillAllowApprove]
-
-
-
-
-
-
-
-
-
-
- [swapEditLimit]
-
-
-
-
- [swapQuoteIncludesRate]
-
-
-
+
-
-
-
-
-
-
+
+
+`;
diff --git a/ui/app/pages/swaps/intro-popup/intro-popup.test.js b/ui/app/pages/swaps/intro-popup/intro-popup.test.js
new file mode 100644
index 000000000..2ceec7e0e
--- /dev/null
+++ b/ui/app/pages/swaps/intro-popup/intro-popup.test.js
@@ -0,0 +1,24 @@
+import React from 'react';
+import configureMockStore from 'redux-mock-store';
+
+import {
+ renderWithProvider,
+ createSwapsMockStore,
+} from '../../../../../test/jest';
+import IntroPopup from '.';
+
+const createProps = (customProps = {}) => {
+ return {
+ onClose: jest.fn(),
+ ...customProps,
+ };
+};
+
+describe('IntroPopup', () => {
+ it('renders the component with initial props', () => {
+ const store = configureMockStore()(createSwapsMockStore());
+ const props = createProps();
+ const { container } = renderWithProvider(
+
+ 2
+
+
+ E
+
+
+ ETH
+
+
+`;
+
+exports[`MainQuoteSummary renders the component with initial props 2`] = `
+
+
+ B
+
+
+ BAT
+
+
+`;
+
+exports[`MainQuoteSummary renders the component with initial props 3`] = `
+
+
+`;
+
+exports[`MainQuoteSummary renders the component with initial props 4`] = `
+
+
+
+
+ 0.2
+
+
+
+
+`;
diff --git a/ui/app/pages/swaps/main-quote-summary/main-quote-summary.test.js b/ui/app/pages/swaps/main-quote-summary/main-quote-summary.test.js
new file mode 100644
index 000000000..cc1775363
--- /dev/null
+++ b/ui/app/pages/swaps/main-quote-summary/main-quote-summary.test.js
@@ -0,0 +1,39 @@
+import React from 'react';
+
+import { renderWithProvider } from '../../../../../test/jest';
+import MainQuoteSummary from '.';
+
+const createProps = (customProps = {}) => {
+ return {
+ sourceValue: '2000000000000000000',
+ sourceDecimals: 18,
+ sourceSymbol: 'ETH',
+ destinationValue: '200000000000000000',
+ destinationDecimals: 18,
+ destinationSymbol: 'BAT',
+ ...customProps,
+ };
+};
+
+describe('MainQuoteSummary', () => {
+ it('renders the component with initial props', () => {
+ const props = createProps();
+ const { getAllByText } = renderWithProvider(
+
+
+ 1
+
+
+ ETH
+
+
+ =
+
+
+ 0.1
+
+
+ BAT
+
+
+
+
+
+
+
+`;
+
+exports[`SearchableItemList renders the component with initial props 2`] = `
+
+
+
+ 
+
+
+
+
+
+
+`;
diff --git a/ui/app/pages/swaps/searchable-item-list/searchable-item-list.test.js b/ui/app/pages/swaps/searchable-item-list/searchable-item-list.test.js
new file mode 100644
index 000000000..ef9a3a016
--- /dev/null
+++ b/ui/app/pages/swaps/searchable-item-list/searchable-item-list.test.js
@@ -0,0 +1,60 @@
+import React from 'react';
+
+import { renderWithProvider } from '../../../../../test/jest';
+import SearchableItemList from '.';
+
+const createProps = (customProps = {}) => {
+ return {
+ defaultToAll: true,
+ listTitle: 'listTitle',
+ itemsToSearch: [
+ {
+ iconUrl: 'iconUrl',
+ selected: true,
+ primaryLabel: 'primaryLabel',
+ secondaryLabel: 'secondaryLabel',
+ rightPrimaryLabel: 'rightPrimaryLabel',
+ rightSecondaryLabel: 'rightSecondaryLabel',
+ },
+ ],
+ fuseSearchKeys: [
+ {
+ name: 'name',
+ weight: 0.499,
+ },
+ {
+ name: 'symbol',
+ weight: 0.499,
+ },
+ {
+ name: 'address',
+ weight: 0.002,
+ },
+ ],
+ ...customProps,
+ };
+};
+
+describe('SearchableItemList', () => {
+ it('renders the component with initial props', () => {
+ const props = createProps();
+ const { getByText } = renderWithProvider(
+
+
+
+ primaryLabel
+
+
+ secondaryLabel
+
+
+
+
+ rightPrimaryLabel
+
+
+ rightSecondaryLabel
+
+
+
+
+
+`;
diff --git a/ui/app/pages/swaps/select-quote-popover/select-quote-popover.test.js b/ui/app/pages/swaps/select-quote-popover/select-quote-popover.test.js
new file mode 100644
index 000000000..b23a35f68
--- /dev/null
+++ b/ui/app/pages/swaps/select-quote-popover/select-quote-popover.test.js
@@ -0,0 +1,24 @@
+import React from 'react';
+
+import { renderWithProvider } from '../../../../../test/jest';
+import SelectQuotePopover from '.';
+
+const createProps = (customProps = {}) => {
+ return {
+ onClose: jest.fn(),
+ onSubmit: jest.fn(),
+ swapToSymbol: 'ETH',
+ initialAggId: 'initialAggId',
+ onQuoteDetailsIsOpened: jest.fn(),
+ ...customProps,
+ };
+};
+
+describe('SelectQuotePopover', () => {
+ it('renders the component with initial props', () => {
+ const { container } = renderWithProvider(
+
+
+
+`;
diff --git a/ui/app/pages/swaps/swaps-footer/swaps-footer.test.js b/ui/app/pages/swaps/swaps-footer/swaps-footer.test.js
new file mode 100644
index 000000000..4cff41083
--- /dev/null
+++ b/ui/app/pages/swaps/swaps-footer/swaps-footer.test.js
@@ -0,0 +1,28 @@
+import React from 'react';
+
+import { renderWithProvider } from '../../../../../test/jest';
+import SwapsFooter from '.';
+
+const createProps = (customProps = {}) => {
+ return {
+ onCancel: jest.fn(),
+ onSubmit: jest.fn(),
+ submitText: 'submitText',
+ disabled: false,
+ showTermsOfService: true,
+ ...customProps,
+ };
+};
+
+describe('SwapsFooter', () => {
+ it('renders the component with initial props', () => {
+ const props = createProps();
+ const { container, getByText } = renderWithProvider(
+