From 20fe6fcad472e867a7f1216d29f751b7ece0f72b Mon Sep 17 00:00:00 2001 From: Suryansh Anand Date: Fri, 2 Jun 2023 03:10:39 +0530 Subject: [PATCH] Fix/storybook console cleanup (#19244) * Fix: Fix storybook console error of networkList not being found when passed to createStore * Fix: Remove unused testData imports --- .storybook/test-data.js | 168 ++++++++---------- .../custom-content-search.stories.js | 4 +- .../custom-content-search.test.js | 14 +- .../networks-list/network-list.stories.js | 4 +- 4 files changed, 87 insertions(+), 103 deletions(-) diff --git a/.storybook/test-data.js b/.storybook/test-data.js index 9150466ac37f..360e6e90daad 100644 --- a/.storybook/test-data.js +++ b/.storybook/test-data.js @@ -16,81 +16,6 @@ const state = { protocol: 'https:', url: 'https://metamask.github.io/test-dapp/', }, - networkList: [ - { - blockExplorerUrl: 'https://etherscan.io', - chainId: '0x1', - iconColor: 'var(--mainnet)', - isATestNetwork: false, - labelKey: 'mainnet', - providerType: 'mainnet', - rpcUrl: 'https://mainnet.infura.io/v3/', - ticker: 'ETH', - viewOnly: true, - }, - { - blockExplorerUrl: 'https://goerli.etherscan.io', - chainId: '0x5', - iconColor: 'var(--color-network-goerli-default)', - isATestNetwork: true, - labelKey: 'goerli', - providerType: 'goerli', - rpcUrl: 'https://goerli.infura.io/v3/', - ticker: 'ETH', - viewOnly: true, - }, - { - blockExplorerUrl: 'https://sepolia.etherscan.io', - chainId: '0xaa36a7', - iconColor: 'var(--color-network-sepolia-default)', - isATestNetwork: true, - labelKey: 'sepolia', - providerType: 'sepolia', - rpcUrl: 'https://sepolia.infura.io/v3/', - ticker: 'ETH', - viewOnly: true, - }, - { - blockExplorerUrl: '', - chainId: '0x539', - iconColor: 'var(--color-network-localhost-default)', - isATestNetwork: true, - label: 'Localhost 8545', - providerType: 'rpc', - rpcUrl: 'http://localhost:8545', - ticker: 'ETH', - }, - { - blockExplorerUrl: 'https://bscscan.com', - chainId: '0x38', - iconColor: 'var(--color-network-localhost-default)', - isATestNetwork: false, - label: 'Binance Smart Chain', - providerType: 'rpc', - rpcUrl: 'https://bsc-dataseed.binance.org/', - ticker: 'BNB', - }, - { - blockExplorerUrl: 'https://cchain.explorer.avax.network/', - chainId: '0xa86a', - iconColor: 'var(--color-network-localhost-default)', - isATestNetwork: false, - label: 'Avalanche', - providerType: 'rpc', - rpcUrl: 'https://api.avax.network/ext/bc/C/rpc', - ticker: 'AVAX', - }, - { - blockExplorerUrl: 'https://polygonscan.com', - chainId: '0x89', - iconColor: 'var(--color-network-localhost-default)', - isATestNetwork: false, - label: 'Polygon', - providerType: 'rpc', - rpcUrl: 'https://polygon-rpc.com', - ticker: 'MATIC', - }, - ], metamask: { tokenList: { '0x514910771af9ca656af840dff83e8264ecf986ca': { @@ -1425,23 +1350,6 @@ const state = { }, }, }, - swapsState: { - quotes: {}, - fetchParams: null, - tokens: null, - tradeTxId: null, - approveTxId: null, - quotesLastFetched: null, - customMaxGas: '', - customGasPrice: null, - selectedAggId: null, - customApproveTxData: '', - errorKey: '', - topAggId: null, - routeState: '', - swapsFeatureIsLive: false, - swapsQuoteRefreshTime: 60000, - }, ensResolutionsByAddress: {}, pendingApprovals: {}, pendingApprovalCount: 0, @@ -1692,4 +1600,80 @@ const state = { }, }; +export const networkList = [ + { + blockExplorerUrl: 'https://etherscan.io', + chainId: '0x1', + iconColor: 'var(--mainnet)', + isATestNetwork: false, + labelKey: 'mainnet', + providerType: 'mainnet', + rpcUrl: 'https://mainnet.infura.io/v3/', + ticker: 'ETH', + viewOnly: true, + }, + { + blockExplorerUrl: 'https://goerli.etherscan.io', + chainId: '0x5', + iconColor: 'var(--color-network-goerli-default)', + isATestNetwork: true, + labelKey: 'goerli', + providerType: 'goerli', + rpcUrl: 'https://goerli.infura.io/v3/', + ticker: 'ETH', + viewOnly: true, + }, + { + blockExplorerUrl: 'https://sepolia.etherscan.io', + chainId: '0xaa36a7', + iconColor: 'var(--color-network-sepolia-default)', + isATestNetwork: true, + labelKey: 'sepolia', + providerType: 'sepolia', + rpcUrl: 'https://sepolia.infura.io/v3/', + ticker: 'ETH', + viewOnly: true, + }, + { + blockExplorerUrl: '', + chainId: '0x539', + iconColor: 'var(--color-network-localhost-default)', + isATestNetwork: true, + label: 'Localhost 8545', + providerType: 'rpc', + rpcUrl: 'http://localhost:8545', + ticker: 'ETH', + }, + { + blockExplorerUrl: 'https://bscscan.com', + chainId: '0x38', + iconColor: 'var(--color-network-localhost-default)', + isATestNetwork: false, + label: 'Binance Smart Chain', + providerType: 'rpc', + rpcUrl: 'https://bsc-dataseed.binance.org/', + ticker: 'BNB', + }, + { + blockExplorerUrl: 'https://cchain.explorer.avax.network/', + chainId: '0xa86a', + iconColor: 'var(--color-network-localhost-default)', + isATestNetwork: false, + label: 'Avalanche', + providerType: 'rpc', + rpcUrl: 'https://api.avax.network/ext/bc/C/rpc', + ticker: 'AVAX', + }, + { + blockExplorerUrl: 'https://polygonscan.com', + chainId: '0x89', + iconColor: 'var(--color-network-localhost-default)', + isATestNetwork: false, + label: 'Polygon', + providerType: 'rpc', + rpcUrl: 'https://polygon-rpc.com', + ticker: 'MATIC', + }, +] + export default state; diff --git a/ui/pages/settings/networks-tab/custom-content-search/custom-content-search.stories.js b/ui/pages/settings/networks-tab/custom-content-search/custom-content-search.stories.js index 1d967163af45..b1dd46dc083a 100644 --- a/ui/pages/settings/networks-tab/custom-content-search/custom-content-search.stories.js +++ b/ui/pages/settings/networks-tab/custom-content-search/custom-content-search.stories.js @@ -1,5 +1,5 @@ import React from 'react'; -import testData from '../../../../../.storybook/test-data'; +import { networkList } from '../../../../../.storybook/test-data'; import CustomContentSearch from './custom-content-search'; export default { @@ -19,5 +19,5 @@ export default { }; export const CustomContentSearchComponent = (args) => { - return ; + return ; }; diff --git a/ui/pages/settings/networks-tab/custom-content-search/custom-content-search.test.js b/ui/pages/settings/networks-tab/custom-content-search/custom-content-search.test.js index ee5996dd9902..3cd7ac62122c 100644 --- a/ui/pages/settings/networks-tab/custom-content-search/custom-content-search.test.js +++ b/ui/pages/settings/networks-tab/custom-content-search/custom-content-search.test.js @@ -3,7 +3,7 @@ import { fireEvent, render, screen } from '@testing-library/react'; import Fuse from 'fuse.js'; import configureStore from '../../../../store/store'; import { renderWithProvider } from '../../../../../test/lib/render-helpers'; -import testData from '../../../../../.storybook/test-data'; +import { networkList } from '../../../../../.storybook/test-data'; import CustomContentSearch from './custom-content-search'; function renderComponent({ componentProps = {} } = {}) { @@ -15,7 +15,7 @@ describe('CustomContentSearch', () => { it('should render custom content search correctly', () => { const onSearch = jest.fn(); const wrapper = renderComponent({ - componentProps: { onSearch, networksList: testData.networkList }, + componentProps: { onSearch, networksList: networkList }, }); expect(wrapper.getByTestId('search-networks')).toBeDefined(); }); @@ -23,7 +23,7 @@ describe('CustomContentSearch', () => { it('should check placeholder text in TextField input', () => { const onSearch = jest.fn(); const wrapper = renderComponent({ - componentProps: { onSearch, networksList: testData.networkList }, + componentProps: { onSearch, networksList: networkList }, }); const { getByPlaceholderText } = wrapper; expect( @@ -68,14 +68,14 @@ describe('CustomContentSearch', () => { it('should check if error is shown if search does not return any network from the list', () => { const onSearch = jest.fn(); - const networksSearchFuse = new Fuse(testData.networkList, { + const networksSearchFuse = new Fuse(networkList, { keys: ['label', 'labelKey'], }); const fuseSearchResult = networksSearchFuse.search('Optimism'); const wrapper = renderComponent({ componentProps: { onSearch, - networksList: testData.networkList, + networksList: networkList, searchQueryInput: 'Optimism', error: 'No matching results found.', }, @@ -90,14 +90,14 @@ describe('CustomContentSearch', () => { it('should check if error is not shown if search return some network from the list', () => { const onSearch = jest.fn(); - const networksSearchFuse = new Fuse(testData.networkList, { + const networksSearchFuse = new Fuse(networkList, { keys: ['label', 'labelKey'], }); const fuseSearchResult = networksSearchFuse.search('goerli'); const wrapper = renderComponent({ componentProps: { onSearch, - networksList: testData.networkList, + networksList: networkList, searchQueryInput: 'Avalanche', error: '', }, diff --git a/ui/pages/settings/networks-tab/networks-list/network-list.stories.js b/ui/pages/settings/networks-tab/networks-list/network-list.stories.js index a5c8feb47b72..80831425a2b9 100644 --- a/ui/pages/settings/networks-tab/networks-list/network-list.stories.js +++ b/ui/pages/settings/networks-tab/networks-list/network-list.stories.js @@ -1,5 +1,5 @@ import React from 'react'; -import testData from '../../../../../.storybook/test-data'; +import { networkList } from '../../../../../.storybook/test-data'; import NetworksList from './networks-list'; export default { @@ -19,7 +19,7 @@ export default { args: { networkDefaultedToProvider: false, networkIsSelected: false, - networksToRender: testData.networkList, + networksToRender: networkList, }, };