#3 Improve test coverage for apps/staking

apps/staking/__tests__/components/ApolloContainer.test.tsx

@@ -0,0 +1,81 @@
+// Copyright (C) 2023 Cartesi Pte. Ltd.
+
+// This program is free software: you can redistribute it and/or modify it under
+// the terms of the GNU General Public License as published by the Free Software
+// Foundation, either version 3 of the License, or (at your option) any later
+// version.
+
+// This program is distributed in the hope that it will be useful, but WITHOUT ANY
+// WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A
+// PARTICULAR PURPOSE. See the GNU General Public License for more details.
+
+import { cleanup, render, screen } from '@testing-library/react';
+import { useWallet } from '@explorer/wallet';
+import { useApollo } from '../../src/services/apollo';
+import ApolloContainer from '../../src/components/ApolloContainer';
+import { withChakraTheme } from '../test-utilities';
+
+jest.mock('@apollo/client', () => {
+    const originalModule = jest.requireActual('@apollo/client');
+    return {
+        __esModule: true,
+        ...originalModule,
+        ApolloProvider: ({ children }) => <div>{children}</div>,
+    };
+});
+
+jest.mock('../../src/services/apollo', () => {
+    const originalModule = jest.requireActual('../../src/services/apollo');
+    return {
+        __esModule: true,
+        ...originalModule,
+        useApollo: jest.fn(),
+    };
+});
+
+jest.mock('@explorer/wallet', () => {
+    const originalModule = jest.requireActual('@explorer/wallet');
+    return {
+        __esModule: true,
+        ...originalModule,
+        useWallet: jest.fn(),
+    };
+});
+
+const account = '0x907eA0e65Ecf3af503007B382E1280Aeb46104ad';
+const mockedUseWallet = useWallet as jest.MockedFunction<typeof useWallet>;
+const mockedUseApollo = useApollo as jest.MockedFunction<typeof useApollo>;
+const walletData = {
+    account,
+    active: true,
+    activate: jest.fn(),
+    deactivate: jest.fn(),
+    chainId: 3,
+};
+
+const Component = withChakraTheme(ApolloContainer);
+
+describe('ApolloContainer component', () => {
+    beforeEach(() => {
+        mockedUseWallet.mockReturnValue(walletData);
+    });
+
+    afterEach(() => {
+        cleanup();
+        jest.clearAllMocks();
+    });
+
+    it('should display correct content', () => {
+        const content = 'Content';
+        render(<Component>{content}</Component>);
+        expect(screen.getByText(content)).toBeInTheDocument();
+    });
+
+    it('should invoke useApollo hook with chain id', () => {
+        const implementation = jest.fn();
+        mockedUseApollo.mockImplementation(implementation);
+
+        render(<Component>Content</Component>);
+        expect(implementation).toHaveBeenCalledWith(walletData.chainId);
+    });
+});

apps/staking/__tests__/components/AttentionIcon.test.tsx

@@ -0,0 +1,25 @@
+// Copyright (C) 2023 Cartesi Pte. Ltd.
+
+// This program is free software: you can redistribute it and/or modify it under
+// the terms of the GNU General Public License as published by the Free Software
+// Foundation, either version 3 of the License, or (at your option) any later
+// version.
+
+// This program is distributed in the hope that it will be useful, but WITHOUT ANY
+// WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A
+// PARTICULAR PURPOSE. See the GNU General Public License for more details.
+
+import { render, screen } from '@testing-library/react';
+import AttentionIcon from '../../src/components/AttentionIcon';
+import { withChakraTheme } from '../test-utilities';
+
+const Component = withChakraTheme(AttentionIcon);
+
+describe('AttentionIcon component', () => {
+    it('should append additional props', () => {
+        const value = 'attention-icon';
+        render(<Component data-testid={value}>Content</Component>);
+
+        expect(screen.getByTestId(value)).toBeInTheDocument();
+    });
+});

apps/staking/__tests__/components/ConfirmationIndicator.test.tsx

@@ -0,0 +1,33 @@
+// Copyright (C) 2023 Cartesi Pte. Ltd.
+
+// This program is free software: you can redistribute it and/or modify it under
+// the terms of the GNU General Public License as published by the Free Software
+// Foundation, either version 3 of the License, or (at your option) any later
+// version.
+
+// This program is distributed in the hope that it will be useful, but WITHOUT ANY
+// WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A
+// PARTICULAR PURPOSE. See the GNU General Public License for more details.
+
+import { render, screen } from '@testing-library/react';
+import ConfirmationIndicator from '../../src/components/ConfirmationIndicator';
+import { withChakraTheme } from '../test-utilities';
+
+const Component = withChakraTheme(ConfirmationIndicator);
+
+describe('ConfirmationIndicator component', () => {
+    it('should display correct label while loading', () => {
+        render(<Component loading />);
+        expect(screen.getByText('Pending')).toBeInTheDocument();
+    });
+
+    it('should display correct label when not loading', () => {
+        render(<Component loading={false} />);
+        expect(screen.getByText('Success')).toBeInTheDocument();
+    });
+
+    it('should display correct label when error has occurred', () => {
+        render(<Component loading={false} error="error" />);
+        expect(screen.getByText('Failure')).toBeInTheDocument();
+    });
+});

apps/staking/__tests__/components/IconLink.test.tsx

@@ -0,0 +1,35 @@
+// Copyright (C) 2023 Cartesi Pte. Ltd.
+
+// This program is free software: you can redistribute it and/or modify it under
+// the terms of the GNU General Public License as published by the Free Software
+// Foundation, either version 3 of the License, or (at your option) any later
+// version.
+
+// This program is distributed in the hope that it will be useful, but WITHOUT ANY
+// WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A
+// PARTICULAR PURPOSE. See the GNU General Public License for more details.
+
+import { render, screen } from '@testing-library/react';
+import IconLink from '../../src/components/IconLink';
+import { withChakraTheme } from '../test-utilities';
+
+const Component = withChakraTheme(IconLink);
+const props = {
+    href: 'https://google.com',
+    tooltip: 'Google',
+    icon: 'Link to Google',
+};
+
+describe('IconLink component', () => {
+    it('should display correct link', () => {
+        const { container } = render(<Component {...props} />);
+        const link = container.querySelector('a');
+
+        expect(link.getAttribute('href')).toBe(props.href);
+    });
+
+    it('should display link icon', () => {
+        render(<Component {...props} />);
+        expect(screen.getByText(props.icon)).toBeInTheDocument();
+    });
+});

apps/staking/__tests__/components/Layout.test.tsx

@@ -0,0 +1,115 @@
+// Copyright (C) 2023 Cartesi Pte. Ltd.
+
+// This program is free software: you can redistribute it and/or modify it under
+// the terms of the GNU General Public License as published by the Free Software
+// Foundation, either version 3 of the License, or (at your option) any later
+// version.
+
+// This program is distributed in the hope that it will be useful, but WITHOUT ANY
+// WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A
+// PARTICULAR PURPOSE. See the GNU General Public License for more details.
+
+import { cleanup, render, screen } from '@testing-library/react';
+import { StakingImpl, PoS } from '@cartesi/pos';
+import Layout, { headerLinks, footerLinks } from '../../src/components/Layout';
+import {
+    useCartesiTokenContract,
+    usePoSContract,
+    useSimpleFaucetContract,
+    useStakingContract,
+    useStakingPoolFactoryContract,
+    useWorkerManagerContract,
+} from '../../src/services/contracts';
+import useMeta from '../../src/graphql/hooks/useMeta';
+import { withChakraTheme } from '../test-utilities';
+import { CartesiToken, SimpleFaucet } from '@cartesi/token';
+import { StakingPoolFactoryImpl } from '@cartesi/staking-pool';
+import { WorkerManagerAuthManagerImpl } from '@cartesi/util';
+
+jest.mock('../../src/services/contracts', () => {
+    const original = jest.requireActual('../../src/services/contracts');
+    return {
+        __esModule: true,
+        ...original,
+        useCartesiTokenContract: jest.fn(),
+        usePoSContract: jest.fn(),
+        useSimpleFaucetContract: jest.fn(),
+        useStakingContract: jest.fn(),
+        useStakingPoolFactoryContract: jest.fn(),
+        useWorkerManagerContract: jest.fn(),
+    };
+});
+
+jest.mock('../../src/graphql/hooks/useMeta');
+
+const address = '0x2942aa4356783892c624125acfbbb80d29629a9d';
+const mockedUseCartesiTokenContract =
+    useCartesiTokenContract as jest.MockedFunction<
+        typeof useCartesiTokenContract
+    >;
+const mockedUsePoSContract = usePoSContract as jest.MockedFunction<
+    typeof usePoSContract
+>;
+const mockedUseSimpleFaucetContract =
+    useSimpleFaucetContract as jest.MockedFunction<
+        typeof useSimpleFaucetContract
+    >;
+const mockedUseStakingContract = useStakingContract as jest.MockedFunction<
+    typeof useStakingContract
+>;
+const mockedUseStakingPoolFactoryContract =
+    useStakingPoolFactoryContract as jest.MockedFunction<
+        typeof useStakingPoolFactoryContract
+    >;
+const mockedUseWorkerManagerContract =
+    useWorkerManagerContract as jest.MockedFunction<
+        typeof useWorkerManagerContract
+    >;
+const mockedUseMeta = useMeta as jest.MockedFunction<typeof useMeta>;
+
+const Component = withChakraTheme(Layout);
+
+describe('Layout component', () => {
+    beforeEach(() => {
+        mockedUsePoSContract.mockReturnValue({
+            address,
+        } as unknown as PoS);
+        mockedUseCartesiTokenContract.mockReturnValue({
+            address,
+        } as unknown as CartesiToken);
+        mockedUseSimpleFaucetContract.mockReturnValue({
+            address,
+        } as unknown as SimpleFaucet);
+        mockedUseStakingContract.mockReturnValue({
+            address,
+        } as unknown as StakingImpl);
+        mockedUseStakingPoolFactoryContract.mockReturnValue({
+            address,
+        } as unknown as StakingPoolFactoryImpl);
+        mockedUseWorkerManagerContract.mockReturnValue({
+            address,
+        } as unknown as WorkerManagerAuthManagerImpl);
+        mockedUseMeta.mockReturnValue(undefined);
+    });
+
+    afterEach(() => {
+        jest.clearAllMocks();
+        cleanup();
+    });
+
+    it('should display correct header links', () => {
+        render(<Component>Footer</Component>);
+
+        headerLinks.forEach((link) => {
+            expect(screen.getByText(link.label)).toBeInTheDocument();
+        });
+    });
+
+    it('should display correct footer links', () => {
+        render(<Component>Footer</Component>);
+
+        footerLinks.forEach((link) => {
+            expect(screen.getByText(link.label)).toBeInTheDocument();
+        });
+    });
+});

apps/staking/__tests__/components/MarketInfo.test.tsx

@@ -0,0 +1,40 @@
+// Copyright (C) 2023 Cartesi Pte. Ltd.
+
+// This program is free software: you can redistribute it and/or modify it under
+// the terms of the GNU General Public License as published by the Free Software
+// Foundation, either version 3 of the License, or (at your option) any later
+// version.
+
+// This program is distributed in the hope that it will be useful, but WITHOUT ANY
+// WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A
+// PARTICULAR PURPOSE. See the GNU General Public License for more details.
+
+import { render, screen } from '@testing-library/react';
+import MarketInfo, { MarketInfoUnit } from '../../src/components/MarketInfo';
+import { withChakraTheme } from '../test-utilities';
+
+const Component = withChakraTheme(MarketInfo);
+const props = {
+    label: 'Some label',
+    value: 10,
+    unit: 'USD' as MarketInfoUnit,
+};
+
+describe('MarketInfo component', () => {
+    it('should display label', () => {
+        render(<Component {...props} />);
+        expect(screen.getByText(props.label)).toBeInTheDocument();
+    });
+
+    it('should display unit when value is larger than zero', () => {
+        render(<Component {...props} />);
+        expect(screen.getByText(props.unit)).toBeInTheDocument();
+    });
+
+    it('should not display unit when value is zero', () => {
+        render(<Component {...props} value={0} />);
+        expect(() => screen.getByText(props.unit)).toThrow(
+            'Unable to find an element'
+        );
+    });
+});

apps/staking/__tests__/components/PageHeader.test.tsx

@@ -0,0 +1,26 @@
+// Copyright (C) 2023 Cartesi Pte. Ltd.
+
+// This program is free software: you can redistribute it and/or modify it under
+// the terms of the GNU General Public License as published by the Free Software
+// Foundation, either version 3 of the License, or (at your option) any later
+// version.
+
+// This program is distributed in the hope that it will be useful, but WITHOUT ANY
+// WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A
+// PARTICULAR PURPOSE. See the GNU General Public License for more details.
+
+import { render, screen } from '@testing-library/react';
+import PageHeader from '../../src/components/PageHeader';
+import { withChakraTheme } from '../test-utilities';
+
+const Component = withChakraTheme(PageHeader);
+const props = {
+    title: 'Some title',
+};
+
+describe('PageHeader component', () => {
+    it('should display title', () => {
+        render(<Component {...props} />);
+        expect(screen.getByText(props.title)).toBeInTheDocument();
+    });
+});