93 lines
2.8 KiB
JavaScript
93 lines
2.8 KiB
JavaScript
import { shallowMount } from '@vue/test-utils';
|
|
import { nextTick } from 'vue';
|
|
import { getIdFromGraphQLId } from '~/graphql_shared/utils';
|
|
import { TYPE_ISSUE, WorkspaceType } from '~/issues/constants';
|
|
import { __ } from '~/locale';
|
|
import MilestoneDropdown from '~/sidebar/components/milestone/milestone_dropdown.vue';
|
|
import SidebarDropdown from '~/sidebar/components/sidebar_dropdown.vue';
|
|
|
|
describe('MilestoneDropdown component', () => {
|
|
let wrapper;
|
|
|
|
const propsData = {
|
|
attrWorkspacePath: 'full/path',
|
|
issuableType: TYPE_ISSUE,
|
|
workspaceType: WorkspaceType.project,
|
|
};
|
|
|
|
const findHiddenInput = () => wrapper.find('input');
|
|
const findSidebarDropdown = () => wrapper.findComponent(SidebarDropdown);
|
|
|
|
const createComponent = (props = {}) => {
|
|
wrapper = shallowMount(MilestoneDropdown, { propsData: { ...propsData, ...props } });
|
|
};
|
|
|
|
it('renders SidebarDropdown', () => {
|
|
createComponent();
|
|
|
|
expect(findSidebarDropdown().props()).toMatchObject({
|
|
attrWorkspacePath: propsData.attrWorkspacePath,
|
|
issuableAttribute: MilestoneDropdown.issuableAttribute,
|
|
issuableType: propsData.issuableType,
|
|
workspaceType: propsData.workspaceType,
|
|
});
|
|
});
|
|
|
|
it('renders hidden input', () => {
|
|
createComponent();
|
|
|
|
expect(findHiddenInput().attributes()).toEqual({
|
|
type: 'hidden',
|
|
name: 'update[milestone_id]',
|
|
value: undefined,
|
|
});
|
|
});
|
|
|
|
describe('when milestone ID and title is provided', () => {
|
|
it('is used in the dropdown and hidden input', () => {
|
|
const milestone = {
|
|
id: 'gid://gitlab/Milestone/52',
|
|
title: __('Milestone 52'),
|
|
};
|
|
createComponent({ milestoneId: milestone.id, milestoneTitle: milestone.title });
|
|
|
|
expect(findSidebarDropdown().props('currentAttribute')).toEqual(milestone);
|
|
expect(findHiddenInput().attributes('value')).toBe(
|
|
getIdFromGraphQLId(milestone.id).toString(),
|
|
);
|
|
});
|
|
});
|
|
|
|
describe('when SidebarDropdown emits `change` event', () => {
|
|
beforeEach(() => {
|
|
createComponent();
|
|
});
|
|
|
|
describe('when valid milestone is emitted', () => {
|
|
it('updates the hidden input value', async () => {
|
|
const milestone = {
|
|
id: 'gid://gitlab/Milestone/52',
|
|
title: __('Milestone 52'),
|
|
};
|
|
|
|
findSidebarDropdown().vm.$emit('change', milestone);
|
|
await nextTick();
|
|
|
|
expect(findHiddenInput().attributes('value')).toBe(
|
|
getIdFromGraphQLId(milestone.id).toString(),
|
|
);
|
|
});
|
|
});
|
|
|
|
describe('when null milestone is emitted', () => {
|
|
it('updates the hidden input value to `0`', async () => {
|
|
const milestone = { id: null };
|
|
|
|
findSidebarDropdown().vm.$emit('change', milestone);
|
|
await nextTick();
|
|
|
|
expect(findHiddenInput().attributes('value')).toBe('0');
|
|
});
|
|
});
|
|
});
|
|
});
|