2021-01-03 14:25:43 +05:30
|
|
|
import { GlModal } from '@gitlab/ui';
|
2021-03-11 19:13:27 +05:30
|
|
|
import { shallowMount, createLocalVue } from '@vue/test-utils';
|
|
|
|
import Vuex from 'vuex';
|
2021-01-03 14:25:43 +05:30
|
|
|
import BadgeList from '~/badges/components/badge_list.vue';
|
|
|
|
import BadgeListRow from '~/badges/components/badge_list_row.vue';
|
2021-03-11 19:13:27 +05:30
|
|
|
import BadgeSettings from '~/badges/components/badge_settings.vue';
|
|
|
|
import store from '~/badges/store';
|
2018-05-09 12:01:36 +05:30
|
|
|
import { createDummyBadge } from '../dummy_badge';
|
|
|
|
|
2021-01-03 14:25:43 +05:30
|
|
|
const localVue = createLocalVue();
|
|
|
|
localVue.use(Vuex);
|
2018-05-09 12:01:36 +05:30
|
|
|
|
2021-01-03 14:25:43 +05:30
|
|
|
describe('BadgeSettings component', () => {
|
|
|
|
let wrapper;
|
|
|
|
const badge = createDummyBadge();
|
2020-04-08 14:13:33 +05:30
|
|
|
|
2021-01-03 14:25:43 +05:30
|
|
|
const createComponent = (isEditing = false) => {
|
|
|
|
store.state.badges = [badge];
|
|
|
|
store.state.kind = 'project';
|
|
|
|
store.state.isEditing = isEditing;
|
2020-04-08 14:13:33 +05:30
|
|
|
|
2021-01-03 14:25:43 +05:30
|
|
|
wrapper = shallowMount(BadgeSettings, {
|
2018-05-09 12:01:36 +05:30
|
|
|
store,
|
2021-01-03 14:25:43 +05:30
|
|
|
localVue,
|
|
|
|
stubs: {
|
|
|
|
'badge-list': BadgeList,
|
|
|
|
'badge-list-row': BadgeListRow,
|
|
|
|
},
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
2021-01-03 14:25:43 +05:30
|
|
|
};
|
|
|
|
|
|
|
|
beforeEach(() => {
|
|
|
|
createComponent();
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
afterEach(() => {
|
2021-01-03 14:25:43 +05:30
|
|
|
wrapper.destroy();
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
|
2021-01-03 14:25:43 +05:30
|
|
|
it('displays modal if button for deleting a badge is clicked', async () => {
|
|
|
|
const button = wrapper.find('[data-testid="delete-badge"]');
|
2018-05-09 12:01:36 +05:30
|
|
|
|
2021-01-03 14:25:43 +05:30
|
|
|
button.vm.$emit('click');
|
|
|
|
await wrapper.vm.$nextTick();
|
2018-05-09 12:01:36 +05:30
|
|
|
|
2021-01-03 14:25:43 +05:30
|
|
|
const modal = wrapper.find(GlModal);
|
|
|
|
expect(modal.isVisible()).toBe(true);
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
it('displays a form to add a badge', () => {
|
2021-01-03 14:25:43 +05:30
|
|
|
expect(wrapper.find('[data-testid="add-new-badge"]').isVisible()).toBe(true);
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
it('displays badge list', () => {
|
2021-01-03 14:25:43 +05:30
|
|
|
expect(wrapper.find(BadgeList).isVisible()).toBe(true);
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
describe('when editing', () => {
|
2021-01-03 14:25:43 +05:30
|
|
|
beforeEach(() => {
|
|
|
|
createComponent(true);
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
it('displays a form to edit a badge', () => {
|
2021-01-03 14:25:43 +05:30
|
|
|
expect(wrapper.find('[data-testid="edit-badge"]').isVisible()).toBe(true);
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
it('displays no badge list', () => {
|
2021-01-03 14:25:43 +05:30
|
|
|
expect(wrapper.find(BadgeList).isVisible()).toBe(false);
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|