{
+ let Component;
+ let vm;
+
+ beforeAll(() => {
+ Component = Vue.extend(Button);
+ });
+
+ beforeEach(() => {
+ vm = mountComponent(Component, {
+ label: 'Testing',
+ icon: 'doc-new',
+ });
+
+ spyOn(vm, '$emit');
+ });
+
+ afterEach(() => {
+ vm.$destroy();
+ });
+
+ it('renders button with label', () => {
+ expect(vm.$el.textContent).toContain('Testing');
+ });
+
+ it('renders icon', () => {
+ expect(vm.$el.querySelector('.ic-doc-new')).not.toBe(null);
+ });
+
+ it('emits click event', () => {
+ vm.$el.click();
+
+ expect(vm.$emit).toHaveBeenCalledWith('click');
+ });
+
+ it('hides label if showLabel is false', done => {
+ vm.showLabel = false;
+
+ vm.$nextTick(() => {
+ expect(vm.$el.textContent).not.toContain('Testing');
+
+ done();
+ });
+ });
+});
diff --git a/spec/javascripts/ide/components/new_dropdown/index_spec.js b/spec/javascripts/ide/components/new_dropdown/index_spec.js
index 7b637f37eba..4d704b80209 100644
--- a/spec/javascripts/ide/components/new_dropdown/index_spec.js
+++ b/spec/javascripts/ide/components/new_dropdown/index_spec.js
@@ -13,6 +13,7 @@ describe('new dropdown component', () => {
vm = createComponentWithStore(component, store, {
branch: 'master',
path: '',
+ mouseOver: false,
});
vm.$store.state.currentProjectId = 'abcproject';
@@ -21,6 +22,8 @@ describe('new dropdown component', () => {
tree: [],
};
+ spyOn(vm, 'openNewEntryModal');
+
vm.$mount();
});
@@ -31,50 +34,23 @@ describe('new dropdown component', () => {
});
it('renders new file, upload and new directory links', () => {
- expect(vm.$el.querySelectorAll('a')[0].textContent.trim()).toBe('New file');
- expect(vm.$el.querySelectorAll('a')[1].textContent.trim()).toBe('Upload file');
- expect(vm.$el.querySelectorAll('a')[2].textContent.trim()).toBe('New directory');
+ const buttons = vm.$el.querySelectorAll('.dropdown-menu button');
+ expect(buttons[0].textContent.trim()).toBe('New file');
+ expect(buttons[1].textContent.trim()).toBe('Upload file');
+ expect(buttons[2].textContent.trim()).toBe('New directory');
});
describe('createNewItem', () => {
it('sets modalType to blob when new file is clicked', () => {
- vm.$el.querySelectorAll('a')[0].click();
+ vm.$el.querySelectorAll('.dropdown-menu button')[0].click();
- expect(vm.modalType).toBe('blob');
+ expect(vm.openNewEntryModal).toHaveBeenCalledWith({ type: 'blob', path: '' });
});
it('sets modalType to tree when new directory is clicked', () => {
- vm.$el.querySelectorAll('a')[2].click();
+ vm.$el.querySelectorAll('.dropdown-menu button')[2].click();
- expect(vm.modalType).toBe('tree');
- });
-
- it('opens modal when link is clicked', done => {
- vm.$el.querySelectorAll('a')[0].click();
-
- Vue.nextTick(() => {
- expect(vm.$el.querySelector('.modal')).not.toBeNull();
-
- done();
- });
- });
- });
-
- describe('hideModal', () => {
- beforeAll(done => {
- vm.openModal = true;
- Vue.nextTick(done);
- });
-
- it('closes modal after toggling', done => {
- vm.hideModal();
-
- Vue.nextTick()
- .then(() => {
- expect(vm.$el.querySelector('.modal')).toBeNull();
- })
- .then(done)
- .catch(done.fail);
+ expect(vm.openNewEntryModal).toHaveBeenCalledWith({ type: 'tree', path: '' });
});
});
diff --git a/spec/javascripts/ide/components/new_dropdown/modal_spec.js b/spec/javascripts/ide/components/new_dropdown/modal_spec.js
index f362ed4db65..6dcc5880677 100644
--- a/spec/javascripts/ide/components/new_dropdown/modal_spec.js
+++ b/spec/javascripts/ide/components/new_dropdown/modal_spec.js
@@ -1,6 +1,7 @@
import Vue from 'vue';
+import { createStore } from '~/ide/stores';
import modal from '~/ide/components/new_dropdown/modal.vue';
-import createComponent from 'spec/helpers/vue_mount_component_helper';
+import { createComponentWithStore } from 'spec/helpers/vue_mount_component_helper';
describe('new file modal component', () => {
const Component = Vue.extend(modal);
@@ -13,13 +14,15 @@ describe('new file modal component', () => {
['tree', 'blob'].forEach(type => {
describe(type, () => {
beforeEach(() => {
- vm = createComponent(Component, {
+ const store = createStore();
+ store.state.newEntryModal = {
type,
- branchId: 'master',
path: '',
- });
+ };
- vm.entryName = 'testing';
+ vm = createComponentWithStore(Component, store).$mount();
+
+ vm.name = 'testing';
});
it(`sets modal title as ${type}`, () => {
@@ -40,12 +43,11 @@ describe('new file modal component', () => {
describe('createEntryInStore', () => {
it('$emits create', () => {
- spyOn(vm, '$emit');
+ spyOn(vm, 'createTempEntry');
vm.createEntryInStore();
- expect(vm.$emit).toHaveBeenCalledWith('create', {
- branchId: 'master',
+ expect(vm.createTempEntry).toHaveBeenCalledWith({
name: 'testing',
type,
});
@@ -53,22 +55,4 @@ describe('new file modal component', () => {
});
});
});
-
- it('focuses field on mount', () => {
- document.body.innerHTML += '
';
-
- vm = createComponent(
- Component,
- {
- type: 'tree',
- branchId: 'master',
- path: '',
- },
- '.js-test',
- );
-
- expect(document.activeElement).toBe(vm.$refs.fieldName);
-
- vm.$el.remove();
- });
});
diff --git a/spec/javascripts/ide/components/new_dropdown/upload_spec.js b/spec/javascripts/ide/components/new_dropdown/upload_spec.js
index 2bc5d701601..9c76500cfe5 100644
--- a/spec/javascripts/ide/components/new_dropdown/upload_spec.js
+++ b/spec/javascripts/ide/components/new_dropdown/upload_spec.js
@@ -9,7 +9,6 @@ describe('new dropdown upload', () => {
const Component = Vue.extend(upload);
vm = createComponent(Component, {
- branchId: 'master',
path: '',
});
@@ -65,7 +64,6 @@ describe('new dropdown upload', () => {
expect(vm.$emit).toHaveBeenCalledWith('create', {
name: file.name,
- branchId: 'master',
type: 'blob',
content: target.result,
base64: false,
@@ -77,7 +75,6 @@ describe('new dropdown upload', () => {
expect(vm.$emit).toHaveBeenCalledWith('create', {
name: file.name,
- branchId: 'master',
type: 'blob',
content: binaryTarget.result.split('base64,')[1],
base64: true,