diff options
4 files changed, 146 insertions, 139 deletions
diff --git a/app/assets/javascripts/repo/components/new_dropdown/index.vue b/app/assets/javascripts/repo/components/new_dropdown/index.vue index 9cf6b46b112..3ccb50213ab 100644 --- a/app/assets/javascripts/repo/components/new_dropdown/index.vue +++ b/app/assets/javascripts/repo/components/new_dropdown/index.vue @@ -1,6 +1,6 @@ <script> - import RepoHelper from '../../helpers/repo_helper'; import RepoStore from '../../stores/repo_store'; + import RepoHelper from '../../helpers/repo_helper'; import eventHub from '../../event_hub'; import newModal from './modal.vue'; diff --git a/spec/javascripts/repo/components/new_dropdown/index_spec.js b/spec/javascripts/repo/components/new_dropdown/index_spec.js index 884d065718b..ddbfdab582d 100644 --- a/spec/javascripts/repo/components/new_dropdown/index_spec.js +++ b/spec/javascripts/repo/components/new_dropdown/index_spec.js @@ -1,5 +1,8 @@ import Vue from 'vue'; import newDropdown from '~/repo/components/new_dropdown/index.vue'; +import RepoStore from '~/repo/stores/repo_store'; +import RepoHelper from '~/repo/helpers/repo_helper'; +import eventHub from '~/repo/event_hub'; import createComponent from '../../../helpers/vue_mount_component_helper'; describe('new dropdown component', () => { @@ -13,6 +16,10 @@ describe('new dropdown component', () => { afterEach(() => { vm.$destroy(); + + RepoStore.files = []; + RepoStore.openedFiles = []; + RepoStore.setViewToPreview(); }); it('renders new file and new directory links', () => { @@ -60,4 +67,125 @@ describe('new dropdown component', () => { .catch(done.fail); }); }); + + describe('createEntryInStore', () => { + ['tree', 'blob'].forEach((type) => { + describe(type, () => { + it('closes modal after creating file', () => { + vm.openModal = true; + + eventHub.$emit('createNewEntry', 'testing', type); + + expect(vm.openModal).toBeFalsy(); + }); + + it('sets editMode to true', () => { + eventHub.$emit('createNewEntry', 'testing', type); + + expect(RepoStore.editMode).toBeTruthy(); + }); + + it('toggles blob view', () => { + eventHub.$emit('createNewEntry', 'testing', type); + + expect(RepoStore.isPreviewView()).toBeFalsy(); + }); + + it('adds file into activeFiles', () => { + eventHub.$emit('createNewEntry', 'testing', type); + + expect(RepoStore.openedFiles.length).toBe(1); + }); + + it(`creates ${type} in the current stores path`, () => { + RepoStore.path = 'testing'; + + eventHub.$emit('createNewEntry', 'testing/app', type); + + expect(RepoStore.files[0].path).toBe('testing/app'); + expect(RepoStore.files[0].name).toBe('app'); + + if (type === 'tree') { + expect(RepoStore.files[0].files.length).toBe(1); + } + + RepoStore.path = ''; + }); + }); + }); + + describe('file', () => { + it('creates new file', () => { + eventHub.$emit('createNewEntry', 'testing', 'blob'); + + expect(RepoStore.files.length).toBe(1); + expect(RepoStore.files[0].name).toBe('testing'); + expect(RepoStore.files[0].type).toBe('blob'); + expect(RepoStore.files[0].tempFile).toBeTruthy(); + }); + + it('does not create temp file when file already exists', () => { + RepoStore.files.push(RepoHelper.serializeRepoEntity('blob', { + name: 'testing', + })); + + eventHub.$emit('createNewEntry', 'testing', 'blob'); + + expect(RepoStore.files.length).toBe(1); + expect(RepoStore.files[0].name).toBe('testing'); + expect(RepoStore.files[0].type).toBe('blob'); + expect(RepoStore.files[0].tempFile).toBeUndefined(); + }); + }); + + describe('tree', () => { + it('creates new tree', () => { + eventHub.$emit('createNewEntry', 'testing', 'tree'); + + expect(RepoStore.files.length).toBe(1); + expect(RepoStore.files[0].name).toBe('testing'); + expect(RepoStore.files[0].type).toBe('tree'); + expect(RepoStore.files[0].tempFile).toBeTruthy(); + expect(RepoStore.files[0].files.length).toBe(1); + expect(RepoStore.files[0].files[0].name).toBe('.gitkeep'); + }); + + it('creates multiple trees when entryName has slashes', () => { + eventHub.$emit('createNewEntry', 'app/test', 'tree'); + + expect(RepoStore.files.length).toBe(1); + expect(RepoStore.files[0].name).toBe('app'); + expect(RepoStore.files[0].files[0].name).toBe('test'); + expect(RepoStore.files[0].files[0].files[0].name).toBe('.gitkeep'); + }); + + it('creates tree in existing tree', () => { + RepoStore.files.push(RepoHelper.serializeRepoEntity('tree', { + name: 'app', + })); + + eventHub.$emit('createNewEntry', 'app/test', 'tree'); + + expect(RepoStore.files.length).toBe(1); + expect(RepoStore.files[0].name).toBe('app'); + expect(RepoStore.files[0].tempFile).toBeUndefined(); + expect(RepoStore.files[0].files[0].tempFile).toBeTruthy(); + expect(RepoStore.files[0].files[0].name).toBe('test'); + expect(RepoStore.files[0].files[0].files[0].name).toBe('.gitkeep'); + }); + + it('does not create new tree when already exists', () => { + RepoStore.files.push(RepoHelper.serializeRepoEntity('tree', { + name: 'app', + })); + + eventHub.$emit('createNewEntry', 'app', 'tree'); + + expect(RepoStore.files.length).toBe(1); + expect(RepoStore.files[0].name).toBe('app'); + expect(RepoStore.files[0].tempFile).toBeUndefined(); + expect(RepoStore.files[0].files.length).toBe(0); + }); + }); + }); }); diff --git a/spec/javascripts/repo/components/new_dropdown/modal_spec.js b/spec/javascripts/repo/components/new_dropdown/modal_spec.js index 671dca93a09..4c5cdc47c6e 100644 --- a/spec/javascripts/repo/components/new_dropdown/modal_spec.js +++ b/spec/javascripts/repo/components/new_dropdown/modal_spec.js @@ -1,7 +1,7 @@ import Vue from 'vue'; import RepoStore from '~/repo/stores/repo_store'; -import RepoHelper from '~/repo/helpers/repo_helper'; import modal from '~/repo/components/new_dropdown/modal.vue'; +import eventHub from '~/repo/event_hub'; import createComponent from '../../../helpers/vue_mount_component_helper'; describe('new file modal component', () => { @@ -21,6 +21,7 @@ describe('new file modal component', () => { beforeEach(() => { vm = createComponent(Component, { type, + currentPath: RepoStore.path, }); }); @@ -41,156 +42,35 @@ describe('new file modal component', () => { expect(vm.$el.querySelector('.label-light').textContent.trim()).toBe(`${title} name`); }); - - it('emits toggle event after creating file', () => { - spyOn(vm, '$emit'); - - vm.entryName = 'testing'; - vm.$el.querySelector('.btn-success').click(); - - expect(vm.$emit).toHaveBeenCalledWith('toggle'); - }); - - it('sets editMode to true', () => { - vm.entryName = 'testing'; - vm.$el.querySelector('.btn-success').click(); - - expect(RepoStore.editMode).toBeTruthy(); - }); - - it('toggles blob view', () => { - vm.entryName = 'testing'; - vm.$el.querySelector('.btn-success').click(); - - expect(RepoStore.isPreviewView()).toBeFalsy(); - }); - - it('adds file into activeFiles', () => { - vm.entryName = 'testing'; - vm.$el.querySelector('.btn-success').click(); - - expect(RepoStore.openedFiles.length).toBe(1); - }); - - it(`creates ${type} in the current stores path`, () => { - RepoStore.path = 'testing'; - vm.entryName = 'testing/app'; - - vm.$el.querySelector('.btn-success').click(); - - expect(RepoStore.files[0].path).toBe('testing/app'); - expect(RepoStore.files[0].name).toBe('app'); - - if (type === 'tree') { - expect(RepoStore.files[0].files.length).toBe(1); - } - - RepoStore.path = ''; - }); }); }); - describe('file', () => { - beforeEach(() => { - vm = createComponent(Component, { - type: 'blob', - }); - }); - - it('creates new file', () => { - vm.entryName = 'testing'; - vm.$el.querySelector('.btn-success').click(); - - expect(RepoStore.files.length).toBe(1); - expect(RepoStore.files[0].name).toBe('testing'); - expect(RepoStore.files[0].type).toBe('blob'); - expect(RepoStore.files[0].tempFile).toBeTruthy(); - }); + it('focuses field on mount', () => { + document.body.innerHTML += '<div class="js-test"></div>'; - it('does not create temp file when file already exists', () => { - RepoStore.files.push(RepoHelper.serializeRepoEntity('blob', { - name: 'testing', - })); + vm = createComponent(Component, { + type: 'tree', + currentPath: RepoStore.path, + }, '.js-test'); - vm.entryName = 'testing'; - vm.$el.querySelector('.btn-success').click(); + expect(document.activeElement).toBe(vm.$refs.fieldName); - expect(RepoStore.files.length).toBe(1); - expect(RepoStore.files[0].name).toBe('testing'); - expect(RepoStore.files[0].type).toBe('blob'); - expect(RepoStore.files[0].tempFile).toBeUndefined(); - }); + vm.$el.remove(); }); - describe('tree', () => { - beforeEach(() => { + describe('createEntryInStore', () => { + it('emits createNewEntry event', () => { + spyOn(eventHub, '$emit'); + vm = createComponent(Component, { type: 'tree', + currentPath: RepoStore.path, }); - }); - - it('creates new tree', () => { vm.entryName = 'testing'; - vm.$el.querySelector('.btn-success').click(); - - expect(RepoStore.files.length).toBe(1); - expect(RepoStore.files[0].name).toBe('testing'); - expect(RepoStore.files[0].type).toBe('tree'); - expect(RepoStore.files[0].tempFile).toBeTruthy(); - expect(RepoStore.files[0].files.length).toBe(1); - expect(RepoStore.files[0].files[0].name).toBe('.gitkeep'); - }); - it('creates multiple trees when entryName has slashes', () => { - vm.entryName = 'app/test'; - vm.$el.querySelector('.btn-success').click(); + vm.createEntryInStore(); - expect(RepoStore.files.length).toBe(1); - expect(RepoStore.files[0].name).toBe('app'); - expect(RepoStore.files[0].files[0].name).toBe('test'); - expect(RepoStore.files[0].files[0].files[0].name).toBe('.gitkeep'); + expect(eventHub.$emit).toHaveBeenCalledWith('createNewEntry', 'testing', 'tree'); }); - - it('creates tree in existing tree', () => { - RepoStore.files.push(RepoHelper.serializeRepoEntity('tree', { - name: 'app', - })); - - vm.entryName = 'app/test'; - vm.$el.querySelector('.btn-success').click(); - - expect(RepoStore.files.length).toBe(1); - expect(RepoStore.files[0].name).toBe('app'); - expect(RepoStore.files[0].tempFile).toBeUndefined(); - expect(RepoStore.files[0].files[0].tempFile).toBeTruthy(); - expect(RepoStore.files[0].files[0].name).toBe('test'); - expect(RepoStore.files[0].files[0].files[0].name).toBe('.gitkeep'); - }); - - it('does not create new tree when already exists', () => { - RepoStore.files.push(RepoHelper.serializeRepoEntity('tree', { - name: 'app', - })); - - vm.entryName = 'app'; - vm.$el.querySelector('.btn-success').click(); - - expect(RepoStore.files.length).toBe(1); - expect(RepoStore.files[0].name).toBe('app'); - expect(RepoStore.files[0].tempFile).toBeUndefined(); - expect(RepoStore.files[0].files.length).toBe(0); - }); - }); - - it('focuses field on mount', () => { - document.body.innerHTML += '<div class="js-test"></div>'; - - vm = createComponent(Component, { - type: 'tree', - }, '.js-test'); - - expect(document.activeElement).toBe(vm.$refs.fieldName); - - vm.$el.remove(); }); }); diff --git a/spec/javascripts/repo/components/repo_file_buttons_spec.js b/spec/javascripts/repo/components/repo_file_buttons_spec.js index 063186be42d..111c83ee50d 100644 --- a/spec/javascripts/repo/components/repo_file_buttons_spec.js +++ b/spec/javascripts/repo/components/repo_file_buttons_spec.js @@ -35,7 +35,6 @@ describe('RepoFileButtons', () => { const blame = vm.$el.querySelector('.blame'); const history = vm.$el.querySelector('.history'); - expect(vm.$el.id).toEqual('repo-file-buttons'); expect(raw.href).toMatch(`/${activeFile.raw_path}`); expect(raw.textContent.trim()).toEqual('Raw'); expect(blame.href).toMatch(`/${activeFile.blame_path}`); |