diff options
Diffstat (limited to 'spec/frontend/repository/components')
5 files changed, 143 insertions, 42 deletions
diff --git a/spec/frontend/repository/components/blob_content_viewer_spec.js b/spec/frontend/repository/components/blob_content_viewer_spec.js index b662a1d20a9..f03df8cf2ac 100644 --- a/spec/frontend/repository/components/blob_content_viewer_spec.js +++ b/spec/frontend/repository/components/blob_content_viewer_spec.js @@ -1,14 +1,17 @@ import { GlLoadingIcon } from '@gitlab/ui'; -import { shallowMount } from '@vue/test-utils'; +import { shallowMount, mount } from '@vue/test-utils'; +import { nextTick } from 'vue'; import BlobContent from '~/blob/components/blob_content.vue'; import BlobHeader from '~/blob/components/blob_header.vue'; import BlobContentViewer from '~/repository/components/blob_content_viewer.vue'; +import BlobHeaderEdit from '~/repository/components/blob_header_edit.vue'; let wrapper; -const mockData = { +const simpleMockData = { name: 'some_file.js', size: 123, - rawBlob: 'raw content', + rawSize: 123, + rawTextBlob: 'raw content', type: 'text', fileType: 'text', tooLarge: false, @@ -25,62 +28,160 @@ const mockData = { lockLink: 'some_file.js/lock', canModifyBlob: true, forkPath: 'some_file.js/fork', - simpleViewer: {}, - richViewer: {}, + simpleViewer: { + fileType: 'text', + tooLarge: false, + type: 'simple', + renderError: null, + }, + richViewer: null, +}; +const richMockData = { + ...simpleMockData, + richViewer: { + fileType: 'markup', + tooLarge: false, + type: 'rich', + renderError: null, + }, }; -function factory(path, loading = false) { - wrapper = shallowMount(BlobContentViewer, { +const createFactory = (mountFn) => ( + { props = {}, mockData = {}, stubs = {} } = {}, + loading = false, +) => { + wrapper = mountFn(BlobContentViewer, { propsData: { - path, + path: 'some_file.js', + projectPath: 'some/path', + ...props, }, mocks: { $apollo: { queries: { - blobInfo: { + project: { loading, }, }, }, }, + stubs, }); - wrapper.setData({ blobInfo: mockData }); -} + wrapper.setData(mockData); +}; + +const factory = createFactory(shallowMount); +const fullFactory = createFactory(mount); describe('Blob content viewer component', () => { const findLoadingIcon = () => wrapper.find(GlLoadingIcon); const findBlobHeader = () => wrapper.find(BlobHeader); + const findBlobHeaderEdit = () => wrapper.find(BlobHeaderEdit); const findBlobContent = () => wrapper.find(BlobContent); afterEach(() => { wrapper.destroy(); }); - beforeEach(() => { - factory('some_file.js'); - }); - it('renders a GlLoadingIcon component', () => { - factory('some_file.js', true); + factory({ mockData: { blobInfo: simpleMockData } }, true); expect(findLoadingIcon().exists()).toBe(true); }); - it('renders a BlobHeader component', () => { - expect(findBlobHeader().exists()).toBe(true); + describe('simple viewer', () => { + beforeEach(() => { + factory({ mockData: { blobInfo: simpleMockData } }); + }); + + it('renders a BlobHeader component', () => { + expect(findBlobHeader().props('activeViewerType')).toEqual('simple'); + expect(findBlobHeader().props('hasRenderError')).toEqual(false); + expect(findBlobHeader().props('hideViewerSwitcher')).toEqual(true); + expect(findBlobHeader().props('blob')).toEqual(simpleMockData); + }); + + it('renders a BlobContent component', () => { + expect(findBlobContent().props('loading')).toEqual(false); + expect(findBlobContent().props('content')).toEqual('raw content'); + expect(findBlobContent().props('isRawContent')).toBe(true); + expect(findBlobContent().props('activeViewer')).toEqual({ + fileType: 'text', + tooLarge: false, + type: 'simple', + renderError: null, + }); + }); + }); + + describe('rich viewer', () => { + beforeEach(() => { + factory({ + mockData: { blobInfo: richMockData, activeViewerType: 'rich' }, + }); + }); + + it('renders a BlobHeader component', () => { + expect(findBlobHeader().props('activeViewerType')).toEqual('rich'); + expect(findBlobHeader().props('hasRenderError')).toEqual(false); + expect(findBlobHeader().props('hideViewerSwitcher')).toEqual(false); + expect(findBlobHeader().props('blob')).toEqual(richMockData); + }); + + it('renders a BlobContent component', () => { + expect(findBlobContent().props('loading')).toEqual(false); + expect(findBlobContent().props('content')).toEqual('raw content'); + expect(findBlobContent().props('isRawContent')).toBe(true); + expect(findBlobContent().props('activeViewer')).toEqual({ + fileType: 'markup', + tooLarge: false, + type: 'rich', + renderError: null, + }); + }); + + it('updates viewer type when viewer changed is clicked', async () => { + expect(findBlobContent().props('activeViewer')).toEqual( + expect.objectContaining({ + type: 'rich', + }), + ); + expect(findBlobHeader().props('activeViewerType')).toEqual('rich'); + + findBlobHeader().vm.$emit('viewer-changed', 'simple'); + await nextTick(); + + expect(findBlobHeader().props('activeViewerType')).toEqual('simple'); + expect(findBlobContent().props('activeViewer')).toEqual( + expect.objectContaining({ + type: 'simple', + }), + ); + }); }); - it('renders a BlobContent component', () => { - expect(findBlobContent().exists()).toBe(true); + describe('BlobHeader action slot', () => { + it('renders BlobHeaderEdit button in simple viewer', async () => { + fullFactory({ + mockData: { blobInfo: simpleMockData }, + stubs: { + BlobContent: true, + }, + }); + await nextTick(); + expect(findBlobHeaderEdit().props('editPath')).toEqual('some_file.js/edit'); + }); - expect(findBlobContent().props('loading')).toEqual(false); - expect(findBlobContent().props('content')).toEqual('raw content'); - expect(findBlobContent().props('isRawContent')).toBe(true); - expect(findBlobContent().props('activeViewer')).toEqual({ - fileType: 'text', - tooLarge: false, - type: 'text', + it('renders BlobHeaderEdit button in rich viewer', async () => { + fullFactory({ + mockData: { blobInfo: richMockData }, + stubs: { + BlobContent: true, + }, + }); + await nextTick(); + expect(findBlobHeaderEdit().props('editPath')).toEqual('some_file.js/edit'); }); }); }); diff --git a/spec/frontend/repository/components/table/index_spec.js b/spec/frontend/repository/components/table/index_spec.js index af263f43d7d..e9e51abaf0f 100644 --- a/spec/frontend/repository/components/table/index_spec.js +++ b/spec/frontend/repository/components/table/index_spec.js @@ -55,8 +55,8 @@ describe('Repository table component', () => { it.each` path | ref - ${'/'} | ${'master'} - ${'app/assets'} | ${'master'} + ${'/'} | ${'main'} + ${'app/assets'} | ${'main'} ${'/'} | ${'test'} `('renders table caption for $ref in $path', ({ path, ref }) => { factory({ path }); diff --git a/spec/frontend/repository/components/table/parent_row_spec.js b/spec/frontend/repository/components/table/parent_row_spec.js index cf1ed272634..9daae8c36ef 100644 --- a/spec/frontend/repository/components/table/parent_row_spec.js +++ b/spec/frontend/repository/components/table/parent_row_spec.js @@ -12,7 +12,7 @@ function factory(path, loadingPath) { vm = shallowMount(ParentRow, { propsData: { - commitRef: 'master', + commitRef: 'main', path, loadingPath, }, @@ -32,10 +32,10 @@ describe('Repository parent row component', () => { it.each` path | to - ${'app'} | ${'/-/tree/master/'} - ${'app/assets'} | ${'/-/tree/master/app'} - ${'app/assets#/test'} | ${'/-/tree/master/app/assets%23'} - ${'app/assets#/test/world'} | ${'/-/tree/master/app/assets%23/test'} + ${'app'} | ${'/-/tree/main/'} + ${'app/assets'} | ${'/-/tree/main/app'} + ${'app/assets#/test'} | ${'/-/tree/main/app/assets%23'} + ${'app/assets#/test/world'} | ${'/-/tree/main/app/assets%23/test'} `('renders link in $path to $to', ({ path, to }) => { factory(path); @@ -50,7 +50,7 @@ describe('Repository parent row component', () => { vm.find('td').trigger('click'); expect($router.push).toHaveBeenCalledWith({ - path: '/-/tree/master/app', + path: '/-/tree/main/app', }); }); @@ -62,7 +62,7 @@ describe('Repository parent row component', () => { vm.find('a').trigger('click'); expect($router.push).not.toHaveBeenCalledWith({ - path: '/-/tree/master/app', + path: '/-/tree/main/app', }); }); diff --git a/spec/frontend/repository/components/table/row_spec.js b/spec/frontend/repository/components/table/row_spec.js index 3ebffbedcdb..6ba6f993db1 100644 --- a/spec/frontend/repository/components/table/row_spec.js +++ b/spec/frontend/repository/components/table/row_spec.js @@ -30,7 +30,7 @@ function factory(propsData = {}) { }, }); - vm.setData({ escapedRef: 'master' }); + vm.setData({ escapedRef: 'main' }); } describe('Repository table row component', () => { @@ -115,7 +115,7 @@ describe('Repository table row component', () => { return vm.vm.$nextTick().then(() => { expect(vm.find({ ref: 'link' }).props('to')).toEqual({ - path: `/-/tree/master/${encodeURIComponent(path)}`, + path: `/-/tree/main/${encodeURIComponent(path)}`, }); }); }); @@ -130,7 +130,7 @@ describe('Repository table row component', () => { }); return vm.vm.$nextTick().then(() => { - expect(vm.find('.tree-item-link').props('to')).toEqual({ path: '/-/tree/master/test%23' }); + expect(vm.find('.tree-item-link').props('to')).toEqual({ path: '/-/tree/main/test%23' }); }); }); diff --git a/spec/frontend/repository/components/upload_blob_modal_spec.js b/spec/frontend/repository/components/upload_blob_modal_spec.js index 935ed08f67a..ec85d5666fb 100644 --- a/spec/frontend/repository/components/upload_blob_modal_spec.js +++ b/spec/frontend/repository/components/upload_blob_modal_spec.js @@ -20,8 +20,8 @@ jest.mock('~/lib/utils/url_utility', () => ({ const initialProps = { modalId: 'upload-blob', commitMessage: 'Upload New File', - targetBranch: 'master', - originalBranch: 'master', + targetBranch: 'main', + originalBranch: 'main', canPushCode: true, path: 'new_upload', }; @@ -111,7 +111,7 @@ describe('UploadBlobModal', () => { if (canPushCode) { describe('when changing the branch name', () => { it('displays the MR toggle', async () => { - wrapper.setData({ target: 'Not master' }); + wrapper.setData({ target: 'Not main' }); await wrapper.vm.$nextTick(); |