tests: add test coverages

Author: alisher-epam

lib/PrivilegedDonorContacts/PrivilegedDonorContacts.test.js

@@ -0,0 +1,75 @@
+import { MemoryRouter } from 'react-router-dom';
+import { render, screen } from '@testing-library/react';
+import user from '@testing-library/user-event';
+
+import stripesFinalForm from '@folio/stripes/final-form';
+
+import { useFetchPrivilegedContacts } from './hooks';
+import { PrivilegedDonorContacts } from './PrivilegedDonorContacts';
+
+jest.mock('./hooks', () => ({
+  useFetchPrivilegedContacts: jest.fn(),
+  useCategories: jest.fn().mockReturnValue({ categories: [] }),
+}));
+
+jest.mock('./PrivilegedDonorContactsLookup', () => ({
+  PrivilegedDonorContactsLookup: jest.fn(({ onAddContacts }) => (
+    <button
+      type="button"
+      onClick={() => onAddContacts([{ id: 'donorId' }])}
+    >
+      Add donor
+    </button>
+  )),
+}));
+
+const mockOnChange = jest.fn();
+
+const renderForm = (props = {}) => (
+  <form>
+    <PrivilegedDonorContacts
+      name="privilegedDonorContacts"
+      privilegedContactIds={['1']}
+      onChange={mockOnChange}
+      contacts={[]}
+      fields={{ value: [], push: jest.fn() }}
+      {...props}
+    />
+    <button type="submit">Submit</button>
+  </form>
+);
+
+const FormCmpt = stripesFinalForm({})(renderForm);
+
+const renderComponent = (props = {}) => (render(
+  <MemoryRouter>
+    <FormCmpt onSubmit={() => { }} {...props} />
+  </MemoryRouter>,
+));
+
+describe('PrivilegedDonorContacts', () => {
+  beforeEach(() => {
+    useFetchPrivilegedContacts.mockClear().mockReturnValue({
+      contacts: [],
+      isLoading: false,
+    });
+  });
+
+  it('should render component', () => {
+    renderComponent();
+
+    expect(screen.getByText('stripes-components.tableEmpty')).toBeDefined();
+  });
+
+  it('should call onChange when contactIds changed', () => {
+    const onChange = jest.fn();
+
+    renderComponent({ onChange });
+
+    const addDonorButton = screen.getByText('Add donor');
+
+    user.click(addDonorButton);
+
+    expect(onChange).toHaveBeenCalled();
+  });
+});

lib/PrivilegedDonorContacts/PrivilegedDonorContactsContainer.test.js

@@ -0,0 +1,119 @@
+import { MemoryRouter } from 'react-router-dom';
+import { render, screen } from '@testing-library/react';
+import user from '@testing-library/user-event';
+
+import stripesFinalForm from '@folio/stripes/final-form';
+
+import { PrivilegedDonorContactsContainer } from './PrivilegedDonorContactsContainer';
+import { useCategories } from './hooks';
+
+const mockVendor = { id: '1', name: 'Amazon' };
+
+jest.mock('./PrivilegedDonorContactsList', () => ({
+  PrivilegedDonorContactsList: jest.fn(({ contentData }) => {
+    return (
+      <div>
+        {contentData.map(({ name }) => (
+          <div key={name}>{name}</div>
+        ))}
+      </div>
+    );
+  }),
+}));
+
+jest.mock('./PrivilegedDonorContactsLookup', () => ({
+  PrivilegedDonorContactsLookup: jest.fn(({ onAddContacts }) => {
+    return (
+      <div>
+        <button
+          type="button"
+          onClick={() => onAddContacts([mockVendor])}
+        >
+          Add donor
+        </button>
+      </div>
+    );
+  }),
+}));
+
+const setContactIds = jest.fn();
+
+jest.mock('./hooks', () => ({
+  useCategories: jest.fn().mockReturnValue({
+    categories: [],
+    isLoading: false,
+  }),
+}));
+
+const defaultProps = {
+  columnMapping: {},
+  columnWidths: {},
+  contacts: [],
+  fields: {
+    value: [
+      '1',
+      '2',
+    ],
+  },
+  formatter: {},
+  id: 'donors',
+  setContactIds,
+  searchLabel: 'Search',
+  showTriggerButton: true,
+  visibleColumns: ['name'],
+};
+
+const renderForm = (props = {}) => (
+  <form>
+    <PrivilegedDonorContactsContainer
+      {...defaultProps}
+      {...props}
+    />
+    <button type="submit">Submit</button>
+  </form>
+);
+
+const FormCmpt = stripesFinalForm({})(renderForm);
+
+const renderComponent = (props = {}) => (render(
+  <MemoryRouter>
+    <FormCmpt onSubmit={() => { }} {...props} />
+  </MemoryRouter>,
+));
+
+describe('DonorsContainer', () => {
+  beforeEach(() => {
+    useCategories.mockClear().mockReturnValue({
+      donors: [],
+      isLoading: false,
+    });
+  });
+
+  it('should render component', () => {
+    renderComponent();
+
+    expect(screen.getByText('Add donor')).toBeDefined();
+  });
+
+  it('should call `setContactIds` when `onAddContacts` is called', () => {
+    renderComponent({
+      donors: [mockVendor],
+      fields: {
+        value: [],
+        push: jest.fn(),
+      },
+    });
+
+    const addDonorsButton = screen.getByText('Add donor');
+
+    expect(addDonorsButton).toBeDefined();
+    user.click(addDonorsButton);
+    expect(setContactIds).toHaveBeenCalled();
+  });
+
+  it('should not render `DonorsLookup` when `showTriggerButton` is false', () => {
+    renderComponent({ showTriggerButton: false });
+
+    expect(screen.queryByText('Add donor')).toBeNull();
+  });
+});

lib/PrivilegedDonorContacts/PrivilegedDonorContactsList.test.js

@@ -0,0 +1,50 @@
+import { MemoryRouter } from 'react-router-dom';
+import { render, screen } from '@testing-library/react';
+
+import { PrivilegedDonorContactsList } from './PrivilegedDonorContactsList';
+
+jest.mock('./hooks', () => ({
+  useCategories: jest.fn().mockReturnValue({
+    categories: [],
+    isLoading: false,
+  }),
+}));
+
+const defaultProps = {
+  contentData: [],
+  id: 'donors',
+};
+
+const wrapper = ({ children }) => (
+  <MemoryRouter>
+    {children}
+  </MemoryRouter>
+);
+
+const renderComponent = (props = {}) => (render(
+  <PrivilegedDonorContactsList
+    {...defaultProps}
+    {...props}
+  />,
+  { wrapper },
+));
+
+describe('PrivilegedDonorContactsList', () => {
+  it('should render component', () => {
+    renderComponent();
+
+    expect(screen.getByText('stripes-components.tableEmpty')).toBeDefined();
+  });
+
+  it('should render the list of donor contacts', () => {
+    renderComponent({
+      contentData: [
+        { id: '1', firstName: 'John', lastName: 'Smith' },
+        { id: '2', firstName: 'Tim', lastName: 'Jones' },
+      ],
+    });
+
+    expect(screen.getByText('Jones, Tim')).toBeDefined();
+    expect(screen.getByText('Smith, John')).toBeDefined();
+  });
+});

lib/PrivilegedDonorContacts/PrivilegedDonorContactsListContainer.test.js

@@ -0,0 +1,58 @@
+import { MemoryRouter } from 'react-router-dom';
+import { render, screen } from '@testing-library/react';
+
+import { PrivilegedDonorsListContainer } from './PrivilegedDonorContactsListContainer';
+import { useFetchPrivilegedContacts } from './hooks';
+
+jest.mock('@folio/stripes/components', () => ({
+  ...jest.requireActual('@folio/stripes/components'),
+  Loading: jest.fn(() => 'Loading'),
+}));
+
+jest.mock('./PrivilegedDonorContactsList', () => ({
+  PrivilegedDonorContactsList: jest.fn(() => 'PrivilegedDonorContactsList'),
+}));
+
+jest.mock('./hooks', () => ({
+  useFetchPrivilegedContacts: jest.fn().mockReturnValue({
+    contacts: [],
+    isLoading: false,
+  }),
+}));
+
+const defaultProps = {
+  donorOrganizationIds: [],
+};
+
+const wrapper = ({ children }) => (
+  <MemoryRouter>
+    {children}
+  </MemoryRouter>
+);
+
+const renderComponent = (props = {}) => (render(
+  <PrivilegedDonorsListContainer
+    {...defaultProps}
+    {...props}
+  />,
+  { wrapper },
+));
+
+describe('PrivilegedDonorsListContainer', () => {
+  it('should render component', () => {
+    renderComponent();
+
+    expect(screen.getByText('PrivilegedDonorContactsList')).toBeDefined();
+  });
+
+  it('should render loading component', () => {
+    useFetchPrivilegedContacts.mockClear().mockReturnValue({
+      contacts: [],
+      isLoading: true,
+    });
+
+    renderComponent();
+
+    expect(screen.getByText('Loading')).toBeDefined();
+  });
+});

lib/PrivilegedDonorContacts/PrivilegedDonorContactsLookup.test.js

@@ -0,0 +1,48 @@
+import { render, screen } from '@testing-library/react';
+import user from '@testing-library/user-event';
+
+import { PrivilegedDonorContactsLookup } from './PrivilegedDonorContactsLookup';
+
+const mockContactData = { id: '1', name: 'Amazon' };
+
+jest.mock('@folio/stripes/core', () => ({
+  ...jest.requireActual('@folio/stripes/core'),
+  Pluggable: jest.fn(({ children, ...rest }) => {
+    return (
+      <div>
+        {children}
+        <button
+          type="button"
+          id={rest?.name}
+          onClick={() => rest?.addContacts([mockContactData])}
+        >
+          Add donor
+        </button>
+      </div>
+    );
+  }),
+}));
+
+const mockOnAddContacts = jest.fn();
+
+const defaultProps = {
+  onAddContacts: mockOnAddContacts,
+  name: 'donors',
+};
+
+const renderComponent = (props = defaultProps) => (render(
+  <PrivilegedDonorContactsLookup {...props} />,
+));
+
+describe('PrivilegedDonorContactsLookup', () => {
+  it('should render component', () => {
+    renderComponent();
+
+    const addDonorsButton = screen.getByText('Add donor');
+
+    expect(addDonorsButton).toBeDefined();
+
+    user.click(addDonorsButton);
+    expect(mockOnAddContacts).toHaveBeenCalledWith([mockContactData]);
+  });
+});