diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2019-09-18 17:02:45 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2019-09-18 17:02:45 +0300 |
commit | 80f61b4035607d7cd87de993b8f5e996bde3481f (patch) | |
tree | 06b12f51e97d87192e3dd0e05edf55143645b894 /spec/frontend/diffs | |
parent | 4ab54c2233e91f60a80e5b6fa2181e6899fdcc3e (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/diffs')
-rw-r--r-- | spec/frontend/diffs/components/diff_content_spec.js | 200 |
1 files changed, 200 insertions, 0 deletions
diff --git a/spec/frontend/diffs/components/diff_content_spec.js b/spec/frontend/diffs/components/diff_content_spec.js new file mode 100644 index 00000000000..b0dd25f746b --- /dev/null +++ b/spec/frontend/diffs/components/diff_content_spec.js @@ -0,0 +1,200 @@ +import { shallowMount, createLocalVue } from '@vue/test-utils'; +import Vuex from 'vuex'; +import { GlLoadingIcon } from '@gitlab/ui'; +import DiffContentComponent from '~/diffs/components/diff_content.vue'; +import InlineDiffView from '~/diffs/components/inline_diff_view.vue'; +import NotDiffableViewer from '~/vue_shared/components/diff_viewer/viewers/not_diffable.vue'; +import NoPreviewViewer from '~/vue_shared/components/diff_viewer/viewers/no_preview.vue'; +import ParallelDiffView from '~/diffs/components/parallel_diff_view.vue'; +import ImageDiffOverlay from '~/diffs/components/image_diff_overlay.vue'; +import NoteForm from '~/notes/components/note_form.vue'; +import DiffDiscussions from '~/diffs/components/diff_discussions.vue'; +import { IMAGE_DIFF_POSITION_TYPE } from '~/diffs/constants'; +import diffFileMockData from '../../../javascripts/diffs/mock_data/diff_file'; +import { diffViewerModes } from '~/ide/constants'; + +const localVue = createLocalVue(); +localVue.use(Vuex); + +describe('DiffContent', () => { + let wrapper; + + const saveDiffDiscussionMock = jest.fn(); + const closeDiffFileCommentFormMock = jest.fn(); + + const noteableTypeGetterMock = jest.fn(); + const getUserDataGetterMock = jest.fn(); + + const isInlineViewGetterMock = jest.fn(); + const isParallelViewGetterMock = jest.fn(); + const getCommentFormForDiffFileGetterMock = jest.fn(); + + const defaultProps = { + diffFile: JSON.parse(JSON.stringify(diffFileMockData)), + }; + + const createComponent = ({ props, state } = {}) => { + const fakeStore = new Vuex.Store({ + getters: { + getNoteableData() { + return { + current_user: { + can_create_note: true, + }, + }; + }, + noteableType: noteableTypeGetterMock, + getUserData: getUserDataGetterMock, + }, + modules: { + /* + we need extra batchComments since vue-test-utils does not + stub async components properly + */ + batchComments: { + namespaced: true, + getters: { + draftsForFile: () => () => true, + }, + }, + diffs: { + namespaced: true, + state: { + projectPath: 'project/path', + endpoint: 'endpoint', + ...state, + }, + getters: { + isInlineView: isInlineViewGetterMock, + isParallelView: isParallelViewGetterMock, + getCommentFormForDiffFile: getCommentFormForDiffFileGetterMock, + }, + actions: { + saveDiffDiscussion: saveDiffDiscussionMock, + closeDiffFileCommentForm: closeDiffFileCommentFormMock, + }, + }, + }, + }); + + wrapper = shallowMount(DiffContentComponent, { + propsData: { + ...defaultProps, + ...props, + }, + localVue, + store: fakeStore, + sync: false, + }); + }; + + afterEach(() => { + wrapper.destroy(); + wrapper = null; + }); + + describe('with text based files', () => { + afterEach(() => { + [isParallelViewGetterMock, isInlineViewGetterMock].forEach(m => m.mockRestore()); + }); + + const textDiffFile = { ...defaultProps.diffFile, viewer: { name: diffViewerModes.text } }; + it('should render diff inline view if `isInlineView` is true', () => { + isInlineViewGetterMock.mockReturnValue(true); + createComponent({ props: { diffFile: textDiffFile } }); + + expect(wrapper.find(InlineDiffView).exists()).toBe(true); + }); + + it('should render parallel view if `isParallelView` getter is true', () => { + isParallelViewGetterMock.mockReturnValue(true); + createComponent({ props: { diffFile: textDiffFile } }); + + expect(wrapper.find(ParallelDiffView).exists()).toBe(true); + }); + + it('renders rendering more lines loading icon', () => { + createComponent({ props: { diffFile: { ...textDiffFile, renderingLines: true } } }); + + expect(wrapper.find(GlLoadingIcon).exists()).toBe(true); + }); + }); + + describe('with empty files', () => { + const emptyDiffFile = { + ...defaultProps.diffFile, + viewer: { name: diffViewerModes.text }, + highlighted_diff_lines: [], + parallel_diff_lines: [], + }; + + it('should render a no preview view if viewer set to no preview', () => { + createComponent({ + props: { diffFile: { ...emptyDiffFile, viewer: { name: diffViewerModes.no_preview } } }, + }); + + expect(wrapper.find(NoPreviewViewer).exists()).toBe(true); + }); + + it('should render not diffable view if viewer set to non_diffable', () => { + createComponent({ + props: { diffFile: { ...emptyDiffFile, viewer: { name: diffViewerModes.not_diffable } } }, + }); + + expect(wrapper.find(NotDiffableViewer).exists()).toBe(true); + }); + }); + + describe('with image files', () => { + const imageDiffFile = { ...defaultProps.diffFile, viewer: { name: diffViewerModes.image } }; + + it('should have image diff view in place', () => { + getCommentFormForDiffFileGetterMock.mockReturnValue(() => true); + createComponent({ props: { diffFile: imageDiffFile } }); + + expect(wrapper.find(InlineDiffView).exists()).toBe(false); + expect(wrapper.find(ImageDiffOverlay).exists()).toBe(true); + }); + + it('renders diff file discussions', () => { + getCommentFormForDiffFileGetterMock.mockReturnValue(() => true); + createComponent({ + props: { + diffFile: { ...imageDiffFile, discussions: [{ name: 'discussion-stub ' }] }, + }, + }); + + expect(wrapper.find(DiffDiscussions).exists()).toBe(true); + }); + + it('emits saveDiffDiscussion when note-form emits `handleFormUpdate`', () => { + const noteStub = {}; + getCommentFormForDiffFileGetterMock.mockReturnValue(() => true); + const currentDiffFile = { ...imageDiffFile, discussions: [{ name: 'discussion-stub ' }] }; + createComponent({ + props: { + diffFile: currentDiffFile, + }, + }); + + wrapper.find(NoteForm).vm.$emit('handleFormUpdate', noteStub); + expect(saveDiffDiscussionMock).toHaveBeenCalledWith( + expect.any(Object), + { + note: noteStub, + formData: { + noteableData: expect.any(Object), + diffFile: currentDiffFile, + positionType: IMAGE_DIFF_POSITION_TYPE, + x: undefined, + y: undefined, + width: undefined, + height: undefined, + noteableType: undefined, + }, + }, + undefined, + ); + }); + }); +}); |