From 67d619f9cc8faece8a7d9302a5552d47b789c613 Mon Sep 17 00:00:00 2001
From: Marliana Lara <mlara@redhat.com>
Date: Tue, 25 Jun 2019 10:52:37 -0400
Subject: [PATCH] Add template edit and form tests

---
 .../TemplateEdit/TemplateEdit.test.jsx        | 62 ++++++++++++
 .../TemplateList/TemplatesList.test.jsx       |  2 +-
 .../Template/shared/TemplateForm.test.jsx     | 99 +++++++++++++++++++
 3 files changed, 162 insertions(+), 1 deletion(-)
 create mode 100644 src/screens/Template/TemplateEdit/TemplateEdit.test.jsx
 create mode 100644 src/screens/Template/shared/TemplateForm.test.jsx

diff --git a/src/screens/Template/TemplateEdit/TemplateEdit.test.jsx b/src/screens/Template/TemplateEdit/TemplateEdit.test.jsx
new file mode 100644
index 0000000000..e4e8d2b51f
--- /dev/null
+++ b/src/screens/Template/TemplateEdit/TemplateEdit.test.jsx
@@ -0,0 +1,62 @@
+import React from 'react';
+import { JobTemplatesAPI } from '@api';
+import { mountWithContexts } from '@testUtils/enzymeHelpers';
+import TemplateEdit from './TemplateEdit';
+
+jest.mock('@api');
+
+describe('<TemplateEdit />', () => {
+  const mockData = {
+    id: 1,
+    name: 'Foo',
+    description: 'Bar',
+    job_type: 'run',
+    inventory: 2,
+    project: 3,
+    playbook: 'Baz',
+    type: 'job_template'
+  };
+
+  test('initially renders successfully', () => {
+    mountWithContexts(
+      <TemplateEdit
+        template={mockData}
+        hasPermissions
+      />
+    );
+  });
+
+  test('handleSubmit should call api update', () => {
+    const wrapper = mountWithContexts(
+      <TemplateEdit
+        template={mockData}
+        hasPermissions
+      />
+    );
+    const updatedTemplateData = {
+      name: 'new name',
+      description: 'new description',
+      job_type: 'check',
+    };
+
+    wrapper.find('TemplateForm').prop('handleSubmit')(updatedTemplateData);
+    expect(JobTemplatesAPI.update).toHaveBeenCalledWith(1, updatedTemplateData);
+  });
+
+  test('should navigate to job template detail when cancel is clicked', () => {
+    const history = {
+      push: jest.fn(),
+    };
+    const wrapper = mountWithContexts(
+      <TemplateEdit
+        template={mockData}
+        hasPermissions
+      />,
+      { context: { router: { history } } }
+    );
+
+    expect(history.push).not.toHaveBeenCalled();
+    wrapper.find('button[aria-label="Cancel"]').prop('onClick')();
+    expect(history.push).toHaveBeenCalledWith('/templates/job_template/1/details');
+  });
+});
diff --git a/src/screens/Template/TemplateList/TemplatesList.test.jsx b/src/screens/Template/TemplateList/TemplatesList.test.jsx
index 6d34913b2f..0230102f9a 100644
--- a/src/screens/Template/TemplateList/TemplatesList.test.jsx
+++ b/src/screens/Template/TemplateList/TemplatesList.test.jsx
@@ -80,7 +80,7 @@ describe('<TemplatesList />', () => {
     jest.clearAllMocks();
   });
 
-  test('initially renders succesfully', () => {
+  test('initially renders successfully', () => {
     mountWithContexts(
       <TemplatesList
         match={{ path: '/templates', url: '/templates' }}
diff --git a/src/screens/Template/shared/TemplateForm.test.jsx b/src/screens/Template/shared/TemplateForm.test.jsx
new file mode 100644
index 0000000000..3631dc7879
--- /dev/null
+++ b/src/screens/Template/shared/TemplateForm.test.jsx
@@ -0,0 +1,99 @@
+import React from 'react';
+import { mountWithContexts } from '@testUtils/enzymeHelpers';
+import { sleep } from '@testUtils/testUtils';
+import TemplateForm from './TemplateForm';
+
+jest.mock('@api');
+
+describe('<TemplateForm />', () => {
+  const mockData = {
+    id: 1,
+    name: 'Foo',
+    description: 'Bar',
+    job_type: 'run',
+    inventory: 2,
+    project: 3,
+    playbook: 'Baz',
+    type: 'job_template'
+  };
+
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  test('initially renders successfully', () => {
+    mountWithContexts(
+      <TemplateForm
+        template={mockData}
+        handleSubmit={jest.fn()}
+        handleCancel={jest.fn()}
+      />
+    );
+  });
+
+  test('should update form values on input changes', () => {
+    const wrapper = mountWithContexts(
+      <TemplateForm
+        template={mockData}
+        handleSubmit={jest.fn()}
+        handleCancel={jest.fn()}
+      />
+    );
+
+    const form = wrapper.find('Formik');
+    wrapper.find('input#template-name').simulate('change', {
+      target: { value: 'new foo', name: 'name' }
+    });
+    expect(form.state('values').name).toEqual('new foo');
+    wrapper.find('input#template-description').simulate('change', {
+      target: { value: 'new bar', name: 'description' }
+    });
+    expect(form.state('values').description).toEqual('new bar');
+    wrapper.find('AnsibleSelect[name="job_type"]').simulate('change', {
+      target: { value: 'new job type', name: 'job_type' }
+    });
+    expect(form.state('values').job_type).toEqual('new job type');
+    wrapper.find('input#template-inventory').simulate('change', {
+      target: { value: 3, name: 'inventory' }
+    });
+    expect(form.state('values').inventory).toEqual(3);
+    wrapper.find('input#template-project').simulate('change', {
+      target: { value: 4, name: 'project' }
+    });
+    expect(form.state('values').project).toEqual(4);
+    wrapper.find('input#template-playbook').simulate('change', {
+      target: { value: 'new baz type', name: 'playbook' }
+    });
+    expect(form.state('values').playbook).toEqual('new baz type');
+  });
+
+  test('should call handleSubmit when Submit button is clicked', async () => {
+    const handleSubmit = jest.fn();
+    const wrapper = mountWithContexts(
+      <TemplateForm
+        template={mockData}
+        handleSubmit={handleSubmit}
+        handleCancel={jest.fn()}
+      />
+    );
+
+    expect(handleSubmit).not.toHaveBeenCalled();
+    wrapper.find('button[aria-label="Save"]').simulate('click');
+    await sleep(1);
+    expect(handleSubmit).toBeCalled();
+  });
+
+  test('should call handleCancel when Cancel button is clicked', () => {
+    const handleCancel = jest.fn();
+    const wrapper = mountWithContexts(
+      <TemplateForm
+        template={mockData}
+        handleSubmit={jest.fn()}
+        handleCancel={handleCancel}
+      />
+    );
+    expect(handleCancel).not.toHaveBeenCalled();
+    wrapper.find('button[aria-label="Cancel"]').prop('onClick')();
+    expect(handleCancel).toBeCalled();
+  });
+});