debian-mirror-gitlab/spec/frontend/crm/contact_form_wrapper_spec.js

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

116 lines
4.2 KiB
JavaScript
Raw Normal View History

2022-07-16 23:28:13 +05:30
import Vue from 'vue';
import VueApollo from 'vue-apollo';
2022-06-21 17:19:12 +05:30
import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
2022-07-16 23:28:13 +05:30
import waitForPromises from 'helpers/wait_for_promises';
import createMockApollo from 'helpers/mock_apollo_helper';
2022-06-21 17:19:12 +05:30
import ContactFormWrapper from '~/crm/contacts/components/contact_form_wrapper.vue';
import ContactForm from '~/crm/components/form.vue';
import getGroupContactsQuery from '~/crm/contacts/components/graphql/get_group_contacts.query.graphql';
import createContactMutation from '~/crm/contacts/components/graphql/create_contact.mutation.graphql';
import updateContactMutation from '~/crm/contacts/components/graphql/update_contact.mutation.graphql';
2022-07-16 23:28:13 +05:30
import getGroupOrganizationsQuery from '~/crm/organizations/components/graphql/get_group_organizations.query.graphql';
import { getGroupContactsQueryResponse, getGroupOrganizationsQueryResponse } from './mock_data';
2022-06-21 17:19:12 +05:30
describe('Customer relations contact form wrapper', () => {
2022-07-16 23:28:13 +05:30
Vue.use(VueApollo);
2022-06-21 17:19:12 +05:30
let wrapper;
2022-07-16 23:28:13 +05:30
let fakeApollo;
2022-06-21 17:19:12 +05:30
const findContactForm = () => wrapper.findComponent(ContactForm);
const $route = {
params: {
id: 7,
},
};
const contacts = [{ id: 'gid://gitlab/CustomerRelations::Contact/7' }];
const mountComponent = ({ isEditMode = false } = {}) => {
wrapper = shallowMountExtended(ContactFormWrapper, {
propsData: {
isEditMode,
},
provide: {
groupFullPath: 'flightjs',
groupId: 26,
},
2022-07-16 23:28:13 +05:30
apolloProvider: fakeApollo,
mocks: { $route },
2022-06-21 17:19:12 +05:30
});
};
2022-07-16 23:28:13 +05:30
beforeEach(() => {
fakeApollo = createMockApollo([
[getGroupContactsQuery, jest.fn().mockResolvedValue(getGroupContactsQueryResponse)],
[getGroupOrganizationsQuery, jest.fn().mockResolvedValue(getGroupOrganizationsQueryResponse)],
]);
});
2022-06-21 17:19:12 +05:30
afterEach(() => {
wrapper.destroy();
2022-07-16 23:28:13 +05:30
fakeApollo = null;
2022-06-21 17:19:12 +05:30
});
2022-07-16 23:28:13 +05:30
describe.each`
mode | title | successMessage | mutation | existingId
${'edit'} | ${'Edit contact'} | ${'Contact has been updated.'} | ${updateContactMutation} | ${contacts[0].id}
${'create'} | ${'New contact'} | ${'Contact has been added.'} | ${createContactMutation} | ${null}
`('in $mode mode', ({ mode, title, successMessage, mutation, existingId }) => {
2022-08-27 11:52:29 +05:30
const isEditMode = mode === 'edit';
2022-07-16 23:28:13 +05:30
beforeEach(() => {
mountComponent({ isEditMode });
2022-06-21 17:19:12 +05:30
2022-07-16 23:28:13 +05:30
return waitForPromises();
});
it('renders correct getQuery prop', () => {
expect(findContactForm().props('getQueryNodePath')).toBe('group.contacts');
2022-06-21 17:19:12 +05:30
});
2022-07-16 23:28:13 +05:30
it('renders correct mutation prop', () => {
expect(findContactForm().props('mutation')).toBe(mutation);
});
2022-06-21 17:19:12 +05:30
2022-07-16 23:28:13 +05:30
it('renders correct additionalCreateParams prop', () => {
expect(findContactForm().props('additionalCreateParams')).toMatchObject({
2022-06-21 17:19:12 +05:30
groupId: 'gid://gitlab/Group/26',
});
});
2022-07-16 23:28:13 +05:30
it('renders correct existingId prop', () => {
expect(findContactForm().props('existingId')).toBe(existingId);
});
it('renders correct fields prop', () => {
2022-08-27 11:52:29 +05:30
const fields = [
2022-07-16 23:28:13 +05:30
{ name: 'firstName', label: 'First name', required: true },
{ name: 'lastName', label: 'Last name', required: true },
{ name: 'email', label: 'Email', required: true },
{ name: 'phone', label: 'Phone' },
{
name: 'organizationId',
label: 'Organization',
values: [
{ text: 'No organization', value: null },
{ text: 'ABC Company', value: 'gid://gitlab/CustomerRelations::Organization/2' },
{ text: 'GitLab', value: 'gid://gitlab/CustomerRelations::Organization/3' },
{ text: 'Test Inc', value: 'gid://gitlab/CustomerRelations::Organization/1' },
],
},
{ name: 'description', label: 'Description' },
2022-08-27 11:52:29 +05:30
];
if (isEditMode) fields.push({ name: 'active', label: 'Active', required: true, bool: true });
expect(findContactForm().props('fields')).toEqual(fields);
2022-07-16 23:28:13 +05:30
});
it('renders correct title prop', () => {
expect(findContactForm().props('title')).toBe(title);
});
it('renders correct successMessage prop', () => {
expect(findContactForm().props('successMessage')).toBe(successMessage);
});
2022-06-21 17:19:12 +05:30
});
});