diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2021-02-11 09:09:17 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2021-02-11 09:09:17 +0300 |
commit | 62d57690bc54e195b2544091725421144ce76900 (patch) | |
tree | 23a54295dd446cf9824e55d640ef22a23fbfe365 /spec/frontend/issue_show | |
parent | 17e74fcd4654243a4e4f2c1cfbb0d00508a0050e (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/issue_show')
-rw-r--r-- | spec/frontend/issue_show/components/fields/description_spec.js | 78 | ||||
-rw-r--r-- | spec/frontend/issue_show/components/fields/title_spec.js | 48 | ||||
-rw-r--r-- | spec/frontend/issue_show/helpers.js | 9 |
3 files changed, 60 insertions, 75 deletions
diff --git a/spec/frontend/issue_show/components/fields/description_spec.js b/spec/frontend/issue_show/components/fields/description_spec.js index 96c81c419d0..f4579ed43fb 100644 --- a/spec/frontend/issue_show/components/fields/description_spec.js +++ b/spec/frontend/issue_show/components/fields/description_spec.js @@ -1,70 +1,70 @@ -import Vue from 'vue'; +import { shallowMount } from '@vue/test-utils'; +import DescriptionField from '~/issue_show/components/fields/description.vue'; +import MarkdownField from '~/vue_shared/components/markdown/field.vue'; import eventHub from '~/issue_show/event_hub'; -import Store from '~/issue_show/stores'; -import descriptionField from '~/issue_show/components/fields/description.vue'; -import { keyboardDownEvent } from '../../helpers'; describe('Description field component', () => { - let vm; - let store; - - beforeEach((done) => { - const Component = Vue.extend(descriptionField); - const el = document.createElement('div'); - store = new Store({ - titleHtml: '', - descriptionHtml: '', - issuableRef: '', - }); - store.formState.description = 'test'; - - document.body.appendChild(el); + let wrapper; - jest.spyOn(eventHub, '$emit').mockImplementation(() => {}); + const findTextarea = () => wrapper.find({ ref: 'textarea' }); - vm = new Component({ - el, + const mountComponent = (description = 'test') => + shallowMount(DescriptionField, { + attachTo: document.body, propsData: { markdownPreviewPath: '/', markdownDocsPath: '/', - formState: store.formState, + formState: { + description, + }, + }, + stubs: { + MarkdownField, }, - }).$mount(); + }); + + beforeEach(() => { + jest.spyOn(eventHub, '$emit'); + }); - Vue.nextTick(done); + afterEach(() => { + wrapper.destroy(); + wrapper = null; }); it('renders markdown field with description', () => { - expect(vm.$el.querySelector('.md-area textarea').value).toBe('test'); + wrapper = mountComponent(); + + expect(findTextarea().element.value).toBe('test'); }); - it('renders markdown field with a markdown description', (done) => { - store.formState.description = '**test**'; + it('renders markdown field with a markdown description', () => { + const markdown = '**test**'; - Vue.nextTick(() => { - expect(vm.$el.querySelector('.md-area textarea').value).toBe('**test**'); + wrapper = mountComponent(markdown); - done(); - }); + expect(findTextarea().element.value).toBe(markdown); }); it('focuses field when mounted', () => { - expect(document.activeElement).toBe(vm.$refs.textarea); + wrapper = mountComponent(); + + expect(document.activeElement).toBe(findTextarea().element); }); it('triggers update with meta+enter', () => { - vm.$el.querySelector('.md-area textarea').dispatchEvent(keyboardDownEvent(13, true)); + wrapper = mountComponent(); - expect(eventHub.$emit).toHaveBeenCalled(); + findTextarea().trigger('keydown.enter', { metaKey: true }); + + expect(eventHub.$emit).toHaveBeenCalledWith('update.issuable'); }); it('triggers update with ctrl+enter', () => { - vm.$el.querySelector('.md-area textarea').dispatchEvent(keyboardDownEvent(13, false, true)); + wrapper = mountComponent(); - expect(eventHub.$emit).toHaveBeenCalled(); - }); + findTextarea().trigger('keydown.enter', { ctrlKey: true }); - it('has a ref named `textarea`', () => { - expect(vm.$refs.textarea).not.toBeNull(); + expect(eventHub.$emit).toHaveBeenCalledWith('update.issuable'); }); }); diff --git a/spec/frontend/issue_show/components/fields/title_spec.js b/spec/frontend/issue_show/components/fields/title_spec.js index 99e8658b89f..783ce9eb76c 100644 --- a/spec/frontend/issue_show/components/fields/title_spec.js +++ b/spec/frontend/issue_show/components/fields/title_spec.js @@ -1,48 +1,42 @@ -import Vue from 'vue'; +import { shallowMount } from '@vue/test-utils'; +import TitleField from '~/issue_show/components/fields/title.vue'; import eventHub from '~/issue_show/event_hub'; -import Store from '~/issue_show/stores'; -import titleField from '~/issue_show/components/fields/title.vue'; -import { keyboardDownEvent } from '../../helpers'; describe('Title field component', () => { - let vm; - let store; + let wrapper; - beforeEach(() => { - const Component = Vue.extend(titleField); - store = new Store({ - titleHtml: '', - descriptionHtml: '', - issuableRef: '', - }); - store.formState.title = 'test'; + const findInput = () => wrapper.find({ ref: 'input' }); - jest.spyOn(eventHub, '$emit').mockImplementation(() => {}); + beforeEach(() => { + jest.spyOn(eventHub, '$emit'); - vm = new Component({ + wrapper = shallowMount(TitleField, { propsData: { - formState: store.formState, + formState: { + title: 'test', + }, }, - }).$mount(); + }); + }); + + afterEach(() => { + wrapper.destroy(); + wrapper = null; }); it('renders form control with formState title', () => { - expect(vm.$el.querySelector('.form-control').value).toBe('test'); + expect(findInput().element.value).toBe('test'); }); it('triggers update with meta+enter', () => { - vm.$el.querySelector('.form-control').dispatchEvent(keyboardDownEvent(13, true)); + findInput().trigger('keydown.enter', { metaKey: true }); - expect(eventHub.$emit).toHaveBeenCalled(); + expect(eventHub.$emit).toHaveBeenCalledWith('update.issuable'); }); it('triggers update with ctrl+enter', () => { - vm.$el.querySelector('.form-control').dispatchEvent(keyboardDownEvent(13, false, true)); - - expect(eventHub.$emit).toHaveBeenCalled(); - }); + findInput().trigger('keydown.enter', { ctrlKey: true }); - it('has a ref named `input`', () => { - expect(vm.$refs.input).not.toBeNull(); + expect(eventHub.$emit).toHaveBeenCalledWith('update.issuable'); }); }); diff --git a/spec/frontend/issue_show/helpers.js b/spec/frontend/issue_show/helpers.js deleted file mode 100644 index 7ca6a22929d..00000000000 --- a/spec/frontend/issue_show/helpers.js +++ /dev/null @@ -1,9 +0,0 @@ -export const keyboardDownEvent = (code, metaKey = false, ctrlKey = false) => { - const e = new CustomEvent('keydown'); - - e.keyCode = code; - e.metaKey = metaKey; - e.ctrlKey = ctrlKey; - - return e; -}; |