test(tests): another portion of tests (#959)

astro_2.0/components/AppHeader/components/AccountButton/AccountButton.tsx

@@ -8,7 +8,7 @@ import { AppFooter } from 'astro_2.0/components/AppFooter';
 import { GenericDropdown } from 'astro_2.0/components/GenericDropdown';
 
 import { WalletType } from 'types/config';
-import { WalletIcon } from 'astro_2.0/components/AppHeader/components/AccountButton/components/WalletIcon/WalletIcon';
+import { WalletIcon } from 'astro_2.0/components/AppHeader/components/AccountButton/components/WalletIcon';
 import { useModal } from 'components/modal';
 import { WalletSelectionModal } from 'astro_2.0/components/AppHeader/components/AccountButton/components/WalletSelectionModal';
 import { WalletsList } from 'astro_2.0/components/AppHeader/components/AccountButton/components/WalletsList';

astro_2.0/components/AppHeader/components/AccountButton/components/DisconnectButton/DisconnectButton.tsx

@@ -13,7 +13,7 @@ export const DisconnectButton: React.FC<DisconnectButtonProps> = ({
 }) => {
   return (
     <AccountPopupItem
-      onClick={() => logout()}
+      onClick={logout}
       className={styles.menuButton}
       content={<div className={styles.disconnectText}>Disconnect</div>}
       icon={

astro_2.0/components/AppHeader/components/AccountButton/components/DisconnectButton/tests/DisconnectButton.spec.tsx

@@ -0,0 +1,11 @@
+import { render } from 'jest/testUtils';
+
+import { DisconnectButton } from 'astro_2.0/components/AppHeader/components/AccountButton/components/DisconnectButton';
+
+describe('DisconnectButton', () => {
+  it('Should render component', () => {
+    const { getByText } = render(<DisconnectButton logout={() => 0} />);
+
+    expect(getByText('Disconnect')).toBeTruthy();
+  });
+});

astro_2.0/components/AppHeader/components/AccountButton/components/MyAccountButton/tests/MyAccountButton.spec.tsx

@@ -0,0 +1,18 @@
+import { render } from 'jest/testUtils';
+import { fireEvent } from '@testing-library/dom';
+
+import { MyAccountButton } from 'astro_2.0/components/AppHeader/components/AccountButton/components/MyAccountButton';
+
+describe('MyAccountButton', () => {
+  it('Should handle click properly ', () => {
+    const closeDropdown = jest.fn();
+
+    const { getByRole } = render(
+      <MyAccountButton closeDropdown={closeDropdown} />
+    );
+
+    fireEvent.click(getByRole('button'));
+
+    expect(closeDropdown).toBeCalled();
+  });
+});

astro_2.0/components/AppHeader/components/AccountButton/components/WalletButton/WalletButton.tsx

@@ -1,4 +1,4 @@
-import { WalletIcon } from 'astro_2.0/components/AppHeader/components/AccountButton/components/WalletIcon/WalletIcon';
+import { WalletIcon } from 'astro_2.0/components/AppHeader/components/AccountButton/components/WalletIcon';
 import { WalletType } from 'types/config';
 import { WalletDescription } from 'astro_2.0/components/AppHeader/components/AccountButton/components/WalletDescription';
 import { AccountPopupItem } from 'astro_2.0/components/AppHeader/components/AccountButton/components/AccountPopupItem';

astro_2.0/components/AppHeader/components/AccountButton/components/WalletButton/tests/WalletButton.spec.tsx

@@ -0,0 +1,21 @@
+import { render } from 'jest/testUtils';
+
+import { WalletButton } from 'astro_2.0/components/AppHeader/components/AccountButton/components/WalletButton';
+
+describe('WalletButton', () => {
+  it('Should render component', () => {
+    const name = 'Wallet Name';
+
+    const { getByText } = render(
+      <WalletButton
+        url=""
+        type=""
+        name={name}
+        walletType={0}
+        onClick={() => 0}
+      />
+    );
+
+    expect(getByText(name)).toBeTruthy();
+  });
+});

astro_2.0/components/AppHeader/components/AccountButton/components/WalletDescription/tests/WalletDescription.spec.tsx

@@ -0,0 +1,19 @@
+import { render } from 'jest/testUtils';
+
+import { WalletDescription } from 'astro_2.0/components/AppHeader/components/AccountButton/components/WalletDescription';
+
+describe('WalletDescription', () => {
+  it('Should render component', () => {
+    const name = 'Wallet name';
+    const type = 'Wallet type';
+    const url = 'Wallet url';
+
+    const { getByText } = render(
+      <WalletDescription name={name} type={type} url={url} />
+    );
+
+    expect(getByText(name)).toBeTruthy();
+    expect(getByText(type, { exact: false })).toBeTruthy();
+    expect(getByText(url)).toBeTruthy();
+  });
+});

astro_2.0/components/AppHeader/components/AccountButton/components/WalletIcon/tests/WalletIcon.spec.tsx

@@ -0,0 +1,37 @@
+import { render } from 'jest/testUtils';
+
+import { WalletIcon } from 'astro_2.0/components/AppHeader/components/AccountButton/components/WalletIcon';
+
+jest.mock('astro_2.0/components/NearIcon', () => {
+  return {
+    NearIcon: () => <div>NearIcon</div>,
+  };
+});
+
+jest.mock('astro_2.0/components/SenderIcon', () => {
+  return {
+    SenderIcon: () => <div>SenderIcon</div>,
+  };
+});
+
+describe('WalletIcon', () => {
+  it('Should render Near icon', () => {
+    const { getByText } = render(<WalletIcon walletType={0} isSelected />);
+
+    expect(getByText('NearIcon')).toBeTruthy();
+  });
+
+  it('Should render Sender icon', () => {
+    const { getByText } = render(
+      <WalletIcon walletType={1} isSelected={false} />
+    );
+
+    expect(getByText('SenderIcon')).toBeTruthy();
+  });
+
+  it('Should render Near icon by default', () => {
+    const { getByText } = render(<WalletIcon walletType={3} isSelected />);
+
+    expect(getByText('NearIcon')).toBeTruthy();
+  });
+});

astro_2.0/components/AppHeader/components/AccountButton/components/WalletSelectionModal/tests/WalletSelectionModal.spec.tsx

@@ -0,0 +1,36 @@
+import { render } from 'jest/testUtils';
+import { fireEvent } from '@testing-library/dom';
+
+import { WalletSelectionModal } from 'astro_2.0/components/AppHeader/components/AccountButton/components/WalletSelectionModal';
+
+jest.mock('components/modal', () => {
+  return {
+    Modal: ({ children }: { children: unknown }) => children,
+  };
+});
+
+describe('WalletSelectionModal', () => {
+  it('Should sign in Near wallet', () => {
+    const signIn = jest.fn();
+
+    const { getAllByRole } = render(
+      <WalletSelectionModal isOpen onClose={() => 0} signIn={signIn} />
+    );
+
+    fireEvent.click(getAllByRole('button')[0]);
+
+    expect(signIn).toBeCalledWith(0);
+  });
+
+  it('Should sign in Sender wallet', () => {
+    const signIn = jest.fn();
+
+    const { getAllByRole } = render(
+      <WalletSelectionModal isOpen onClose={() => 0} signIn={signIn} />
+    );
+
+    fireEvent.click(getAllByRole('button')[2]);
+
+    expect(signIn).toBeCalledWith(1);
+  });
+});

astro_2.0/components/AppHeader/components/AccountButton/components/WalletWithAccounts/tests/WalletWithAccounts.spec.tsx

@@ -0,0 +1,39 @@
+/* eslint-disable @typescript-eslint/ban-ts-comment */
+
+import { render } from 'jest/testUtils';
+
+import { useAuthContext } from 'context/AuthContext';
+
+import { WalletWithAccounts } from 'astro_2.0/components/AppHeader/components/AccountButton/components/WalletWithAccounts';
+
+jest.mock('context/AuthContext', () => {
+  return {
+    useAuthContext: jest.fn(() => ({})),
+  };
+});
+
+describe('WalletWithAccounts', () => {
+  it('Should render component', () => {
+    // @ts-ignore
+    useAuthContext.mockImplementation(() => ({
+      accountId: '1',
+    }));
+
+    const { getByText } = render(
+      <WalletWithAccounts
+        wallet={{
+          id: 0,
+          name: 'NEAR',
+          type: 'NEAR',
+          url: 'url',
+        }}
+        isSelected
+        accounts={['2', '1', '3']}
+        switchAccountHandler={() => () => 0}
+        switchWalletHandler={() => () => 0}
+      />
+    );
+
+    expect(getByText('NEAR')).toBeTruthy();
+  });
+});

astro_2.0/components/AppHeader/components/AccountButton/components/WalletsList/WalletsList.tsx

@@ -1,13 +1,13 @@
 import React from 'react';
-import { MyAccountButton } from 'astro_2.0/components/AppHeader/components/AccountButton/components/MyAccount';
+import { MyAccountButton } from 'astro_2.0/components/AppHeader/components/AccountButton/components/MyAccountButton';
 import { WalletType } from 'types/config';
 import { DisconnectButton } from 'astro_2.0/components/AppHeader/components/AccountButton/components/DisconnectButton';
 import { WalletMeta } from 'services/sputnik/SputnikNearService/services/types';
 import { WalletWithAccounts } from 'astro_2.0/components/AppHeader/components/AccountButton/components/WalletWithAccounts';
 import { WalletButton } from 'astro_2.0/components/AppHeader/components/AccountButton/components/WalletButton';
 import styles from './WalletsList.module.scss';
 
-interface WalletsListProps {
+export interface WalletsListProps {
   logoutHandler: () => Promise<void>;
   availableNearAccounts: string[];
   availableWallets: WalletMeta[];

astro_2.0/components/AppHeader/components/AccountButton/components/WalletsList/tests/WalletsList.spec.tsx

@@ -0,0 +1,25 @@
+import { render } from 'jest/testUtils';
+
+import { WalletMeta } from 'services/sputnik/SputnikNearService/services/types';
+import { WalletsList } from 'astro_2.0/components/AppHeader/components/AccountButton/components/WalletsList';
+
+describe('WalletsList', () => {
+  it('Should render component', () => {
+    const wallets = ([
+      { id: 'NEAR' },
+      { id: 'SENDER' },
+    ] as unknown) as WalletMeta[];
+
+    render(
+      <WalletsList
+        logoutHandler={() => Promise.resolve()}
+        availableNearAccounts={[]}
+        availableWallets={wallets}
+        selectedWallet={0}
+        switchAccountHandler={() => () => 0}
+        switchWalletHandler={() => () => 0}
+        closeDropdownHandler={() => 0}
+      />
+    );
+  });
+});