From fc356830f30e4fcae3052a14d8b47377318c9793 Mon Sep 17 00:00:00 2001 From: VSnehalatha Date: Fri, 28 Apr 2023 16:25:14 +0530 Subject: [PATCH 1/2] create Jest/RTL test for ItemsList.js --- .../ItemsList/tests/ItemsList.test.js | 128 ++++++++++++++++-- 1 file changed, 115 insertions(+), 13 deletions(-) diff --git a/src/Instance/ItemsList/tests/ItemsList.test.js b/src/Instance/ItemsList/tests/ItemsList.test.js index 546f8aff2..9837d3409 100644 --- a/src/Instance/ItemsList/tests/ItemsList.test.js +++ b/src/Instance/ItemsList/tests/ItemsList.test.js @@ -3,24 +3,31 @@ import { QueryClient, QueryClientProvider } from 'react-query'; import { BrowserRouter as Router } from 'react-router-dom'; import { act } from 'react-dom/test-utils'; import { screen } from '@testing-library/react'; +import userEvent from '@testing-library/user-event'; import '../../../../test/jest/__mock__'; +import '../../../../test/jest/__mock__/stripesComponents.mock'; import DataContext from '../../../contexts/DataContext'; import { items as itemsFixture } from '../../../../test/fixtures/items'; -import { holdingsRecords as holdingsRecordsFixture } from '../../../../test/fixtures/holdingsRecords'; + import renderWithIntl from '../../../../test/jest/helpers/renderWithIntl'; import translations from '../../../../test/jest/helpers/translationsProperties'; import ItemsList from '../ItemsList'; import useHoldingItemsQuery from '../../../hooks/useHoldingItemsQuery'; import '../../../Holding/ViewHolding/HoldingBoundWith/useBoundWithHoldings'; + jest.mock('../../../hooks/useHoldingItemsQuery', () => jest.fn()); -jest.mock('../../../Holding/ViewHolding/HoldingBoundWith/useBoundWithHoldings', () => jest.fn(() => ({ - boundWithHoldings: [], - isLoading: false, -}))); + +jest.mock('../../../Holding/ViewHolding/HoldingBoundWith/useBoundWithHoldings', () => ({ + __esModule: true, + default: () => ({ + boundWithHoldings: [], + isLoading: false, + }), +})); const queryClient = new QueryClient(); @@ -39,17 +46,70 @@ const locations = { }, }; +const holding = { + id: 'holdingsRecordId1', +}; +const items = [ + { + id: 'itemId1', + holdingsRecordId: 'holdingsRecordId1', + status: { + name: 'Available', + }, + copyNumber: '1', + materialType: { + name: 'Book', + }, + temporaryLoanType: { + name: 'Temporary Loan Type', + }, + effectiveLocation: { + id: 'locationId1', + }, + enumeration: 'v.1', + chronology: 'no.1', + volume: 'vol.1', + yearCaption: ['2021'], + }, + { + id: 'itemId2', + holdingsRecordId: 'holdingsRecordId1', + status: { + name: 'Checked out', + }, + copyNumber: '2', + materialType: { + name: 'CD', + }, + permanentLoanType: { + name: 'Permanent Loan Type', + }, + effectiveLocation: { + id: 'locationId2', + }, + enumeration: 'v.2', + chronology: 'no.2', + volume: 'vol.2', + yearCaption: ['2022'], + }, +]; + +const draggable = true; +const isItemsDragSelected = jest.fn(); +const selectItemsForDrag = jest.fn(); +const getDraggingItems = jest.fn(); + const ItemsListSetup = () => ( false} - selectItemsForDrag={(_) => {}} - getDraggingItems={jest.fn()} - draggable={false} + holding={holding} + items={items} + draggable={draggable} + isItemsDragSelected={isItemsDragSelected} + selectItemsForDrag={selectItemsForDrag} + getDraggingItems={getDraggingItems} /> @@ -71,8 +131,50 @@ describe('ItemsList', () => { afterEach(() => { jest.clearAllMocks(); }); + it('should trigger the button click event', () => { + const { container } = renderWithIntl(, translations); + const buttonElement = container.querySelector('#list-items-holdingsRecordId1-clickable-list-column-dnd'); + expect(buttonElement).toBeInTheDocument(); + userEvent.click(buttonElement); + }); + it('handles checkbox click correctly', () => { + const checkbox = screen.getByLabelText('Select/unselect all items for movement'); + userEvent.click(checkbox); + expect(checkbox).toBeChecked(); + }); + it('calls onClick handler when clicked', () => { + const { container } = renderWithIntl(, translations); + const headerButton = container.querySelector('#list-items-holdingsRecordId1-clickable-list-column-status'); + expect(headerButton).toBeInTheDocument(); + userEvent.click(headerButton); + }); +}); - it('should display "inactive" by a location if applicable', () => { - expect(screen.queryByText('Inactive')).toBeInTheDocument(); +describe('ItemsList - isFetching', () => { + beforeEach(async () => { + useHoldingItemsQuery.mockReturnValue({ + isFetching: true, + totalRecords: itemsFixture.length, + }); + }); + it('items should be empty array', () => { + const { container } = renderWithIntl( + + + + + + + , + translations + ); + expect(container).toBeInTheDocument(); }); }); From 658f9143a3bf59407aca5600f0b22fffa05bd4ec Mon Sep 17 00:00:00 2001 From: VSnehalatha <53073086+VSnehalatha@users.noreply.github.com> Date: Tue, 18 Jul 2023 11:18:14 +0530 Subject: [PATCH 2/2] Update ItemsList.test.js --- src/Instance/ItemsList/tests/ItemsList.test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Instance/ItemsList/tests/ItemsList.test.js b/src/Instance/ItemsList/tests/ItemsList.test.js index 80f6e1583..09c51c5c0 100644 --- a/src/Instance/ItemsList/tests/ItemsList.test.js +++ b/src/Instance/ItemsList/tests/ItemsList.test.js @@ -2,7 +2,7 @@ import React from 'react'; import { QueryClient, QueryClientProvider } from 'react-query'; import { BrowserRouter as Router } from 'react-router-dom'; import { act } from 'react-dom/test-utils'; -import userEvent from '@testing-library/user-event'; +import userEvent from '@folio/jest-config-stripes/testing-library/user-event'; import { screen } from '@folio/jest-config-stripes/testing-library/react'; import '../../../../test/jest/__mock__';