Puts webhook key on the template object in WFJTEdit

Also adds aria-label to Label Select Options to improve test matchers
 Improves the name of the template payload in WFJTAdd and WFJTEdit
 Updates tests including a failing snapshot DeleteConfirmationModal
 test that was failing in devel
This commit is contained in:
Alex Corey
2020-04-13 14:39:52 -04:00
parent 27e6c2d47d
commit 440691387b
13 changed files with 38 additions and 53 deletions

View File

@@ -288,8 +288,6 @@ describe('<ProjectForm />', () => {
});
await waitForElement(wrapper, 'ContentLoading', el => el.length === 0);
console.log(wrapper.debug());
const scmTypeSelect = wrapper.find(
'FormGroup[label="Source Control Credential Type"] FormSelect'
);

View File

@@ -35,7 +35,7 @@ const mockJobTemplate = {
limit: '',
name: 'Foo',
playbook: 'Baz',
project: { id: 3, summary_fields: { organization: { id: 1 } } },
project: 3,
scm_branch: '',
skip_tags: '',
summary_fields: {

View File

@@ -32,7 +32,6 @@ class WorkflowJobTemplate extends Component {
contentError: null,
hasContentLoading: true,
template: null,
webhook_key: null,
isNotifAdmin: false,
};
this.createSchedule = this.createSchedule.bind(this);
@@ -59,11 +58,9 @@ class WorkflowJobTemplate extends Component {
this.setState({ contentError: null });
try {
const { data } = await WorkflowJobTemplatesAPI.readDetail(id);
let webhookKey;
if (data?.related?.webhook_key) {
const {
data: { webhook_key },
} = await WorkflowJobTemplatesAPI.readWebhookKey(id);
this.setState({ webhook_key });
webhookKey = await WorkflowJobTemplatesAPI.readWebhookKey(id);
}
if (data?.summary_fields?.webhook_credential) {
const {
@@ -83,7 +80,7 @@ class WorkflowJobTemplate extends Component {
});
setBreadcrumb(data);
this.setState({
template: data,
template: { ...data, webhook_key: webhookKey.data.webhook_key },
isNotifAdmin: notifAdminRes.data.results.length > 0,
});
} catch (err) {
@@ -114,7 +111,6 @@ class WorkflowJobTemplate extends Component {
contentError,
hasContentLoading,
template,
webhook_key,
isNotifAdmin,
} = this.state;
@@ -211,10 +207,7 @@ class WorkflowJobTemplate extends Component {
key="wfjt-details"
path="/templates/workflow_job_template/:id/details"
>
<WorkflowJobTemplateDetail
template={template}
webhook_key={webhook_key}
/>
<WorkflowJobTemplateDetail template={template} />
</Route>
)}
{template && (
@@ -239,10 +232,7 @@ class WorkflowJobTemplate extends Component {
key="wfjt-edit"
path="/templates/workflow_job_template/:id/edit"
>
<WorkflowJobTemplateEdit
template={template}
webhook_key={webhook_key}
/>
<WorkflowJobTemplateEdit template={template} />
</Route>
)}
{template && (

View File

@@ -17,18 +17,18 @@ function WorkflowJobTemplateAdd() {
inventory,
organization,
webhook_credential,
webhookKey,
...remainingValues
webhook_key,
...templatePayload
} = values;
remainingValues.inventory = inventory?.id;
remainingValues.organization = organization?.id;
remainingValues.webhook_credential = webhook_credential?.id;
templatePayload.inventory = inventory?.id;
templatePayload.organization = organization?.id;
templatePayload.webhook_credential = webhook_credential?.id;
const organizationId =
organization?.id || inventory?.summary_fields?.organization.id || null;
organization?.id || inventory?.summary_fields?.organization.id;
try {
const {
data: { id },
} = await WorkflowJobTemplatesAPI.create(remainingValues);
} = await WorkflowJobTemplatesAPI.create(templatePayload);
await Promise.all(await submitLabels(id, labels, organizationId));
history.push(`/templates/workflow_job_template/${id}/details`);
} catch (err) {

View File

@@ -85,8 +85,7 @@ describe('<WorkflowJobTemplateAdd/>', () => {
act(() => {
wrapper
.find('SelectOption')
.find('button')
.at(2)
.find('button[aria-label="Label 3"]')
.prop('onClick')();
});

View File

@@ -25,7 +25,7 @@ import LaunchButton from '@components/LaunchButton';
import Sparkline from '@components/Sparkline';
import { toTitleCase } from '@util/strings';
function WorkflowJobTemplateDetail({ template, i18n, webhook_key }) {
function WorkflowJobTemplateDetail({ template, i18n }) {
const {
id,
ask_inventory_on_launch,
@@ -38,6 +38,7 @@ function WorkflowJobTemplateDetail({ template, i18n, webhook_key }) {
summary_fields,
related,
webhook_credential,
webhook_key,
} = template;
const urlOrigin = window.location.origin;

View File

@@ -39,6 +39,7 @@ describe('<WorkflowJobTemplateDetail/>', () => {
user_capabilities: { edit: true, delete: true },
},
webhook_service: 'Github',
webhook_key: 'Foo webhook key',
};
beforeEach(async () => {
@@ -52,7 +53,6 @@ describe('<WorkflowJobTemplateDetail/>', () => {
component={() => (
<WorkflowJobTemplateDetail
template={template}
webhook_key="Foo webhook key"
hasContentLoading={false}
onSetContentLoading={() => {}}
/>

View File

@@ -6,7 +6,7 @@ import { getAddedAndRemoved } from '@util/lists';
import { WorkflowJobTemplatesAPI, OrganizationsAPI } from '@api';
import { WorkflowJobTemplateForm } from '../shared';
function WorkflowJobTemplateEdit({ template, webhook_key }) {
function WorkflowJobTemplateEdit({ template }) {
const history = useHistory();
const [formSubmitError, setFormSubmitError] = useState(null);
@@ -16,12 +16,12 @@ function WorkflowJobTemplateEdit({ template, webhook_key }) {
inventory,
organization,
webhook_credential,
webhookKey,
...remainingValues
webhook_key,
...templatePayload
} = values;
remainingValues.inventory = inventory?.id;
remainingValues.organization = organization?.id;
remainingValues.webhook_credential = webhook_credential?.id || null;
templatePayload.inventory = inventory?.id;
templatePayload.organization = organization?.id;
templatePayload.webhook_credential = webhook_credential?.id || null;
const formOrgId =
organization?.id || inventory?.summary_fields?.organization.id || null;
@@ -29,7 +29,7 @@ function WorkflowJobTemplateEdit({ template, webhook_key }) {
await Promise.all(
await submitLabels(labels, formOrgId, template.organization)
);
await WorkflowJobTemplatesAPI.update(template.id, remainingValues);
await WorkflowJobTemplatesAPI.update(template.id, templatePayload);
history.push(`/templates/workflow_job_template/${template.id}/details`);
} catch (err) {
setFormSubmitError(err);
@@ -73,7 +73,6 @@ function WorkflowJobTemplateEdit({ template, webhook_key }) {
handleSubmit={handleSubmit}
handleCancel={handleCancel}
template={template}
webhookKey={webhook_key}
submitError={formSubmitError}
/>
</CardBody>

View File

@@ -100,8 +100,7 @@ describe('<WorkflowJobTemplateEdit/>', () => {
act(() => {
wrapper
.find('SelectOption')
.find('button')
.at(2)
.find('button[aria-label="Label 3"]')
.prop('onClick')();
});
@@ -110,8 +109,7 @@ describe('<WorkflowJobTemplateEdit/>', () => {
act(() =>
wrapper
.find('SelectOption')
.find('button')
.at(0)
.find('button[aria-label="Label 1"]')
.prop('onClick')()
);

View File

@@ -14,7 +14,7 @@ describe('<JobTemplateForm />', () => {
description: 'Bar',
job_type: 'run',
inventory: 2,
project: { id: 3, summary_fields: { organization: { id: 1 } } },
project: 3,
playbook: 'Baz',
type: 'job_template',
scm_branch: 'Foo',

View File

@@ -47,7 +47,7 @@ function LabelSelect({ value, placeholder, onChange, onError }) {
const renderOptions = opts => {
return opts.map(option => (
<SelectOption key={option.id} value={option}>
<SelectOption key={option.id} aria-label={option.name} value={option}>
{option.name}
</SelectOption>
));

View File

@@ -1,6 +1,6 @@
import React, { useState, useEffect, useCallback } from 'react';
import { t } from '@lingui/macro';
import { useRouteMatch, useParams, withRouter } from 'react-router-dom';
import { useRouteMatch, useParams } from 'react-router-dom';
import PropTypes, { shape } from 'prop-types';
@@ -67,7 +67,7 @@ function WorkflowJobTemplateForm({
] = useField('webhook_service');
const [webhookKeyField, webhookKeyMeta, webhookKeyHelpers] = useField(
'webhookKey'
'webhook_key'
);
const [hasWebhooks, setHasWebhooks] = useState(
@@ -339,7 +339,7 @@ function WorkflowJobTemplateForm({
fieldId="wfjt-webhook-key"
type="text"
id="wfjt-webhook-key"
name="webhookKey"
name="webhook_key"
label={i18n._(t`Webhook Key`)}
>
<FieldTooltip
@@ -397,7 +397,7 @@ WorkflowJobTemplateForm.defaultProps = {
};
const FormikApp = withFormik({
mapPropsToValues({ template = {}, webhookKey }) {
mapPropsToValues({ template = {} }) {
return {
name: template.name || '',
description: template.description || '',
@@ -417,7 +417,7 @@ const FormikApp = withFormik({
webhook_url: template?.related?.webhook_receiver
? `${urlOrigin}${template.related.webhook_receiver}`
: '',
webhookKey: webhookKey || null,
webhook_key: template.webhook_key || '',
};
},
handleSubmit: async (values, { props, setErrors }) => {
@@ -430,4 +430,4 @@ const FormikApp = withFormik({
})(WorkflowJobTemplateForm);
export { WorkflowJobTemplateForm as _WorkflowJobTemplateForm };
export default withI18n()(withRouter(FormikApp));
export default withI18n()(FormikApp);

View File

@@ -40,6 +40,7 @@ describe('<WorkflowJobTemplateForm/>', () => {
related: {
webhook_receiver: '/api/v2/workflow_job_templates/57/gitlab/',
},
webhook_key: 'sdfghjklmnbvcdsew435678iokjhgfd',
};
beforeEach(async () => {
@@ -74,7 +75,6 @@ describe('<WorkflowJobTemplateForm/>', () => {
template={mockTemplate}
handleCancel={handleCancel}
handleSubmit={handleSubmit}
webhookKey="sdfghjklmnbvcdsew435678iokjhgfd"
/>
)}
/>,
@@ -172,7 +172,7 @@ describe('<WorkflowJobTemplateForm/>', () => {
test('webhooks and enable concurrent jobs functions properly', async () => {
act(() => {
wrapper.find('Checkbox[aria-label="Enable Webhooks"]').invoke('onChange')(
wrapper.find('Checkbox[aria-label="Enable Webhook"]').invoke('onChange')(
true,
{
currentTarget: { value: true, type: 'change', checked: true },
@@ -181,7 +181,7 @@ describe('<WorkflowJobTemplateForm/>', () => {
});
wrapper.update();
expect(
wrapper.find('Checkbox[aria-label="Enable Webhooks"]').prop('isChecked')
wrapper.find('Checkbox[aria-label="Enable Webhook"]').prop('isChecked')
).toBe(true);
expect(
@@ -192,7 +192,7 @@ describe('<WorkflowJobTemplateForm/>', () => {
).toBe('sdfghjklmnbvcdsew435678iokjhgfd');
await act(() =>
wrapper
.find('FormGroup[name="webhookKey"]')
.find('FormGroup[name="webhook_key"]')
.find('Button[variant="tertiary"]')
.prop('onClick')()
);