fix: fix chains used by wagmi + mock Web3Wrapper during tests

src/clients/web3/Web3Wrapper/__mocks__/index.tsx

@@ -0,0 +1,5 @@
+import React from 'react';
+
+const Web3Wrapper: React.FC = ({ children }) => <>{children}</>;
+
+export default Web3Wrapper;

src/clients/web3/Web3Wrapper/client.ts

@@ -15,19 +15,17 @@ import { BinanceWalletConnector } from './binanceWalletConnector';
 
 export const chains: Chain[] = config.isOnTestnet ? [bscTestnet] : [bsc];
 
-export const { provider, webSocketProvider } = configureChains(
-  [bscTestnet],
-  [
-    jsonRpcProvider({
-      rpc: chain => config.rpcUrls[chain.id as ChainId],
-    }),
-    publicProvider(),
-  ],
-);
+const { provider, webSocketProvider } = configureChains(chains, [
+  jsonRpcProvider({
+    rpc: chain => config.rpcUrls[chain.id as ChainId],
+  }),
+  publicProvider(),
+]);
 
 const client = createClient({
   autoConnect: true,
   provider,
+  webSocketProvider,
   connectors: [
     new InjectedConnector({ chains }),
     new MetaMaskConnector({ chains }),
@@ -48,7 +46,6 @@ const client = createClient({
       chains,
     }),
   ],
-  webSocketProvider,
 });
 
 export default client;

src/setupTests.tsx

@@ -13,6 +13,7 @@ import useTokenApproval from 'hooks/useTokenApproval';
 vi.mock('utilities/isFeatureEnabled');
 vi.mock('hooks/useTokenApproval');
 vi.mock('clients/api');
+vi.mock('clients/web3/Web3Wrapper');
 
 // Mock Lottie
 vi.mock('@lottiefiles/react-lottie-player', () => ({
@@ -41,12 +42,6 @@ vi.mock('@uiw/react-markdown-preview', () => ({
   default: ({ content, ...otherProps }: any) => <p {...otherProps}>content</p>,
 }));
 
-// Mock connectors to prevent any request from being made to providers
-vi.mock('wagmi/connectors/coinbaseWallet');
-vi.mock('wagmi/connectors/walletConnect');
-vi.mock('wagmi/connectors/injected');
-vi.mock('wagmi/connectors/metaMask');
-
 initializeLibraries();
 
 const useTokenApprovalOriginalOutput = useTokenApproval(

src/testUtils/renderComponent.tsx

@@ -1,11 +1,11 @@
 // eslint-disable-next-line import/no-extraneous-dependencies
 import { render } from '@testing-library/react';
 import { getDefaultProvider } from 'ethers';
+import { ChainId } from 'packages/contracts';
 import React from 'react';
 import { QueryClient, QueryClientProvider } from 'react-query';
 import { BrowserRouter, Route, Switch } from 'react-router-dom';
 import { ToastContainer } from 'react-toastify';
-import { ChainId } from 'packages/contracts';
 
 import { Web3Wrapper } from 'clients/web3';
 import { AuthContext, AuthContextValue } from 'context/AuthContext';