diff --git a/app/component-library/components/Cards/Card/Card.test.tsx b/app/component-library/components/Cards/Card/Card.test.tsx index 5bf0913416b..43e593b6a8f 100644 --- a/app/component-library/components/Cards/Card/Card.test.tsx +++ b/app/component-library/components/Cards/Card/Card.test.tsx @@ -1,18 +1,18 @@ // Third party dependencies. import React from 'react'; import { View } from 'react-native'; -import { shallow } from 'enzyme'; +import { render } from '@testing-library/react-native'; // Internal dependencies. import Card from './Card'; describe('Card - Snapshot', () => { it('should render correctly', () => { - const wrapper = shallow( + const { toJSON } = render( , ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/component-library/components/Pickers/PickerBase/PickerBase.test.tsx b/app/component-library/components/Pickers/PickerBase/PickerBase.test.tsx index 57b23e00f02..662319adb46 100644 --- a/app/component-library/components/Pickers/PickerBase/PickerBase.test.tsx +++ b/app/component-library/components/Pickers/PickerBase/PickerBase.test.tsx @@ -1,18 +1,18 @@ // Third party dependencies. import React from 'react'; import { View } from 'react-native'; -import { shallow } from 'enzyme'; +import { render } from '@testing-library/react-native'; // Internal dependencies. import PickerBase from './PickerBase'; describe('PickerBase', () => { it('should render correctly', () => { - const wrapper = shallow( + const { toJSON } = render( , ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/component-library/components/Pickers/PickerBase/__snapshots__/PickerBase.test.tsx.snap b/app/component-library/components/Pickers/PickerBase/__snapshots__/PickerBase.test.tsx.snap index 5a76dc277cd..0100fc29d54 100644 --- a/app/component-library/components/Pickers/PickerBase/__snapshots__/PickerBase.test.tsx.snap +++ b/app/component-library/components/Pickers/PickerBase/__snapshots__/PickerBase.test.tsx.snap @@ -16,15 +16,18 @@ exports[`PickerBase should render correctly 1`] = ` } > - `; diff --git a/app/components/UI/BiometryButton/index.test.tsx b/app/components/UI/BiometryButton/index.test.tsx index 6fac2f8c9ac..d988def9fd6 100644 --- a/app/components/UI/BiometryButton/index.test.tsx +++ b/app/components/UI/BiometryButton/index.test.tsx @@ -1,11 +1,11 @@ import React from 'react'; -import { shallow } from 'enzyme'; +import { render } from '@testing-library/react-native'; import BiometryButton from './BiometryButton'; import AUTHENTICATION_TYPE from '../../../constants/userProperties'; describe('BiometryButton', () => { it('should render correctly', () => { - const wrapper = shallow( + const { toJSON } = render( {}} @@ -13,6 +13,6 @@ describe('BiometryButton', () => { biometryType={AUTHENTICATION_TYPE.BIOMETRIC} />, ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/UI/DrawerView/__snapshots__/index.test.tsx.snap b/app/components/UI/DrawerView/__snapshots__/index.test.tsx.snap index ef2b2b42613..7c927215953 100644 --- a/app/components/UI/DrawerView/__snapshots__/index.test.tsx.snap +++ b/app/components/UI/DrawerView/__snapshots__/index.test.tsx.snap @@ -1,37 +1,850 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`DrawerView should render correctly 1`] = ` - - - + + + + + + + + + + + + + + + + + + + + + + + + Account 1 + + +  + + + + $0 + + + 0x + + + + + + + + +  + + + Send + + + + + + +  + + + Add funds + + + + + + + + +  + + + Share my Public Address + + + + +  + + + View on Etherscan + + + + + + +  + + + Support + + + + +  + + + Request a Feature + + + + +  + + + Lock + + + + + + + + + + `; diff --git a/app/components/UI/DrawerView/index.test.tsx b/app/components/UI/DrawerView/index.test.tsx index 2968fcd9731..782bfb1c4bb 100644 --- a/app/components/UI/DrawerView/index.test.tsx +++ b/app/components/UI/DrawerView/index.test.tsx @@ -1,19 +1,46 @@ import React from 'react'; -import { shallow } from 'enzyme'; +import renderWithProvider from '../../../util/test/renderWithProvider'; import DrawerView from './'; -import { Provider } from 'react-redux'; -import configureMockStore from 'redux-mock-store'; -const mockStore = configureMockStore(); -const store = mockStore({}); +import initialBackgroundState from '../../../util/test/initial-background-state.json'; +import Engine from '../../../core/Engine'; + +const mockedEngine = Engine; + +const mockInitialState = { + engine: { + backgroundState: { + ...initialBackgroundState, + PreferencesController: { + selectedAddress: '0x', + identities: { + '0x': { name: 'Account 1', address: '0x' }, + }, + }, + }, + }, +}; + +jest.mock('../../../core/Engine', () => ({ + init: () => mockedEngine.init({}), + getTotalFiatAccountBalance: () => ({ ethFiat: 0, tokenFiat: 0 }), + context: { + NetworkController: { + state: { + providerConfig: { chainId: '0x1' }, + }, + }, + }, +})); describe('DrawerView', () => { it('should render correctly', () => { - const wrapper = shallow( - - - , + const { toJSON } = renderWithProvider( + null }} />, + { + state: mockInitialState, + }, ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/UI/EnableAutomaticSecurityChecksModal/EnableAutomaticSecurityChecksModal.test.tsx b/app/components/UI/EnableAutomaticSecurityChecksModal/EnableAutomaticSecurityChecksModal.test.tsx index 06def10330b..c2ecad621b3 100644 --- a/app/components/UI/EnableAutomaticSecurityChecksModal/EnableAutomaticSecurityChecksModal.test.tsx +++ b/app/components/UI/EnableAutomaticSecurityChecksModal/EnableAutomaticSecurityChecksModal.test.tsx @@ -1,19 +1,24 @@ -import React from 'react'; -import { shallow } from 'enzyme'; +import { renderScreen } from '../../../util/test/renderWithProvider'; import { EnableAutomaticSecurityChecksModal } from './'; -import { Provider } from 'react-redux'; -import configureMockStore from 'redux-mock-store'; -const mockStore = configureMockStore(); -const store = mockStore({}); +jest.mock('react-redux', () => ({ + ...jest.requireActual('react-redux'), + useDispatch: () => jest.fn(), +})); + +jest.mock('react-native-device-info', () => ({ + getBrand: () => 'some brand', + getBuildNumber: () => 'some build number', + getVersion: () => 'some version', +})); describe('EnableAutomaticSecurityChecksModal', () => { it('should render correctly', () => { - const wrapper = shallow( - - - , + const { toJSON } = renderScreen( + EnableAutomaticSecurityChecksModal, + { name: 'EnableAutomaticSecurityChecksModal' }, + { state: {} }, ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/UI/EnableAutomaticSecurityChecksModal/__snapshots__/EnableAutomaticSecurityChecksModal.test.tsx.snap b/app/components/UI/EnableAutomaticSecurityChecksModal/__snapshots__/EnableAutomaticSecurityChecksModal.test.tsx.snap index 3a7a8c72667..dfc9f94ea20 100644 --- a/app/components/UI/EnableAutomaticSecurityChecksModal/__snapshots__/EnableAutomaticSecurityChecksModal.test.tsx.snap +++ b/app/components/UI/EnableAutomaticSecurityChecksModal/__snapshots__/EnableAutomaticSecurityChecksModal.test.tsx.snap @@ -1,37 +1,545 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`EnableAutomaticSecurityChecksModal should render correctly 1`] = ` - - - + + + + + + + + + + + + EnableAutomaticSecurityChecksModal + + + + + + + + + + + + + + + + + + + + + + + + + + + Automatically check for security updates? + + + Automatically checking for updates may expose your IP address to GitHub servers. This only indicates that your IP address is using MetaMask. No other information or account addresses are exposed. + + + + + + + Enable automatic security checks + + + + + No thanks + + + + + + + + + + + + + + + `; diff --git a/app/components/UI/NavbarBrowserTitle/__snapshots__/index.test.tsx.snap b/app/components/UI/NavbarBrowserTitle/__snapshots__/index.test.tsx.snap index 68c1861789e..d70f34bb076 100644 --- a/app/components/UI/NavbarBrowserTitle/__snapshots__/index.test.tsx.snap +++ b/app/components/UI/NavbarBrowserTitle/__snapshots__/index.test.tsx.snap @@ -1,40 +1,108 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`NavbarBrowserTitle should render correctly 1`] = ` - - - + + + faucet.metamask.io + + +  + + + + + + Ethereum Main Network + + + `; diff --git a/app/components/UI/NavbarBrowserTitle/index.test.tsx b/app/components/UI/NavbarBrowserTitle/index.test.tsx index 912265156be..65a46192a79 100644 --- a/app/components/UI/NavbarBrowserTitle/index.test.tsx +++ b/app/components/UI/NavbarBrowserTitle/index.test.tsx @@ -1,19 +1,42 @@ import React from 'react'; -import { shallow } from 'enzyme'; -import { Provider } from 'react-redux'; -import configureMockStore from 'redux-mock-store'; +import renderWithProvider from '../../../util/test/renderWithProvider'; import NavbarBrowserTitle from './'; +import initialBackgroundState from '../../../util/test/initial-background-state.json'; +import Engine from '../../../core/Engine'; -const mockStore = configureMockStore(); -const store = mockStore({}); +const mockedEngine = Engine; + +const mockInitialState = { + engine: { + backgroundState: { + ...initialBackgroundState, + PreferencesController: { + selectedAddress: '0x', + identities: { + '0x': { name: 'Account 1', address: '0x' }, + }, + }, + }, + }, +}; + +jest.mock('../../../core/Engine', () => ({ + init: () => mockedEngine.init({}), + context: { + NetworkController: { + state: { + providerConfig: { chainId: '0x1' }, + }, + }, + }, +})); describe('NavbarBrowserTitle', () => { it('should render correctly', () => { - const wrapper = shallow( - - - , + const { toJSON } = renderWithProvider( + , + { state: mockInitialState }, ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/UI/OnboardingWizard/Coachmark/__snapshots__/index.test.tsx.snap b/app/components/UI/OnboardingWizard/Coachmark/__snapshots__/index.test.tsx.snap index e3f79c2b8c7..c1844d8a260 100644 --- a/app/components/UI/OnboardingWizard/Coachmark/__snapshots__/index.test.tsx.snap +++ b/app/components/UI/OnboardingWizard/Coachmark/__snapshots__/index.test.tsx.snap @@ -1,14 +1,12 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`Coachmark should render correctly 1`] = ` - - + > + + title - + + + content - - Got it - + + Got it + + - + `; diff --git a/app/components/UI/OnboardingWizard/Coachmark/index.js b/app/components/UI/OnboardingWizard/Coachmark/index.js index afb104d6571..ea5ca715586 100644 --- a/app/components/UI/OnboardingWizard/Coachmark/index.js +++ b/app/components/UI/OnboardingWizard/Coachmark/index.js @@ -184,7 +184,7 @@ export default class Coachmark extends PureComponent { /** * Content text */ - content: PropTypes.object, + content: PropTypes.string, /** * Title text */ diff --git a/app/components/UI/OnboardingWizard/Coachmark/index.test.tsx b/app/components/UI/OnboardingWizard/Coachmark/index.test.tsx index 888955c6a5b..a5c3b6de0c0 100644 --- a/app/components/UI/OnboardingWizard/Coachmark/index.test.tsx +++ b/app/components/UI/OnboardingWizard/Coachmark/index.test.tsx @@ -1,11 +1,11 @@ import React from 'react'; -import { shallow } from 'enzyme'; +import renderWithProvider from '../../../../util/test/renderWithProvider'; import Coachmark from './'; jest.useFakeTimers(); describe('Coachmark', () => { it('should render correctly', () => { - const wrapper = shallow( + const { toJSON } = renderWithProvider( { topIndicatorPosition={'topLeft'} />, ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/UI/SelectComponent/__snapshots__/index.test.tsx.snap b/app/components/UI/SelectComponent/__snapshots__/index.test.tsx.snap index 801796ee7f9..2a452ea0f77 100644 --- a/app/components/UI/SelectComponent/__snapshots__/index.test.tsx.snap +++ b/app/components/UI/SelectComponent/__snapshots__/index.test.tsx.snap @@ -41,60 +41,51 @@ exports[`SelectComponent should render correctly 1`] = ` } } /> - + > +  + - - - - - Choose an option - - - - - - - option 1 - - - - - option 2 - - - - - - + transparent={true} + visible={false} + /> `; diff --git a/app/components/UI/SelectComponent/index.test.tsx b/app/components/UI/SelectComponent/index.test.tsx index 3d4759f3cd8..90ee45734f9 100644 --- a/app/components/UI/SelectComponent/index.test.tsx +++ b/app/components/UI/SelectComponent/index.test.tsx @@ -1,10 +1,16 @@ import React from 'react'; -import { shallow } from 'enzyme'; +import renderWithProvider from '../../../util/test/renderWithProvider'; import SelectComponent from './'; +jest.mock('../../../core/Engine', () => ({ + context: { + colors: {}, + }, +})); + describe('SelectComponent', () => { it('should render correctly', () => { - const wrapper = shallow( + const { toJSON } = renderWithProvider( { label={'Choose an option'} />, ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/UI/SheetActionView/SheetActionView.test.tsx b/app/components/UI/SheetActionView/SheetActionView.test.tsx index ee965df0c6e..98617e754dc 100644 --- a/app/components/UI/SheetActionView/SheetActionView.test.tsx +++ b/app/components/UI/SheetActionView/SheetActionView.test.tsx @@ -8,6 +8,6 @@ describe('SheetActionView', () => { null} onConfirm={() => null} />, { state: {} }, ); - expect(toJSON).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/UI/SheetActionView/__snapshots__/SheetActionView.test.tsx.snap b/app/components/UI/SheetActionView/__snapshots__/SheetActionView.test.tsx.snap index 1e04980aa22..b24787ee4ee 100644 --- a/app/components/UI/SheetActionView/__snapshots__/SheetActionView.test.tsx.snap +++ b/app/components/UI/SheetActionView/__snapshots__/SheetActionView.test.tsx.snap @@ -1,3 +1,93 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`SheetActionView should render correctly 1`] = `[Function]`; +exports[`SheetActionView should render correctly 1`] = ` + + + + Cancel + + + + + Confirm + + + +`; diff --git a/app/components/UI/Tabs/TabThumbnail/__snapshots__/index.test.tsx.snap b/app/components/UI/Tabs/TabThumbnail/__snapshots__/index.test.tsx.snap index 3a161a32b9f..7b770006c77 100644 --- a/app/components/UI/Tabs/TabThumbnail/__snapshots__/index.test.tsx.snap +++ b/app/components/UI/Tabs/TabThumbnail/__snapshots__/index.test.tsx.snap @@ -1,13 +1,21 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`TabThumbnail should render correctly 1`] = ` - - + + > + + a + + + - + > +  + - + `; diff --git a/app/components/UI/Tabs/TabThumbnail/index.test.tsx b/app/components/UI/Tabs/TabThumbnail/index.test.tsx index 810e8c9e1f6..8b630a756f5 100644 --- a/app/components/UI/Tabs/TabThumbnail/index.test.tsx +++ b/app/components/UI/Tabs/TabThumbnail/index.test.tsx @@ -1,11 +1,11 @@ import React from 'react'; -import { shallow } from 'enzyme'; +import renderWithProvider from '../../../../util/test/renderWithProvider'; import TabThumbnail from './'; describe('TabThumbnail', () => { it('should render correctly', () => { const foo = () => null; - const wrapper = shallow( + const { toJSON } = renderWithProvider( // eslint-disable-next-line react/jsx-no-bind { onSwitch={foo} />, ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/UI/UpdateNeeded/UpdateNeeded.test.tsx b/app/components/UI/UpdateNeeded/UpdateNeeded.test.tsx index fc9f766ec02..3c7ae97b6b4 100644 --- a/app/components/UI/UpdateNeeded/UpdateNeeded.test.tsx +++ b/app/components/UI/UpdateNeeded/UpdateNeeded.test.tsx @@ -1,19 +1,19 @@ -import React from 'react'; -import { shallow } from 'enzyme'; +import { renderScreen } from '../../..//util/test/renderWithProvider'; import { UpdateNeeded } from './'; -import { Provider } from 'react-redux'; -import configureMockStore from 'redux-mock-store'; -const mockStore = configureMockStore(); -const store = mockStore({}); +jest.mock('react-native-device-info', () => ({ + getBrand: () => 'some brand', + getBuildNumber: () => 'some build number', + getVersion: () => 'some version', +})); describe('UpdateNeeded', () => { it('should render correctly', () => { - const wrapper = shallow( - - - , + const { toJSON } = renderScreen( + UpdateNeeded, + { name: 'UpdateNeeded' }, + { state: {} }, ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/UI/UpdateNeeded/__snapshots__/UpdateNeeded.test.tsx.snap b/app/components/UI/UpdateNeeded/__snapshots__/UpdateNeeded.test.tsx.snap index 0743ca5e70d..f1a6587ffb6 100644 --- a/app/components/UI/UpdateNeeded/__snapshots__/UpdateNeeded.test.tsx.snap +++ b/app/components/UI/UpdateNeeded/__snapshots__/UpdateNeeded.test.tsx.snap @@ -1,37 +1,543 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`UpdateNeeded should render correctly 1`] = ` - - - + + + + + + + + + + + + UpdateNeeded + + + + + + + + + + + + + + + + + + + + + + + + + + + Updates needed + + + We've increased security for your wallet! Please take a moment to protect yourself and update to the latest version. + + + + + + + Update to latest version + + + + + Remind me later + + + + + + + + + + + + + + + `; diff --git a/app/components/UI/UrlAutocomplete/__snapshots__/index.test.js.snap b/app/components/UI/UrlAutocomplete/__snapshots__/index.test.js.snap index 5327d377425..6d4bbee0aa1 100644 --- a/app/components/UI/UrlAutocomplete/__snapshots__/index.test.js.snap +++ b/app/components/UI/UrlAutocomplete/__snapshots__/index.test.js.snap @@ -1,37 +1,39 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`UrlAutocomplete should render correctly 1`] = ` - - - + + `; diff --git a/app/components/UI/UrlAutocomplete/index.test.js b/app/components/UI/UrlAutocomplete/index.test.js index 4690b4dd2f7..e2b7a49feee 100644 --- a/app/components/UI/UrlAutocomplete/index.test.js +++ b/app/components/UI/UrlAutocomplete/index.test.js @@ -1,19 +1,10 @@ import React from 'react'; -import { shallow } from 'enzyme'; +import renderWithProvider from '../../../util/test/renderWithProvider'; import UrlAutocomplete from './'; -import { Provider } from 'react-redux'; -import configureMockStore from 'redux-mock-store'; - -const mockStore = configureMockStore(); -const store = mockStore({}); describe('UrlAutocomplete', () => { it('should render correctly', () => { - const wrapper = shallow( - - - , - ); - expect(wrapper).toMatchSnapshot(); + const { toJSON } = renderWithProvider(, {}); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/Views/Asset/__snapshots__/index.test.js.snap b/app/components/Views/Asset/__snapshots__/index.test.js.snap index a9cb57c7f3e..4762381ddf3 100644 --- a/app/components/Views/Asset/__snapshots__/index.test.js.snap +++ b/app/components/Views/Asset/__snapshots__/index.test.js.snap @@ -1,39 +1,104 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`Asset should render correctly 1`] = ` - - - + + + + + + + + + Swap + + + + `; diff --git a/app/components/Views/Asset/index.test.js b/app/components/Views/Asset/index.test.js index 80c14cc8897..65d9989da45 100644 --- a/app/components/Views/Asset/index.test.js +++ b/app/components/Views/Asset/index.test.js @@ -1,19 +1,40 @@ import React from 'react'; -import { shallow } from 'enzyme'; -import { Provider } from 'react-redux'; -import configureMockStore from 'redux-mock-store'; +import renderWithProvider from '../../../util/test/renderWithProvider'; +import initialBackgroundState from '../../../util/test/initial-background-state.json'; import Asset from './'; +import Engine from '../../../core/Engine'; -const mockStore = configureMockStore(); -const store = mockStore({}); +const mockedEngine = Engine; + +const mockInitialState = { + engine: { + backgroundState: { + ...initialBackgroundState, + }, + }, +}; + +jest.mock('../../../core/Engine.ts', () => ({ + init: () => mockedEngine.init({}), + context: { + KeyringController: { + getQRKeyringState: async () => ({ subscribe: () => ({}) }), + }, + }, +})); describe('Asset', () => { it('should render correctly', () => { - const wrapper = shallow( - - - , + const { toJSON } = renderWithProvider( + null }} + route={{ params: { symbol: 'ETH', address: 'something', isETH: true } }} + transactions={[]} + />, + { + state: mockInitialState, + }, ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/Views/GasEducationCarousel/__snapshots__/index.test.tsx.snap b/app/components/Views/GasEducationCarousel/__snapshots__/index.test.tsx.snap index fac7603eef1..c2d6c0d562f 100644 --- a/app/components/Views/GasEducationCarousel/__snapshots__/index.test.tsx.snap +++ b/app/components/Views/GasEducationCarousel/__snapshots__/index.test.tsx.snap @@ -1,43 +1,476 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`GasEducationCarousel should render correctly 1`] = ` - - + + + + + + + + + + + + + + + + + + Before you purchase ETH, understand gas fees + + + If you plan to swap or transfer your ETH, purchase extra to cover gas fees. + + + Gas fees for transactions are separate from the cost of purchasing ETH. + + + MetaMask does not profit from gas fees. + + + + + + + + + + + + + + + + + + + + + + + + + + - + `; diff --git a/app/components/Views/GasEducationCarousel/index.test.tsx b/app/components/Views/GasEducationCarousel/index.test.tsx index b77d22c0bcd..635937b26c4 100644 --- a/app/components/Views/GasEducationCarousel/index.test.tsx +++ b/app/components/Views/GasEducationCarousel/index.test.tsx @@ -1,19 +1,14 @@ import React from 'react'; -import { shallow } from 'enzyme'; +import renderWithProvider from '../../../util/test/renderWithProvider'; import GasEducationCarousel from '.'; -import configureMockStore from 'redux-mock-store'; -import { Provider } from 'react-redux'; - -const mockStore = configureMockStore(); -const store = mockStore({}); describe('GasEducationCarousel', () => { it('should render correctly', () => { - const wrapper = shallow( - - false }} /> - , + const { toJSON } = renderWithProvider( + false, setOptions: () => null }} + />, ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/Views/Onboarding/__snapshots__/index.test.tsx.snap b/app/components/Views/Onboarding/__snapshots__/index.test.tsx.snap index 3a2d9566d2b..c018bba57c7 100644 --- a/app/components/Views/Onboarding/__snapshots__/index.test.tsx.snap +++ b/app/components/Views/Onboarding/__snapshots__/index.test.tsx.snap @@ -1,37 +1,660 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`Onboarding should render correctly 1`] = ` - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Wallet setup + + + + Import an existing wallet or create a new one + + + + + + + Import using Secret Recovery Phrase + + + + + + + Create a new wallet + + + + + + + + + + + + + + + + + + + + + + + + `; diff --git a/app/components/Views/Onboarding/index.test.tsx b/app/components/Views/Onboarding/index.test.tsx index 577ae10b03e..adfa340d1ea 100644 --- a/app/components/Views/Onboarding/index.test.tsx +++ b/app/components/Views/Onboarding/index.test.tsx @@ -1,19 +1,24 @@ -import React from 'react'; -import { shallow } from 'enzyme'; +import { renderScreen } from '../../../util/test/renderWithProvider'; import Onboarding from './'; -import { Provider } from 'react-redux'; -import configureMockStore from 'redux-mock-store'; +import initialBackgroundState from '../../../util/test/initial-background-state.json'; -const mockStore = configureMockStore(); -const store = mockStore({}); +const mockInitialState = { + engine: { + backgroundState: { + ...initialBackgroundState, + }, + }, +}; describe('Onboarding', () => { it('should render correctly', () => { - const wrapper = shallow( - - - , + const { toJSON } = renderScreen( + Onboarding, + { name: 'Onboarding' }, + { + state: mockInitialState, + }, ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/Views/Settings/AppInformation/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/AppInformation/__snapshots__/index.test.tsx.snap index 89368fdb347..2cd2d4c4ae2 100644 --- a/app/components/Views/Settings/AppInformation/__snapshots__/index.test.tsx.snap +++ b/app/components/Views/Settings/AppInformation/__snapshots__/index.test.tsx.snap @@ -1,43 +1,581 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`AppInformation should render correctly 1`] = ` - - - + > + + + + + + + + + + + + + + + + + About MetaMask + + + + + + + + + + + + + + + + + + + + + + + + + + Links + + + + + Privacy Policy + + + + + Terms of use + + + + + Attributions + + + + + + + + Visit our Support Center + + + + + Visit our Website + + + + + Contact Us + + + + + + + + + + + + + + + + `; diff --git a/app/components/Views/Settings/AppInformation/index.test.tsx b/app/components/Views/Settings/AppInformation/index.test.tsx index 85292940fde..800d0de14fd 100644 --- a/app/components/Views/Settings/AppInformation/index.test.tsx +++ b/app/components/Views/Settings/AppInformation/index.test.tsx @@ -1,19 +1,13 @@ -import React from 'react'; -import { shallow } from 'enzyme'; +import { renderScreen } from '../../../../util/test/renderWithProvider'; import AppInformation from './'; -import { Provider } from 'react-redux'; -import configureMockStore from 'redux-mock-store'; - -const mockStore = configureMockStore(); -const store = mockStore({}); describe('AppInformation', () => { it('should render correctly', () => { - const wrapper = shallow( - - - , + const { toJSON } = renderScreen( + AppInformation, + { name: 'AppInformation' }, + { state: {} }, ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/Views/TermsAndConditions/__snapshots__/index.test.tsx.snap b/app/components/Views/TermsAndConditions/__snapshots__/index.test.tsx.snap index fd074fa74a4..bbc4ccf31fa 100644 --- a/app/components/Views/TermsAndConditions/__snapshots__/index.test.tsx.snap +++ b/app/components/Views/TermsAndConditions/__snapshots__/index.test.tsx.snap @@ -1,39 +1,32 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`TermsAndConditions should render correctly 1`] = ` - - - + + By proceeding, you agree to these + + Terms and Conditions + + . + + `; diff --git a/app/components/Views/TermsAndConditions/index.test.tsx b/app/components/Views/TermsAndConditions/index.test.tsx index 70c56f9998c..fabf5e89bd2 100644 --- a/app/components/Views/TermsAndConditions/index.test.tsx +++ b/app/components/Views/TermsAndConditions/index.test.tsx @@ -1,19 +1,12 @@ import React from 'react'; -import { shallow } from 'enzyme'; +import renderWithProvider from '../../../util/test/renderWithProvider'; import TermsAndConditions from './'; -import { Provider } from 'react-redux'; -import configureMockStore from 'redux-mock-store'; - -const mockStore = configureMockStore(); -const store = mockStore({}); describe('TermsAndConditions', () => { it('should render correctly', () => { - const wrapper = shallow( - - - , + const { toJSON } = renderWithProvider( + , ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/Views/confirmations/Send/__snapshots__/index.test.tsx.snap b/app/components/Views/confirmations/Send/__snapshots__/index.test.tsx.snap index 081e8191c74..bd99c1bb059 100644 --- a/app/components/Views/confirmations/Send/__snapshots__/index.test.tsx.snap +++ b/app/components/Views/confirmations/Send/__snapshots__/index.test.tsx.snap @@ -1,37 +1,466 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`Accounts should render correctly 1`] = ` - - - + + + + + + + + + + + + + Edit + + + + + + + Confirm + + + + + Ethereum Main Network + + + + + + + + Cancel + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + `; diff --git a/app/components/Views/confirmations/Send/index.test.tsx b/app/components/Views/confirmations/Send/index.test.tsx index 8c31e841287..82c6bd146f8 100644 --- a/app/components/Views/confirmations/Send/index.test.tsx +++ b/app/components/Views/confirmations/Send/index.test.tsx @@ -1,19 +1,213 @@ -import React from 'react'; -import { shallow } from 'enzyme'; +import { renderScreen } from '../../../../util/test/renderWithProvider'; import Send from '.'; -import { Provider } from 'react-redux'; -import configureMockStore from 'redux-mock-store'; -const mockStore = configureMockStore(); -const store = mockStore({}); +const initialState = { + transaction: { + transaction: { + value: '', + data: '0x0', + from: '0x1', + gas: '', + gasPrice: '', + to: '0x2', + }, + selectedAsset: { symbol: 'ETH' }, + assetType: undefined, + }, + settings: {}, + engine: { + backgroundState: { + // ...initialBackgroundState, + AccountTrackerController: { + accounts: { + '0x76cf1CdD1fcC252442b50D6e97207228aA4aefC3': { + balance: '0x0', + }, + }, + accountsByChainId: { + 64: { + '0x76cf1CdD1fcC252442b50D6e97207228aA4aefC3': { + balance: '0x0', + }, + }, + 1: { + '0x76cf1CdD1fcC252442b50D6e97207228aA4aefC3': { + balance: '0x0', + }, + }, + }, + _U: 0, + _V: 1, + _X: null, + }, + AddressBookController: { + addressBook: {}, + }, + TokenBalancesController: { + contractBalances: {}, + }, + PreferencesController: { + featureFlags: {}, + identities: { + '0x76cf1CdD1fcC252442b50D6e97207228aA4aefC3': { + address: '0x76cf1CdD1fcC252442b50D6e97207228aA4aefC3', + name: 'Account 1', + importTime: 1684232000456, + }, + }, + ipfsGateway: 'https://cloudflare-ipfs.com/ipfs/', + lostIdentities: {}, + selectedAddress: '0x76cf1CdD1fcC252442b50D6e97207228aA4aefC3', + useTokenDetection: true, + useNftDetection: false, + displayNftMedia: true, + useSafeChainsListValidation: false, + isMultiAccountBalancesEnabled: true, + disabledRpcMethodPreferences: { + eth_sign: false, + }, + showTestNetworks: true, + _U: 0, + _V: 1, + _W: { + featureFlags: {}, + frequentRpcList: [], + identities: { + '0x76cf1CdD1fcC252442b50D6e97207228aA4aefC3': { + address: '0x76cf1CdD1fcC252442b50D6e97207228aA4aefC3', + name: 'Account 1', + importTime: 1684232000456, + }, + }, + ipfsGateway: 'https://cloudflare-ipfs.com/ipfs/', + lostIdentities: {}, + selectedAddress: '0x76cf1CdD1fcC252442b50D6e97207228aA4aefC3', + useTokenDetection: true, + useNftDetection: false, + displayNftMedia: true, + useSafeChainsListValidation: false, + isMultiAccountBalancesEnabled: true, + disabledRpcMethodPreferences: { + eth_sign: false, + }, + showTestNetworks: true, + showIncomingTransactions: { + '0x1': true, + '0x5': true, + '0x38': true, + '0x61': true, + '0xa': true, + '0xa869': true, + '0x1a4': true, + '0x89': true, + '0x13881': true, + '0xa86a': true, + '0xfa': true, + '0xfa2': true, + '0xaa36a7': true, + '0xe704': true, + '0xe708': true, + '0x504': true, + '0x507': true, + '0x505': true, + '0x64': true, + }, + }, + _X: null, + }, + NetworkController: { + network: '1', + providerConfig: { + ticker: 'ETH', + type: 'mainnet', + chainId: '0x1', + }, + }, + TokenRatesController: { + contractExchangeRates: {}, + }, + TransactionController: { + methodData: {}, + transactions: [], + internalTransactions: [], + swapsTransactions: {}, + }, + GasFeeController: { + gasFeeEstimates: {}, + estimatedGasFeeTimeBounds: {}, + gasEstimateType: 'none', + }, + }, + }, +}; + +jest.mock('../../../../core/Engine', () => ({ + rejectPendingApproval: jest.fn(), + context: { + PreferencesController: { + state: { + securityAlertsEnabled: false, + }, + }, + TokensController: { + addToken: jest.fn(), + }, + KeyringController: { + state: { + keyrings: [ + { + accounts: [ + '0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A', + '0x519d2CE57898513F676a5C3b66496c3C394c9CC7', + '0x07Be9763a718C0539017E2Ab6fC42853b4aEeb6B', + ], + }, + ], + }, + }, + TransactionController: { + estimateGas: jest.fn().mockImplementation(({ gas }) => { + if (gas === undefined) return Promise.resolve({ gas: '0x5208' }); + return Promise.resolve({ gas }); + }), + addTransaction: jest.fn().mockResolvedValue({ + result: {}, + transactionMeta: { + id: 1, + }, + }), + }, + GasFeeController: { + stopPolling: jest.fn(), + getGasFeeEstimatesAndStartPolling: jest + .fn() + .mockResolvedValue('poll-token'), + }, + NetworkController: { + getProviderAndBlockTracker: jest.fn().mockImplementation(() => ({ + provider: { + sendAsync: () => null, + }, + })), + state: { + network: '1', + providerConfig: { + ticker: 'ETH', + type: 'mainnet', + chainId: '0x1', + }, + }, + }, + }, +})); describe('Accounts', () => { it('should render correctly', () => { - const wrapper = shallow( - - - , + const { toJSON } = renderScreen( + Send, + { name: 'Send' }, + { state: initialState }, ); - expect(wrapper).toMatchSnapshot(); + expect(toJSON()).toMatchSnapshot(); }); }); diff --git a/app/components/Views/confirmations/components/TransactionReview/index.js b/app/components/Views/confirmations/components/TransactionReview/index.js index a0a7e98d608..406b3609a08 100644 --- a/app/components/Views/confirmations/components/TransactionReview/index.js +++ b/app/components/Views/confirmations/components/TransactionReview/index.js @@ -398,7 +398,7 @@ class TransactionReview extends PureComponent { }; getStyles = () => { - const colors = this.context?.colors || mockTheme.colors; + const colors = this.context.colors || mockTheme.colors; return createStyles(colors); };