diff options
author | Phil Hughes <me@iamphill.com> | 2017-11-24 16:12:04 +0300 |
---|---|---|
committer | Phil Hughes <me@iamphill.com> | 2017-11-24 18:55:08 +0300 |
commit | 8f7ec95b86fb1b3c84ad8ff3de1f0eb35a93f972 (patch) | |
tree | bb52f77a470e160aeb68045e92f40cb857e9a912 /spec/javascripts/repo | |
parent | 4033e0aa359ef7979e5807919d4b37abfe146d5c (diff) |
added specs
fixed scss-lint
Diffstat (limited to 'spec/javascripts/repo')
7 files changed, 177 insertions, 33 deletions
diff --git a/spec/javascripts/repo/components/commit_sidebar/list_collapsed_spec.js b/spec/javascripts/repo/components/commit_sidebar/list_collapsed_spec.js new file mode 100644 index 00000000000..f750061a6a1 --- /dev/null +++ b/spec/javascripts/repo/components/commit_sidebar/list_collapsed_spec.js @@ -0,0 +1,33 @@ +import Vue from 'vue'; +import store from '~/repo/stores'; +import listCollapsed from '~/repo/components/commit_sidebar/list_collapsed.vue'; +import { createComponentWithStore } from '../../../helpers/vue_mount_component_helper'; +import { file } from '../../helpers'; + +describe('Multi-file editor commit sidebar list collapsed', () => { + let vm; + + beforeEach(() => { + const Component = Vue.extend(listCollapsed); + + vm = createComponentWithStore(Component, store); + + vm.$store.state.openFiles.push(file(), file()); + vm.$store.state.openFiles[0].tempFile = true; + vm.$store.state.openFiles.forEach((f) => { + Object.assign(f, { + changed: true, + }); + }); + + vm.$mount(); + }); + + afterEach(() => { + vm.$destroy(); + }); + + it('renders added & modified files count', () => { + expect(vm.$el.textContent.replace(/\s+/g, ' ').trim()).toBe('1 1'); + }); +}); diff --git a/spec/javascripts/repo/components/commit_sidebar/list_item_spec.js b/spec/javascripts/repo/components/commit_sidebar/list_item_spec.js new file mode 100644 index 00000000000..18c9b46fcd9 --- /dev/null +++ b/spec/javascripts/repo/components/commit_sidebar/list_item_spec.js @@ -0,0 +1,53 @@ +import Vue from 'vue'; +import listItem from '~/repo/components/commit_sidebar/list_item.vue'; +import mountComponent from '../../../helpers/vue_mount_component_helper'; +import { file } from '../../helpers'; + +describe('Multi-file editor commit sidebar list item', () => { + let vm; + let f; + + beforeEach(() => { + const Component = Vue.extend(listItem); + + f = file(); + + vm = mountComponent(Component, { + file: f, + }); + }); + + afterEach(() => { + vm.$destroy(); + }); + + it('renders file path', () => { + expect(vm.$el.querySelector('.multi-file-commit-list-path').textContent.trim()).toBe(f.path); + }); + + describe('computed', () => { + describe('iconName', () => { + it('returns modified when not a tempFile', () => { + expect(vm.iconName).toBe('file-modified'); + }); + + it('returns addition when not a tempFile', () => { + f.tempFile = true; + + expect(vm.iconName).toBe('file-addition'); + }); + }); + + describe('iconClass', () => { + it('returns modified when not a tempFile', () => { + expect(vm.iconClass).toContain('multi-file-modified'); + }); + + it('returns addition when not a tempFile', () => { + f.tempFile = true; + + expect(vm.iconClass).toContain('multi-file-addition'); + }); + }); + }); +}); diff --git a/spec/javascripts/repo/components/commit_sidebar/list_spec.js b/spec/javascripts/repo/components/commit_sidebar/list_spec.js new file mode 100644 index 00000000000..df7e3c5de21 --- /dev/null +++ b/spec/javascripts/repo/components/commit_sidebar/list_spec.js @@ -0,0 +1,72 @@ +import Vue from 'vue'; +import store from '~/repo/stores'; +import commitSidebarList from '~/repo/components/commit_sidebar/list.vue'; +import { createComponentWithStore } from '../../../helpers/vue_mount_component_helper'; +import { file } from '../../helpers'; + +describe('Multi-file editor commit sidebar list', () => { + let vm; + + beforeEach(() => { + const Component = Vue.extend(commitSidebarList); + + vm = createComponentWithStore(Component, store, { + title: 'Staged', + fileList: [], + collapsed: false, + }).$mount(); + }); + + afterEach(() => { + vm.$destroy(); + }); + + describe('empty file list', () => { + it('renders no changes text', () => { + expect(vm.$el.querySelector('.help-block').textContent.trim()).toBe('No changes'); + }); + }); + + describe('with a list of files', () => { + beforeEach((done) => { + const f = file('file name'); + f.changed = true; + vm.fileList.push(f); + + Vue.nextTick(done); + }); + + it('renders list', () => { + expect(vm.$el.querySelectorAll('li').length).toBe(1); + }); + }); + + describe('collapsed', () => { + beforeEach((done) => { + vm.collapsed = true; + + Vue.nextTick(done); + }); + + it('adds collapsed class', () => { + expect(vm.$el.querySelector('.is-collapsed')).not.toBeNull(); + }); + + it('hides list', () => { + expect(vm.$el.querySelector('.list-unstyled')).toBeNull(); + expect(vm.$el.querySelector('.help-block')).toBeNull(); + }); + + it('hides collapse button', () => { + expect(vm.$el.querySelector('.multi-file-commit-panel-collapse-btn')).toBeNull(); + }); + }); + + it('clicking toggle collapse button emits toggle event', () => { + spyOn(vm, '$emit'); + + vm.$el.querySelector('.multi-file-commit-panel-collapse-btn').click(); + + expect(vm.$emit).toHaveBeenCalledWith('toggleCollapsed'); + }); +}); diff --git a/spec/javascripts/repo/components/repo_commit_section_spec.js b/spec/javascripts/repo/components/repo_commit_section_spec.js index 0f991e1b727..1c794123095 100644 --- a/spec/javascripts/repo/components/repo_commit_section_spec.js +++ b/spec/javascripts/repo/components/repo_commit_section_spec.js @@ -25,8 +25,12 @@ describe('RepoCommitSection', () => { return comp.$mount(); } - beforeEach(() => { + beforeEach((done) => { vm = createComponent(); + + vm.collapsed = false; + + Vue.nextTick(done); }); afterEach(() => { @@ -36,12 +40,11 @@ describe('RepoCommitSection', () => { }); it('renders a commit section', () => { - const changedFileElements = [...vm.$el.querySelectorAll('.changed-files > li')]; - const submitCommit = vm.$el.querySelector('.btn'); - const targetBranch = vm.$el.querySelector('.target-branch'); + const changedFileElements = [...vm.$el.querySelectorAll('.multi-file-commit-list li')]; + const submitCommit = vm.$el.querySelector('form .btn'); - expect(vm.$el.querySelector(':scope > form')).toBeTruthy(); - expect(vm.$el.querySelector('.staged-files').textContent.trim()).toEqual('Staged files (2)'); + expect(vm.$el.querySelector('.multi-file-commit-form')).not.toBeNull(); + expect(vm.$el.querySelector('.multi-file-commit-panel-section header').textContent.trim()).toEqual('Staged'); expect(changedFileElements.length).toEqual(2); changedFileElements.forEach((changedFile, i) => { @@ -49,10 +52,7 @@ describe('RepoCommitSection', () => { }); expect(submitCommit.disabled).toBeTruthy(); - expect(submitCommit.querySelector('.fa-spinner.fa-spin')).toBeFalsy(); - expect(vm.$el.querySelector('.commit-summary').textContent.trim()).toEqual('Commit 2 files'); - expect(targetBranch.querySelector(':scope > label').textContent.trim()).toEqual('Target branch'); - expect(targetBranch.querySelector('.help-block').textContent.trim()).toEqual('master'); + expect(submitCommit.querySelector('.fa-spinner.fa-spin')).toBeNull(); }); describe('when submitting', () => { @@ -69,7 +69,7 @@ describe('RepoCommitSection', () => { }); it('allows you to submit', () => { - expect(vm.$el.querySelector('.btn').disabled).toBeTruthy(); + expect(vm.$el.querySelector('form .btn').disabled).toBeTruthy(); }); it('submits commit', (done) => { diff --git a/spec/javascripts/repo/components/repo_sidebar_spec.js b/spec/javascripts/repo/components/repo_sidebar_spec.js index 7cb4dace491..df7cf8aabbb 100644 --- a/spec/javascripts/repo/components/repo_sidebar_spec.js +++ b/spec/javascripts/repo/components/repo_sidebar_spec.js @@ -29,7 +29,6 @@ describe('RepoSidebar', () => { const thead = vm.$el.querySelector('thead'); const tbody = vm.$el.querySelector('tbody'); - expect(vm.$el.id).toEqual('sidebar'); expect(vm.$el.classList.contains('sidebar-mini')).toBeFalsy(); expect(thead.querySelector('.name').textContent.trim()).toEqual('Name'); expect(thead.querySelector('.last-commit').textContent.trim()).toEqual('Last commit'); @@ -40,18 +39,6 @@ describe('RepoSidebar', () => { expect(tbody.querySelector('.file')).toBeTruthy(); }); - it('does not render a thead, renders repo-file-options and sets sidebar-mini class if isMini', (done) => { - vm.$store.state.openFiles.push(vm.$store.state.tree[0]); - - Vue.nextTick(() => { - expect(vm.$el.classList.contains('sidebar-mini')).toBeTruthy(); - expect(vm.$el.querySelector('thead')).toBeTruthy(); - expect(vm.$el.querySelector('thead .repo-file-options')).toBeTruthy(); - - done(); - }); - }); - it('renders 5 loading files if tree is loading', (done) => { vm.$store.state.tree = []; vm.$store.state.loading = true; diff --git a/spec/javascripts/repo/components/repo_tab_spec.js b/spec/javascripts/repo/components/repo_tab_spec.js index df0ca55aafc..7d2174196c9 100644 --- a/spec/javascripts/repo/components/repo_tab_spec.js +++ b/spec/javascripts/repo/components/repo_tab_spec.js @@ -24,8 +24,8 @@ describe('RepoTab', () => { tab: file(), }); vm.$store.state.openFiles.push(vm.tab); - const close = vm.$el.querySelector('.close-btn'); - const name = vm.$el.querySelector(`a[title="${vm.tab.url}"]`); + const close = vm.$el.querySelector('.multi-file-tab-close'); + const name = vm.$el.querySelector(`[title="${vm.tab.url}"]`); expect(close.querySelector('.fa-times')).toBeTruthy(); expect(name.textContent.trim()).toEqual(vm.tab.name); @@ -50,7 +50,7 @@ describe('RepoTab', () => { spyOn(vm, 'closeFile'); - vm.$el.querySelector('.close-btn').click(); + vm.$el.querySelector('.multi-file-tab-close').click(); expect(vm.closeFile).toHaveBeenCalledWith({ file: vm.tab }); }); @@ -62,7 +62,7 @@ describe('RepoTab', () => { tab, }); - expect(vm.$el.querySelector('.close-btn .fa-circle')).toBeTruthy(); + expect(vm.$el.querySelector('.multi-file-tab-close .fa-circle')).not.toBeNull(); }); describe('methods', () => { @@ -77,7 +77,7 @@ describe('RepoTab', () => { vm.$store.state.openFiles.push(tab); vm.$store.dispatch('setFileActive', tab); - vm.$el.querySelector('.close-btn').click(); + vm.$el.querySelector('.multi-file-tab-close').click(); vm.$nextTick(() => { expect(tab.opened).toBeTruthy(); @@ -95,7 +95,7 @@ describe('RepoTab', () => { vm.$store.state.openFiles.push(tab); vm.$store.dispatch('setFileActive', tab); - vm.$el.querySelector('.close-btn').click(); + vm.$el.querySelector('.multi-file-tab-close').click(); vm.$nextTick(() => { expect(tab.opened).toBeFalsy(); diff --git a/spec/javascripts/repo/components/repo_tabs_spec.js b/spec/javascripts/repo/components/repo_tabs_spec.js index d0246cc72e6..1fb2242c051 100644 --- a/spec/javascripts/repo/components/repo_tabs_spec.js +++ b/spec/javascripts/repo/components/repo_tabs_spec.js @@ -25,12 +25,11 @@ describe('RepoTabs', () => { vm.$store.state.openFiles = openedFiles; vm.$nextTick(() => { - const tabs = [...vm.$el.querySelectorAll(':scope > li')]; + const tabs = [...vm.$el.querySelectorAll('.multi-file-tab')]; - expect(tabs.length).toEqual(3); + expect(tabs.length).toEqual(2); expect(tabs[0].classList.contains('active')).toBeTruthy(); expect(tabs[1].classList.contains('active')).toBeFalsy(); - expect(tabs[2].classList.contains('tabs-divider')).toBeTruthy(); done(); }); |