From fb0c82598f0e007d68fa3d2acfe9fb854d371ecd Mon Sep 17 00:00:00 2001 From: Marliana Lara Date: Wed, 3 Jul 2019 16:54:40 -0400 Subject: [PATCH] Address PR feedback --- .../JobTemplateAdd/JobTemplateAdd.jsx | 8 +- .../JobTemplateAdd/JobTemplateAdd.test.jsx | 77 ++++++++++++++++--- .../Template/shared/JobTemplateForm.jsx | 4 +- awx/ui_next/src/types.js | 14 +++- 4 files changed, 85 insertions(+), 18 deletions(-) diff --git a/awx/ui_next/src/screens/Template/JobTemplateAdd/JobTemplateAdd.jsx b/awx/ui_next/src/screens/Template/JobTemplateAdd/JobTemplateAdd.jsx index 451d6ea832..5c738a942d 100644 --- a/awx/ui_next/src/screens/Template/JobTemplateAdd/JobTemplateAdd.jsx +++ b/awx/ui_next/src/screens/Template/JobTemplateAdd/JobTemplateAdd.jsx @@ -14,13 +14,13 @@ import JobTemplateForm from '../shared/JobTemplateForm'; import { JobTemplatesAPI } from '@api'; function JobTemplateAdd({ history, i18n }) { - const [error, setError] = useState(''); + const [error, setError] = useState(null); const handleSubmit = async values => { + setError(null); try { - const data = await JobTemplatesAPI.create(values); - const { response } = data; - history.push(`/templates/${response.type}/${response.id}/details`); + const { data } = await JobTemplatesAPI.create(values); + history.push(`/templates/${data.type}/${data.id}/details`); } catch (err) { setError(err); } diff --git a/awx/ui_next/src/screens/Template/JobTemplateAdd/JobTemplateAdd.test.jsx b/awx/ui_next/src/screens/Template/JobTemplateAdd/JobTemplateAdd.test.jsx index e4b794a2f0..74dc133dc8 100644 --- a/awx/ui_next/src/screens/Template/JobTemplateAdd/JobTemplateAdd.test.jsx +++ b/awx/ui_next/src/screens/Template/JobTemplateAdd/JobTemplateAdd.test.jsx @@ -1,17 +1,18 @@ import React from 'react'; import { mountWithContexts } from '@testUtils/enzymeHelpers'; import JobTemplateAdd from './JobTemplateAdd'; +import { JobTemplatesAPI } from '../../../api'; jest.mock('@api'); describe('', () => { const defaultProps = { description: '', - inventory: 0, + inventory: '', job_type: 'run', name: '', playbook: '', - project: 0, + project: '', }; afterEach(() => { @@ -25,26 +26,84 @@ describe('', () => { test('should render Job Template Form with default values', () => { const wrapper = mountWithContexts(); - expect(wrapper.find('input#template-description').props().value).toBe( + expect(wrapper.find('input#template-description').text()).toBe( defaultProps.description ); - expect(wrapper.find('input#template-inventory').props().value).toBe( + expect(wrapper.find('input#template-inventory').text()).toBe( defaultProps.inventory ); expect(wrapper.find('AnsibleSelect[name="job_type"]').props().value).toBe( defaultProps.job_type ); - expect(wrapper.find('input#template-name').props().value).toBe( - defaultProps.name - ); - expect(wrapper.find('input#template-playbook').props().value).toBe( + expect( + wrapper + .find('AnsibleSelect[name="job_type"]') + .containsAllMatchingElements([ + , + , + , + ]) + ).toEqual(true); + expect(wrapper.find('input#template-name').text()).toBe(defaultProps.name); + expect(wrapper.find('input#template-playbook').text()).toBe( defaultProps.playbook ); - expect(wrapper.find('input#template-project').props().value).toBe( + expect(wrapper.find('input#template-project').text()).toBe( defaultProps.project ); }); + test('handleSubmit should post to api', async done => { + const jobTemplateData = { + description: 'Baz', + inventory: 1, + job_type: 'run', + name: 'Foo', + playbook: 'Bar', + project: 2, + }; + JobTemplatesAPI.create.mockResolvedValueOnce({ + data: { + id: 1, + ...jobTemplateData, + }, + }); + const wrapper = mountWithContexts(); + await wrapper.find('JobTemplateForm').prop('handleSubmit')(jobTemplateData); + expect(JobTemplatesAPI.create).toHaveBeenCalledWith(jobTemplateData); + done(); + }); + + test('should navigate to job template detail after form submission', async done => { + const history = { + push: jest.fn(), + }; + const jobTemplateData = { + description: 'Baz', + inventory: 1, + job_type: 'run', + name: 'Foo', + playbook: 'Bar', + project: 2, + }; + JobTemplatesAPI.create.mockResolvedValueOnce({ + data: { + id: 1, + type: 'job_template', + ...jobTemplateData, + }, + }); + const wrapper = mountWithContexts(, { + context: { router: { history } }, + }); + + await wrapper.find('JobTemplateForm').prop('handleSubmit')(jobTemplateData); + expect(history.push).toHaveBeenCalledWith( + '/templates/job_template/1/details' + ); + done(); + }); + test('should navigate to templates list when cancel is clicked', () => { const history = { push: jest.fn(), diff --git a/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx b/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx index deac1ee9b7..1ff5179a25 100644 --- a/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx +++ b/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx @@ -29,9 +29,9 @@ class JobTemplateForm extends Component { template: { name: '', description: '', - inventory: 0, + inventory: '', job_type: 'run', - project: 0, + project: '', playbook: '', }, }; diff --git a/awx/ui_next/src/types.js b/awx/ui_next/src/types.js index 0681fe3c48..ada500bc0c 100644 --- a/awx/ui_next/src/types.js +++ b/awx/ui_next/src/types.js @@ -1,4 +1,12 @@ -import { shape, arrayOf, number, string, bool, oneOf } from 'prop-types'; +import { + shape, + arrayOf, + number, + string, + bool, + oneOf, + oneOfType, +} from 'prop-types'; export const Role = shape({ descendent_roles: arrayOf(string), @@ -57,8 +65,8 @@ export const QSConfig = shape({ export const JobTemplate = shape({ name: string.isRequired, description: string, - inventory: number.isRequired, + inventory: oneOfType([number, string]).isRequired, job_type: oneOf(['run', 'check']), playbook: string.isRequired, - project: number.isRequired, + project: oneOfType([number, string]).isRequired, });