diff options
Diffstat (limited to 'spec/frontend/issues/show/components/fields/description_spec.js')
-rw-r--r-- | spec/frontend/issues/show/components/fields/description_spec.js | 59 |
1 files changed, 57 insertions, 2 deletions
diff --git a/spec/frontend/issues/show/components/fields/description_spec.js b/spec/frontend/issues/show/components/fields/description_spec.js index 61433607a2b..cd4d422583b 100644 --- a/spec/frontend/issues/show/components/fields/description_spec.js +++ b/spec/frontend/issues/show/components/fields/description_spec.js @@ -2,13 +2,15 @@ import { shallowMount } from '@vue/test-utils'; import DescriptionField from '~/issues/show/components/fields/description.vue'; import eventHub from '~/issues/show/event_hub'; import MarkdownField from '~/vue_shared/components/markdown/field.vue'; +import MarkdownEditor from '~/vue_shared/components/markdown/markdown_editor.vue'; describe('Description field component', () => { let wrapper; const findTextarea = () => wrapper.findComponent({ ref: 'textarea' }); + const findMarkdownEditor = () => wrapper.findComponent(MarkdownEditor); - const mountComponent = (description = 'test') => + const mountComponent = ({ description = 'test', contentEditorOnIssues = false } = {}) => shallowMount(DescriptionField, { attachTo: document.body, propsData: { @@ -17,6 +19,11 @@ describe('Description field component', () => { quickActionsDocsPath: '/', value: description, }, + provide: { + glFeatures: { + contentEditorOnIssues, + }, + }, stubs: { MarkdownField, }, @@ -40,7 +47,7 @@ describe('Description field component', () => { it('renders markdown field with a markdown description', () => { const markdown = '**test**'; - wrapper = mountComponent(markdown); + wrapper = mountComponent({ description: markdown }); expect(findTextarea().element.value).toBe(markdown); }); @@ -66,4 +73,52 @@ describe('Description field component', () => { expect(eventHub.$emit).toHaveBeenCalledWith('update.issuable'); }); + + describe('when contentEditorOnIssues feature flag is on', () => { + beforeEach(() => { + wrapper = mountComponent({ contentEditorOnIssues: true }); + }); + + it('uses the MarkdownEditor component to edit markdown', () => { + expect(findMarkdownEditor().props()).toEqual( + expect.objectContaining({ + value: 'test', + renderMarkdownPath: '/', + markdownDocsPath: '/', + quickActionsDocsPath: expect.any(String), + initOnAutofocus: true, + supportsQuickActions: true, + enableAutocomplete: true, + }), + ); + }); + + it('triggers update with meta+enter', () => { + findMarkdownEditor().vm.$emit('keydown', { + type: 'keydown', + keyCode: 13, + metaKey: true, + }); + + expect(eventHub.$emit).toHaveBeenCalledWith('update.issuable'); + }); + + it('triggers update with ctrl+enter', () => { + findMarkdownEditor().vm.$emit('keydown', { + type: 'keydown', + keyCode: 13, + ctrlKey: true, + }); + + expect(eventHub.$emit).toHaveBeenCalledWith('update.issuable'); + }); + + it('emits input event when MarkdownEditor emits input event', () => { + const markdown = 'markdown'; + + findMarkdownEditor().vm.$emit('input', markdown); + + expect(wrapper.emitted('input')).toEqual([[markdown]]); + }); + }); }); |