2020-03-10 09:08:10 +00:00
|
|
|
import SnippetDescriptionEdit from '~/snippets/components/snippet_description_edit.vue';
|
2020-06-15 12:08:44 +00:00
|
|
|
import MarkdownField from '~/vue_shared/components/markdown/field.vue';
|
2020-03-10 09:08:10 +00:00
|
|
|
import { shallowMount } from '@vue/test-utils';
|
|
|
|
|
|
|
|
describe('Snippet Description Edit component', () => {
|
|
|
|
let wrapper;
|
|
|
|
const defaultDescription = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.';
|
|
|
|
const markdownPreviewPath = 'foo/';
|
|
|
|
const markdownDocsPath = 'help/';
|
2020-04-01 09:07:45 +00:00
|
|
|
const findTextarea = () => wrapper.find('textarea');
|
2020-03-10 09:08:10 +00:00
|
|
|
|
2020-04-01 09:07:45 +00:00
|
|
|
function createComponent(value = defaultDescription) {
|
2020-03-10 09:08:10 +00:00
|
|
|
wrapper = shallowMount(SnippetDescriptionEdit, {
|
|
|
|
propsData: {
|
2020-04-01 09:07:45 +00:00
|
|
|
value,
|
2020-03-10 09:08:10 +00:00
|
|
|
markdownPreviewPath,
|
|
|
|
markdownDocsPath,
|
|
|
|
},
|
2020-06-15 12:08:44 +00:00
|
|
|
stubs: {
|
|
|
|
MarkdownField,
|
|
|
|
},
|
2020-03-10 09:08:10 +00:00
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function isHidden(sel) {
|
|
|
|
return wrapper.find(sel).classes('d-none');
|
|
|
|
}
|
|
|
|
|
|
|
|
beforeEach(() => {
|
|
|
|
createComponent();
|
|
|
|
});
|
|
|
|
|
|
|
|
afterEach(() => {
|
|
|
|
wrapper.destroy();
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('rendering', () => {
|
|
|
|
it('matches the snapshot', () => {
|
|
|
|
expect(wrapper.element).toMatchSnapshot();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('renders the field expanded when description exists', () => {
|
|
|
|
expect(wrapper.find('.js-collapsed').classes('d-none')).toBe(true);
|
|
|
|
expect(wrapper.find('.js-expanded').classes('d-none')).toBe(false);
|
|
|
|
|
|
|
|
expect(isHidden('.js-collapsed')).toBe(true);
|
|
|
|
expect(isHidden('.js-expanded')).toBe(false);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('renders the field collapsed if there is no description yet', () => {
|
|
|
|
createComponent('');
|
|
|
|
|
|
|
|
expect(isHidden('.js-collapsed')).toBe(false);
|
|
|
|
expect(isHidden('.js-expanded')).toBe(true);
|
|
|
|
});
|
|
|
|
});
|
2020-04-01 09:07:45 +00:00
|
|
|
|
|
|
|
describe('functionality', () => {
|
|
|
|
it('emits "input" event when description is changed', () => {
|
|
|
|
expect(wrapper.emitted('input')).toBeUndefined();
|
|
|
|
const newDescription = 'dummy';
|
|
|
|
findTextarea().setValue(newDescription);
|
|
|
|
|
|
|
|
expect(wrapper.emitted('input')[0]).toEqual([newDescription]);
|
|
|
|
});
|
|
|
|
});
|
2020-03-10 09:08:10 +00:00
|
|
|
});
|