2020-05-24 23:13:21 +05:30
|
|
|
import { shallowMount } from '@vue/test-utils';
|
2020-07-28 23:09:34 +05:30
|
|
|
import { GlLoadingIcon } from '@gitlab/ui';
|
2020-05-24 23:13:21 +05:30
|
|
|
import EditFormButtons from '~/sidebar/components/confidential/edit_form_buttons.vue';
|
2020-07-28 23:09:34 +05:30
|
|
|
import eventHub from '~/sidebar/event_hub';
|
|
|
|
import createStore from '~/notes/stores';
|
|
|
|
import waitForPromises from 'helpers/wait_for_promises';
|
|
|
|
import flash from '~/flash';
|
|
|
|
|
|
|
|
jest.mock('~/sidebar/event_hub', () => ({ $emit: jest.fn() }));
|
|
|
|
jest.mock('~/flash');
|
2020-05-24 23:13:21 +05:30
|
|
|
|
|
|
|
describe('Edit Form Buttons', () => {
|
|
|
|
let wrapper;
|
2020-07-28 23:09:34 +05:30
|
|
|
let store;
|
2020-05-24 23:13:21 +05:30
|
|
|
const findConfidentialToggle = () => wrapper.find('[data-testid="confidential-toggle"]');
|
|
|
|
|
2020-07-28 23:09:34 +05:30
|
|
|
const createComponent = ({
|
|
|
|
props = {},
|
|
|
|
data = {},
|
|
|
|
confidentialApolloSidebar = false,
|
|
|
|
resolved = true,
|
|
|
|
}) => {
|
|
|
|
store = createStore();
|
|
|
|
if (resolved) {
|
|
|
|
jest.spyOn(store, 'dispatch').mockResolvedValue();
|
|
|
|
} else {
|
|
|
|
jest.spyOn(store, 'dispatch').mockRejectedValue();
|
|
|
|
}
|
|
|
|
|
2020-05-24 23:13:21 +05:30
|
|
|
wrapper = shallowMount(EditFormButtons, {
|
|
|
|
propsData: {
|
2020-07-28 23:09:34 +05:30
|
|
|
fullPath: '',
|
2020-05-24 23:13:21 +05:30
|
|
|
...props,
|
|
|
|
},
|
2020-07-28 23:09:34 +05:30
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
isLoading: true,
|
|
|
|
...data,
|
|
|
|
};
|
|
|
|
},
|
|
|
|
provide: {
|
|
|
|
glFeatures: {
|
|
|
|
confidentialApolloSidebar,
|
|
|
|
},
|
|
|
|
},
|
|
|
|
store,
|
2020-05-24 23:13:21 +05:30
|
|
|
});
|
|
|
|
};
|
|
|
|
|
|
|
|
afterEach(() => {
|
|
|
|
wrapper.destroy();
|
|
|
|
wrapper = null;
|
|
|
|
});
|
|
|
|
|
2020-07-28 23:09:34 +05:30
|
|
|
describe('when isLoading', () => {
|
|
|
|
beforeEach(() => {
|
|
|
|
createComponent({});
|
|
|
|
|
|
|
|
wrapper.vm.$store.state.noteableData.confidential = false;
|
|
|
|
});
|
|
|
|
|
|
|
|
it('renders "Applying" in the toggle button', () => {
|
|
|
|
expect(findConfidentialToggle().text()).toBe('Applying');
|
|
|
|
});
|
|
|
|
|
|
|
|
it('disables the toggle button', () => {
|
|
|
|
expect(findConfidentialToggle().attributes('disabled')).toBe('disabled');
|
|
|
|
});
|
|
|
|
|
|
|
|
it('finds the GlLoadingIcon', () => {
|
|
|
|
expect(wrapper.find(GlLoadingIcon).exists()).toBe(true);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2020-05-24 23:13:21 +05:30
|
|
|
describe('when not confidential', () => {
|
2020-07-28 23:09:34 +05:30
|
|
|
it('renders Turn On in the toggle button', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
createComponent({
|
2020-07-28 23:09:34 +05:30
|
|
|
data: {
|
|
|
|
isLoading: false,
|
|
|
|
},
|
2020-05-24 23:13:21 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
expect(findConfidentialToggle().text()).toBe('Turn On');
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('when confidential', () => {
|
2020-07-28 23:09:34 +05:30
|
|
|
beforeEach(() => {
|
2020-05-24 23:13:21 +05:30
|
|
|
createComponent({
|
2020-07-28 23:09:34 +05:30
|
|
|
data: {
|
|
|
|
isLoading: false,
|
|
|
|
},
|
2020-05-24 23:13:21 +05:30
|
|
|
});
|
|
|
|
|
2020-07-28 23:09:34 +05:30
|
|
|
wrapper.vm.$store.state.noteableData.confidential = true;
|
|
|
|
});
|
|
|
|
|
|
|
|
it('renders on or off text based on confidentiality', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
expect(findConfidentialToggle().text()).toBe('Turn Off');
|
|
|
|
});
|
2020-07-28 23:09:34 +05:30
|
|
|
|
|
|
|
describe('when clicking on the confidential toggle', () => {
|
|
|
|
it('emits updateConfidentialAttribute', () => {
|
|
|
|
findConfidentialToggle().trigger('click');
|
|
|
|
|
|
|
|
expect(eventHub.$emit).toHaveBeenCalledWith('updateConfidentialAttribute');
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('when confidentialApolloSidebar is turned on', () => {
|
|
|
|
const isConfidential = true;
|
|
|
|
|
|
|
|
describe('when succeeds', () => {
|
|
|
|
beforeEach(() => {
|
|
|
|
createComponent({ data: { isLoading: false }, confidentialApolloSidebar: true });
|
|
|
|
wrapper.vm.$store.state.noteableData.confidential = isConfidential;
|
|
|
|
findConfidentialToggle().trigger('click');
|
|
|
|
});
|
|
|
|
|
|
|
|
it('dispatches the correct action', () => {
|
|
|
|
expect(store.dispatch).toHaveBeenCalledWith('updateConfidentialityOnIssue', {
|
|
|
|
confidential: !isConfidential,
|
|
|
|
fullPath: '',
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
it('resets loading', () => {
|
|
|
|
return waitForPromises().then(() => {
|
|
|
|
expect(wrapper.find(GlLoadingIcon).exists()).toBe(false);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
it('emits close form', () => {
|
|
|
|
return waitForPromises().then(() => {
|
|
|
|
expect(eventHub.$emit).toHaveBeenCalledWith('closeConfidentialityForm');
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('when fails', () => {
|
|
|
|
beforeEach(() => {
|
|
|
|
createComponent({
|
|
|
|
data: { isLoading: false },
|
|
|
|
confidentialApolloSidebar: true,
|
|
|
|
resolved: false,
|
|
|
|
});
|
|
|
|
wrapper.vm.$store.state.noteableData.confidential = isConfidential;
|
|
|
|
findConfidentialToggle().trigger('click');
|
|
|
|
});
|
|
|
|
|
|
|
|
it('calls flash with the correct message', () => {
|
|
|
|
expect(flash).toHaveBeenCalledWith(
|
|
|
|
'Something went wrong trying to change the confidentiality of this issue',
|
|
|
|
);
|
|
|
|
});
|
|
|
|
});
|
2020-05-24 23:13:21 +05:30
|
|
|
});
|
|
|
|
});
|