add tests

src/components/SwapWidget/SwapWidget.tsx

@@ -118,6 +118,7 @@ export const SwapWidget: FC = () => {
                   onClick={() =>
                     openWalletModal(destinationChain?.chainID ?? "cosmoshub-4")
                   }
+                  data-testid="destination-wallet-btn"
                 >
                   {destinationChainAddress
                     ? `${destinationChainAddress.slice(

src/components/SwapWidget/useSwapWidget.ts

@@ -124,9 +124,6 @@ export function useSwapWidget() {
     if (currentEvmChain.id !== chainID) {
       switchNetwork(chainID);
     }
-
-    console.log("source chain changed", formValues.sourceChain);
-    console.log(currentEvmChain);
   }, [currentEvmChain, formValues.sourceChain, switchNetwork]);
 
   return {

src/components/__tests__/SwapWidget.test.tsx

@@ -4,16 +4,12 @@ import { setupServer } from "msw/node";
 import { act, fireEvent, render, screen, waitFor, within } from "@/test";
 
 import { ASSETS_RESPONSE } from "../../../fixtures/assets";
-import { CHAINS_RESPONSE } from "../../../fixtures/chains";
 import { SwapWidget } from "../SwapWidget";
 import { LAST_SOURCE_CHAIN_KEY } from "../SwapWidget/useSwapWidget";
 
 const API_URL = "https://solve-dev.skip.money";
 
 const handlers = [
-  rest.get(`${API_URL}/v1/info/chains`, (_, res, ctx) => {
-    return res(ctx.status(200), ctx.json(CHAINS_RESPONSE));
-  }),
   rest.get(`${API_URL}/v1/fungible/assets`, (_, res, ctx) => {
     return res(ctx.status(200), ctx.json(ASSETS_RESPONSE));
   }),
@@ -370,4 +366,85 @@ describe("SwapWidget", () => {
       expect(outputAmountElement).toHaveTextContent("25.329854"),
     );
   });
+
+  it("displays the connect destination wallet button if the source chain and destination chain are not the same chain type", async () => {
+    await act(async () => {
+      render(<SwapWidget />);
+    });
+
+    const sourceAssetSection = await screen.findByTestId("source");
+    const destinationAssetSection = await screen.findByTestId("destination");
+
+    const sourceChainButton =
+      within(sourceAssetSection).getByText("Cosmos Hub");
+
+    const destinationChainButton = within(destinationAssetSection).getByText(
+      "Select Chain",
+    );
+
+    // select Cosmos Hub and Neutron
+    await act(() => {
+      fireEvent.click(sourceChainButton);
+    });
+    fireEvent.click(
+      await within(sourceAssetSection).findByRole("button", {
+        name: /cosmos hub/i,
+      }),
+    );
+
+    await act(() => {
+      fireEvent.click(destinationChainButton);
+    });
+    fireEvent.click(
+      await within(destinationAssetSection).findByRole("button", {
+        name: /neutron/i,
+      }),
+    );
+
+    expect(
+      screen.queryByTestId("destination-wallet-btn"),
+    ).not.toBeInTheDocument();
+
+    // select Arbitrum and Osmosis
+    await act(() => {
+      fireEvent.click(sourceChainButton);
+    });
+    fireEvent.click(
+      await within(sourceAssetSection).findByRole("button", {
+        name: /arbitrum/i,
+      }),
+    );
+
+    await act(() => {
+      fireEvent.click(destinationChainButton);
+    });
+    fireEvent.click(
+      await within(destinationAssetSection).findByRole("button", {
+        name: /osmosis/i,
+      }),
+    );
+
+    expect(screen.queryByTestId("destination-wallet-btn")).toBeInTheDocument();
+
+    // select Osmosis and Polygon
+    await act(() => {
+      fireEvent.click(sourceChainButton);
+    });
+    fireEvent.click(
+      await within(sourceAssetSection).findByRole("button", {
+        name: /osmosis/i,
+      }),
+    );
+
+    await act(() => {
+      fireEvent.click(destinationChainButton);
+    });
+    fireEvent.click(
+      await within(destinationAssetSection).findByRole("button", {
+        name: /polygon/i,
+      }),
+    );
+
+    expect(screen.queryByTestId("destination-wallet-btn")).toBeInTheDocument();
+  });
 });