2020-10-13 15:08:53 +00:00
|
|
|
import { shallowMount } from '@vue/test-utils';
|
2020-09-17 15:09:24 +00:00
|
|
|
import {
|
|
|
|
mockLabels,
|
|
|
|
mockRegularLabel,
|
|
|
|
} from 'jest/vue_shared/components/sidebar/labels_select_vue/mock_data';
|
2020-11-06 03:09:19 +00:00
|
|
|
import updateIssueLabelsMutation from '~/boards/queries/issue_set_labels.mutation.graphql';
|
|
|
|
import { MutationOperationMode } from '~/graphql_shared/utils';
|
|
|
|
import { IssuableType } from '~/issue_show/constants';
|
2020-09-17 15:09:24 +00:00
|
|
|
import SidebarLabels from '~/sidebar/components/labels/sidebar_labels.vue';
|
2020-11-06 03:09:19 +00:00
|
|
|
import updateMergeRequestLabelsMutation from '~/sidebar/queries/update_merge_request_labels.mutation.graphql';
|
|
|
|
import { toLabelGid } from '~/sidebar/utils';
|
2020-09-17 15:09:24 +00:00
|
|
|
import { DropdownVariant } from '~/vue_shared/components/sidebar/labels_select_vue/constants';
|
|
|
|
import LabelsSelect from '~/vue_shared/components/sidebar/labels_select_vue/labels_select_root.vue';
|
|
|
|
|
|
|
|
describe('sidebar labels', () => {
|
|
|
|
let wrapper;
|
|
|
|
|
|
|
|
const defaultProps = {
|
|
|
|
allowLabelCreate: true,
|
|
|
|
allowLabelEdit: true,
|
|
|
|
allowScopedLabels: true,
|
|
|
|
canEdit: true,
|
|
|
|
iid: '1',
|
|
|
|
initiallySelectedLabels: mockLabels,
|
|
|
|
issuableType: 'issue',
|
|
|
|
labelsFetchPath: '/gitlab-org/gitlab-test/-/labels.json?include_ancestor_groups=true',
|
|
|
|
labelsManagePath: '/gitlab-org/gitlab-test/-/labels',
|
|
|
|
projectIssuesPath: '/gitlab-org/gitlab-test/-/issues',
|
|
|
|
projectPath: 'gitlab-org/gitlab-test',
|
|
|
|
};
|
|
|
|
|
2020-11-06 03:09:19 +00:00
|
|
|
const $apollo = {
|
|
|
|
mutate: jest.fn().mockResolvedValue(),
|
|
|
|
};
|
|
|
|
|
|
|
|
const userUpdatedLabels = [
|
|
|
|
{
|
|
|
|
...mockRegularLabel,
|
|
|
|
set: false,
|
|
|
|
},
|
|
|
|
{
|
|
|
|
id: 40,
|
|
|
|
title: 'Security',
|
|
|
|
color: '#ddd',
|
|
|
|
text_color: '#fff',
|
|
|
|
set: true,
|
|
|
|
},
|
|
|
|
{
|
|
|
|
id: 55,
|
|
|
|
title: 'Tooling',
|
|
|
|
color: '#ddd',
|
|
|
|
text_color: '#fff',
|
|
|
|
set: false,
|
|
|
|
},
|
|
|
|
];
|
|
|
|
|
2020-09-17 15:09:24 +00:00
|
|
|
const findLabelsSelect = () => wrapper.find(LabelsSelect);
|
|
|
|
|
2020-11-06 03:09:19 +00:00
|
|
|
const mountComponent = (props = {}) => {
|
2020-09-17 15:09:24 +00:00
|
|
|
wrapper = shallowMount(SidebarLabels, {
|
|
|
|
provide: {
|
|
|
|
...defaultProps,
|
2020-11-06 03:09:19 +00:00
|
|
|
...props,
|
|
|
|
},
|
|
|
|
mocks: {
|
|
|
|
$apollo,
|
2020-09-17 15:09:24 +00:00
|
|
|
},
|
|
|
|
});
|
|
|
|
};
|
|
|
|
|
|
|
|
afterEach(() => {
|
|
|
|
wrapper.destroy();
|
|
|
|
wrapper = null;
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('LabelsSelect props', () => {
|
|
|
|
beforeEach(() => {
|
|
|
|
mountComponent();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('are as expected', () => {
|
|
|
|
expect(findLabelsSelect().props()).toMatchObject({
|
|
|
|
allowLabelCreate: defaultProps.allowLabelCreate,
|
|
|
|
allowLabelEdit: defaultProps.allowLabelEdit,
|
|
|
|
allowMultiselect: true,
|
|
|
|
allowScopedLabels: defaultProps.allowScopedLabels,
|
|
|
|
footerCreateLabelTitle: 'Create project label',
|
|
|
|
footerManageLabelTitle: 'Manage project labels',
|
|
|
|
labelsCreateTitle: 'Create project label',
|
|
|
|
labelsFetchPath: defaultProps.labelsFetchPath,
|
|
|
|
labelsFilterBasePath: defaultProps.projectIssuesPath,
|
|
|
|
labelsManagePath: defaultProps.labelsManagePath,
|
|
|
|
labelsSelectInProgress: false,
|
|
|
|
selectedLabels: defaultProps.initiallySelectedLabels,
|
|
|
|
variant: DropdownVariant.Sidebar,
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2020-11-06 03:09:19 +00:00
|
|
|
describe('when type is issue', () => {
|
2020-09-17 15:09:24 +00:00
|
|
|
beforeEach(() => {
|
2020-11-06 03:09:19 +00:00
|
|
|
mountComponent({ issuableType: IssuableType.Issue });
|
2020-09-17 15:09:24 +00:00
|
|
|
});
|
|
|
|
|
2020-11-06 03:09:19 +00:00
|
|
|
describe('when labels are updated', () => {
|
|
|
|
it('invokes a mutation', () => {
|
|
|
|
findLabelsSelect().vm.$emit('updateSelectedLabels', userUpdatedLabels);
|
|
|
|
|
|
|
|
const expected = {
|
|
|
|
mutation: updateIssueLabelsMutation,
|
|
|
|
variables: {
|
|
|
|
input: {
|
|
|
|
addLabelIds: [40],
|
|
|
|
iid: defaultProps.iid,
|
|
|
|
projectPath: defaultProps.projectPath,
|
|
|
|
removeLabelIds: [26, 55],
|
|
|
|
},
|
|
|
|
},
|
|
|
|
};
|
|
|
|
|
|
|
|
expect($apollo.mutate).toHaveBeenCalledWith(expected);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('when label `x` is clicked', () => {
|
|
|
|
it('invokes a mutation', () => {
|
|
|
|
findLabelsSelect().vm.$emit('onLabelRemove', 27);
|
|
|
|
|
|
|
|
const expected = {
|
|
|
|
mutation: updateIssueLabelsMutation,
|
|
|
|
variables: {
|
|
|
|
input: {
|
|
|
|
iid: defaultProps.iid,
|
|
|
|
projectPath: defaultProps.projectPath,
|
|
|
|
removeLabelIds: [27],
|
|
|
|
},
|
|
|
|
},
|
|
|
|
};
|
|
|
|
|
|
|
|
expect($apollo.mutate).toHaveBeenCalledWith(expected);
|
|
|
|
});
|
2020-09-17 15:09:24 +00:00
|
|
|
});
|
|
|
|
});
|
2020-10-13 15:08:53 +00:00
|
|
|
|
2020-11-06 03:09:19 +00:00
|
|
|
describe('when type is merge_request', () => {
|
2020-10-13 15:08:53 +00:00
|
|
|
beforeEach(() => {
|
2020-11-06 03:09:19 +00:00
|
|
|
mountComponent({ issuableType: IssuableType.MergeRequest });
|
2020-10-13 15:08:53 +00:00
|
|
|
});
|
|
|
|
|
2020-11-06 03:09:19 +00:00
|
|
|
describe('when labels are updated', () => {
|
|
|
|
it('invokes a mutation', () => {
|
|
|
|
findLabelsSelect().vm.$emit('updateSelectedLabels', userUpdatedLabels);
|
|
|
|
|
|
|
|
const expected = {
|
|
|
|
mutation: updateMergeRequestLabelsMutation,
|
|
|
|
variables: {
|
|
|
|
input: {
|
|
|
|
iid: defaultProps.iid,
|
|
|
|
labelIds: [toLabelGid(27), toLabelGid(28), toLabelGid(29), toLabelGid(40)],
|
|
|
|
operationMode: MutationOperationMode.Replace,
|
|
|
|
projectPath: defaultProps.projectPath,
|
|
|
|
},
|
|
|
|
},
|
|
|
|
};
|
|
|
|
|
|
|
|
expect($apollo.mutate).toHaveBeenCalledWith(expected);
|
|
|
|
});
|
|
|
|
});
|
2020-10-13 15:08:53 +00:00
|
|
|
|
2020-11-06 03:09:19 +00:00
|
|
|
describe('when label `x` is clicked', () => {
|
|
|
|
it('invokes a mutation', () => {
|
|
|
|
findLabelsSelect().vm.$emit('onLabelRemove', 27);
|
|
|
|
|
|
|
|
const expected = {
|
|
|
|
mutation: updateMergeRequestLabelsMutation,
|
|
|
|
variables: {
|
|
|
|
input: {
|
|
|
|
iid: defaultProps.iid,
|
|
|
|
labelIds: [toLabelGid(27)],
|
|
|
|
operationMode: MutationOperationMode.Remove,
|
|
|
|
projectPath: defaultProps.projectPath,
|
|
|
|
},
|
|
|
|
},
|
|
|
|
};
|
|
|
|
|
|
|
|
expect($apollo.mutate).toHaveBeenCalledWith(expected);
|
|
|
|
});
|
2020-10-13 15:08:53 +00:00
|
|
|
});
|
|
|
|
});
|
2020-09-17 15:09:24 +00:00
|
|
|
});
|