diff --git a/lib/DocumentFilter/DocumentFilterFieldArray.js b/lib/DocumentFilter/DocumentFilterFieldArray.js index d42502a0..8a826c4d 100644 --- a/lib/DocumentFilter/DocumentFilterFieldArray.js +++ b/lib/DocumentFilter/DocumentFilterFieldArray.js @@ -29,9 +29,8 @@ const DocumentFilterFieldArray = ({ <> {({ fields }) => fields.map((name, index) => { - console.log(fields) return ( - <> +
)} - +
); }) } diff --git a/lib/DocumentFilter/DocumentFilterFieldArray.test.js b/lib/DocumentFilter/DocumentFilterFieldArray.test.js index cbc2d793..455b5d36 100644 --- a/lib/DocumentFilter/DocumentFilterFieldArray.test.js +++ b/lib/DocumentFilter/DocumentFilterFieldArray.test.js @@ -1,10 +1,11 @@ import { MemoryRouter } from 'react-router-dom'; + import { waitFor } from '@folio/jest-config-stripes/testing-library/react'; -import { FieldArray } from 'react-final-form-arrays'; import { renderWithIntl, Button, TestForm } from '@folio/stripes-erm-testing'; import { translationsProperties } from '../../test/jest/helpers'; import { categoryValues } from '../../test/jest/resources'; + import DocumentFilterFieldArray from './DocumentFilterFieldArray'; const onSubmit = jest.fn(); @@ -16,10 +17,9 @@ describe('DocumentFilterFieldArray', () => { renderComponent = renderWithIntl( - , , @@ -31,39 +31,60 @@ describe('DocumentFilterFieldArray', () => { await Button('Add filter').exists(); }); - it('should display Document filter 1 when Add filter is clicked', async () => { - const { getByText } = renderComponent; - await waitFor(async () => { - await Button('Add filter').click(); + describe('clicking \'Add filter\' button', () => { + beforeEach(async () => { + await waitFor(async () => { + await Button('Add filter').click(); + }); }); - expect(getByText('Document filter 1')).toBeInTheDocument(); - }); - test('clicking the "Add filter" button should render the document filter field component', async () => { - const { getByText } = renderComponent; - await waitFor(async () => { - await Button('Add filter').click(); + it('should display Document filter 1', async () => { + const { getByText } = renderComponent; + expect(getByText('Document filter 1')).toBeInTheDocument(); }); - await waitFor(async () => { - expect(getByText('DocumentFilterField')).toBeInTheDocument(); - }); - }); - describe('adding multiple filters', () => { - it('should add multiple filters when the "Add filter" button is clicked again', async () => { - const { getByRole, getByText } = renderComponent; + it('should not render a \'Delete filter 1\' button', async () => { + const { queryByRole } = renderComponent; + await waitFor(async () => { - await Button('Add filter').click(); - await Button('Add filter').click(); + // IconButton calls not working right now + // await IconButton('Delete filter 1').absent(); + expect(queryByRole('button', { name: 'Delete filter 1' })).not.toBeInTheDocument(); }); + }); + + it('should not display Document filter 2', async () => { + const { queryByText } = renderComponent; + expect(queryByText('Document filter 2')).not.toBeInTheDocument(); + }); + + it('should render the document filter field component', async () => { + const { getByText } = renderComponent; await waitFor(async () => { + expect(getByText('DocumentFilterField')).toBeInTheDocument(); + }); + }); + + describe('clicking \'Add filter\' button again', () => { + beforeEach(async () => { + await waitFor(async () => { + await Button('Add filter').click(); + }); + }); + + it('should display Document filter 2', async () => { + const { getByText } = renderComponent; expect(getByText('Document filter 2')).toBeInTheDocument(); }); - await waitFor(async () => { - // IconButton calls not working right now - // await IconButton('Delete filter 2').exists(); - expect(getByRole('button', { name: 'Delete filter 2' })).toBeInTheDocument(); + it('should render a \'Delete filter 2\' button', async () => { + const { queryByRole } = renderComponent; + + await waitFor(async () => { + // IconButton calls not working right now + // await IconButton('Delete filter 2').exists(); + expect(queryByRole('button', { name: 'Delete filter 2' })).toBeInTheDocument(); + }); }); }); });