From 8c6de0d734d1bc11aa5bc8d2d543a414fa8cbbec Mon Sep 17 00:00:00 2001
From: Zak Burke <zburke@ebsco.com>
Date: Thu, 13 Oct 2022 14:06:21 -0400
Subject: [PATCH] UIU-2430 test UserForm

Test validation function.

Refs UIU-2430
---
 src/views/UserEdit/UserForm.js               |   2 +-
 src/views/UserEdit/UserForm.test.js          | 112 +++++++++++++++++++
 test/jest/__mock__/stripesComponents.mock.js |   5 +
 3 files changed, 118 insertions(+), 1 deletion(-)
 create mode 100644 src/views/UserEdit/UserForm.test.js

diff --git a/src/views/UserEdit/UserForm.js b/src/views/UserEdit/UserForm.js
index e28d9bf72..cb848ed85 100644
--- a/src/views/UserEdit/UserForm.js
+++ b/src/views/UserEdit/UserForm.js
@@ -43,7 +43,7 @@ import getProxySponsorWarning from '../../components/util/getProxySponsorWarning
 
 import css from './UserForm.css';
 
-function validate(values) {
+export function validate(values) {
   const errors = {};
   errors.personal = {};
 
diff --git a/src/views/UserEdit/UserForm.test.js b/src/views/UserEdit/UserForm.test.js
new file mode 100644
index 000000000..214ab03b8
--- /dev/null
+++ b/src/views/UserEdit/UserForm.test.js
@@ -0,0 +1,112 @@
+import React from 'react';
+import { screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { FormattedMessage } from 'react-intl';
+
+import renderWithRouter from '../../../test/jest/helpers/renderWithRouter';
+import UserForm, { validate } from './UserForm';
+
+describe('UserForm', () => {
+  describe('validate', () => {
+    it('validates correctly-shaped data', () => {
+      const result = validate({
+        personal: {
+          lastName: 'lastName',
+          preferredContactTypeId: 'preferredContactTypeId',
+          addresses: [
+            { addressType: 'addressType' },
+          ],
+        },
+        username: 'username',
+        creds: {
+          password: 'password',
+        },
+        patronGroup: 'patronGroup',
+        servicePoints: ['a', 'b'],
+        preferredServicePoint: 'preferredServicePoint',
+      });
+
+      expect(result.personal).toMatchObject({ addresses: [{}] });
+      expect(result.personal.addresses.length).toBe(1);
+    });
+
+    describe('returns errors if required fields are missing', () => {
+      it('requires personal', () => {
+        const result = validate({});
+        expect(result.personal.lastName).toMatchObject(<FormattedMessage id="ui-users.errors.missingRequiredField" />);
+      });
+
+      it('requires personal.lastName', () => {
+        const result = validate({ personal: {} });
+        expect(result.personal.lastName).toMatchObject(<FormattedMessage id="ui-users.errors.missingRequiredField" />);
+      });
+
+      it('requires personal.preferredContactTypeId', () => {
+        const result = validate({ personal: {} });
+        expect(result.personal.preferredContactTypeId).toMatchObject(<FormattedMessage id="ui-users.errors.missingRequiredContactType" />);
+      });
+
+      it('requires username when password is present', () => {
+        const result = validate({ creds: { password: 'thunder-chicken' } });
+        expect(result.username).toMatchObject(<FormattedMessage id="ui-users.errors.missingRequiredUsername" />);
+      });
+
+      it('requires patronGroup', () => {
+        const result = validate({ });
+        expect(result.patronGroup).toMatchObject(<FormattedMessage id="ui-users.errors.missingRequiredPatronGroup" />);
+      });
+
+      it('requires personal.addresses to have an addressType', () => {
+        const result = validate({ personal: { addresses: [{ 'monkey': 'bagel' }] } });
+        expect(result.personal.addresses[0].addressType).toMatchObject(<FormattedMessage id="ui-users.errors.missingRequiredAddressType" />);
+      });
+
+      it('requires a preferred service point when service points are assigned', () => {
+        const result = validate({ servicePoints: ['a', 'b', 'c'] });
+        expect(result.preferredServicePoint).toMatchObject(<FormattedMessage id="ui-users.errors.missingRequiredPreferredServicePoint" />);
+      });
+    });
+  });
+
+  // this fails:
+  //   Element type is invalid: expected a string (for built-in components)
+  //   or a class/function (for composite components) but got: undefined.
+  //   You likely forgot to export your component from the file it's defined
+  //   in, or you might have mixed up default and named imports.
+  // not sure exactly what the problem is. Maybe we need to mock stripesFinalForm?
+  describe.skip('UserForm calls submit handler', () => {
+    const submitHandler = jest.fn();
+    const props = {
+      formData: {
+        patronGroups: [],
+      },
+      initialValues: {
+        id: 'id',
+        creds: {
+          password: 'password',
+        },
+        patronGroup: 'patronGroup',
+        personal: {
+          lastName: 'lastName',
+          preferredContactTypeId: 'preferredContactTypeId',
+          addresses: [
+            { addressType: 'addressType' },
+          ],
+        },
+        preferredServicePoint: 'preferredServicePoint',
+        servicePoints: ['a', 'b'],
+        username: 'username',
+      },
+      onCancel: jest.fn(),
+      onSubmit: jest.fn(),
+      uniquenessValidator: {
+        reset: jest.fn(),
+        GET: jest.fn(),
+      }
+    };
+
+    renderWithRouter(<UserForm {...props} />);
+    userEvent.click(screen.getByText('ui-users.saveAndClose'));
+    expect(submitHandler).toHaveBeenCalled();
+  });
+});
diff --git a/test/jest/__mock__/stripesComponents.mock.js b/test/jest/__mock__/stripesComponents.mock.js
index 8addcc56f..52b45a9c5 100644
--- a/test/jest/__mock__/stripesComponents.mock.js
+++ b/test/jest/__mock__/stripesComponents.mock.js
@@ -7,6 +7,9 @@ jest.mock('@folio/stripes/components', () => ({
   AccordionSet: jest.fn(({ children, ...rest }) => (
     <span {...rest}>{children}</span>
   )),
+  AccordionStatus: jest.fn(({ children, ...rest }) => (
+    <span {...rest}>{children}</span>
+  )),
   Badge: jest.fn((props) => (
     <span>
       <span>{props.children}</span>
@@ -160,7 +163,9 @@ jest.mock('@folio/stripes/components', () => ({
       {lastMenu ?? null}
     </div>
   )),
+  PaneHeaderIconButton: jest.fn(({ children }) => <div className="paneHeaderIconButton">{ children }</div>),
   PaneMenu: jest.fn((props) => <div>{props.children}</div>),
+  PaneSet: jest.fn((props) => <div>{props.children}</div>),
   RadioButton: jest.fn(({ label, name, ...rest }) => (
     <div>
       <label htmlFor="male">{label}</label>