Commit 02e7ac9b authored by Phil Hughes's avatar Phil Hughes

fixed up the component specs

parent b1fd4ac3
......@@ -123,7 +123,7 @@ export default {
>
<div
v-if="shouldHideEditor"
v-html="activeFile.html"
v-html="file.html"
>
</div>
<div
......
<script>
import { mapActions } from 'vuex';
import timeAgoMixin from '~/vue_shared/mixins/timeago';
import skeletonLoadingContainer from '~/vue_shared/components/skeleton_loading_container.vue';
import fileIcon from '~/vue_shared/components/file_icon.vue';
import router from '../ide_router';
import newDropdown from './new_dropdown/index.vue';
import fileStatusIcon from './repo_file_status_icon.vue';
import changedFileIcon from './changed_file_icon.vue';
......@@ -16,9 +16,6 @@
fileIcon,
changedFileIcon,
},
mixins: [
timeAgoMixin,
],
props: {
file: {
type: Object,
......@@ -63,7 +60,7 @@
if (this.isTree && this.$router.currentRoute.path === `/project${this.file.url}`) {
this.toggleTreeOpen(this.file.path);
}
this.$router.push(`/project${this.file.url}`);
router.push(`/project${this.file.url}`);
},
},
};
......
......@@ -33,42 +33,5 @@ describe('Multi-file editor right context bar', () => {
it('adds collapsed class', () => {
expect(vm.$el.querySelector('.is-collapsed')).not.toBeNull();
});
it('shows correct icon', () => {
expect(vm.currentIcon).toBe('angle-double-left');
});
it('clicking sidebar collapses the bar', () => {
spyOn(vm, 'setPanelCollapsedStatus').and.returnValue(Promise.resolve());
vm.$el.querySelector('.multi-file-commit-panel-section').click();
expect(vm.setPanelCollapsedStatus).toHaveBeenCalledWith({
side: 'right',
collapsed: false,
});
});
});
it('clicking toggle collapse button collapses the bar', () => {
spyOn(vm, 'setPanelCollapsedStatus').and.returnValue(Promise.resolve());
vm.$el.querySelector('.multi-file-commit-panel-collapse-btn').click();
expect(vm.setPanelCollapsedStatus).toHaveBeenCalledWith({
side: 'right',
collapsed: true,
});
});
it('when expanded clicking the main sidebar is not collapsing the bar', () => {
spyOn(vm, 'setPanelCollapsedStatus').and.returnValue(Promise.resolve());
vm.$el.querySelector('.multi-file-commit-panel-section').click();
expect(vm.setPanelCollapsedStatus).not.toHaveBeenCalledWith({
side: 'right',
collapsed: false,
});
});
});
import Vue from 'vue';
import store from 'ee/ide/stores';
import ideRepoTree from 'ee/ide/components/ide_repo_tree.vue';
import { file, resetStore } from '../helpers';
import createComponent from '../../helpers/vue_mount_component_helper';
import { file } from '../helpers';
describe('IdeRepoTree', () => {
let vm;
let tree;
beforeEach(() => {
const IdeRepoTree = Vue.extend(ideRepoTree);
vm = new IdeRepoTree({
store,
propsData: {
treeId: 'abcproject/mybranch',
},
});
vm.$store.state.currentBranch = 'master';
vm.$store.state.trees['abcproject/mybranch'] = {
tree = {
tree: [file()],
loading: false,
};
vm.$mount();
vm = createComponent(IdeRepoTree, {
tree,
});
});
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
it('renders a sidebar', () => {
expect(vm.$el.classList.contains('sidebar-mini')).toBeFalsy();
expect(vm.$el.querySelector('.repo-file-options')).toBeFalsy();
expect(vm.$el.querySelector('.loading-file')).toBeFalsy();
expect(vm.$el.querySelector('.file')).toBeTruthy();
expect(vm.$el.querySelector('.loading-file')).toBeNull();
expect(vm.$el.querySelector('.file')).not.toBeNull();
});
it('renders 3 loading files if tree is loading', (done) => {
vm.$store.state.trees['123'] = {
tree: [],
loading: true,
};
vm.treeId = '123';
tree.loading = true;
Vue.nextTick(() => {
vm.$nextTick(() => {
expect(vm.$el.querySelectorAll('.multi-file-loading-container').length).toEqual(3);
done();
......
......@@ -11,8 +11,6 @@ describe('IdeSidebar', () => {
const Component = Vue.extend(ideSidebar);
vm = createComponentWithStore(Component, store).$mount();
vm.$store.state.leftPanelCollapsed = false;
});
afterEach(() => {
......@@ -25,19 +23,14 @@ describe('IdeSidebar', () => {
expect(vm.$el.querySelector('.multi-file-commit-panel-inner')).not.toBeNull();
});
describe('collapsed', () => {
beforeEach((done) => {
vm.$store.state.leftPanelCollapsed = true;
Vue.nextTick(done);
});
it('renders loading icon component', (done) => {
vm.$store.state.loading = true;
it('adds collapsed class', () => {
expect(vm.$el.classList).toContain('is-collapsed');
});
vm.$nextTick(() => {
expect(vm.$el.querySelector('.multi-file-loading-container')).not.toBeNull();
expect(vm.$el.querySelectorAll('.multi-file-loading-container').length).toBe(3);
it('shows correct icon', () => {
expect(vm.currentIcon).toBe('angle-double-right');
done();
});
});
});
......@@ -2,7 +2,7 @@ import Vue from 'vue';
import store from 'ee/ide/stores';
import newDropdown from 'ee/ide/components/new_dropdown/index.vue';
import { createComponentWithStore } from 'spec/helpers/vue_mount_component_helper';
import { resetStore } from '../../helpers';
import { file, resetStore } from '../../helpers';
describe('new dropdown component', () => {
let vm;
......@@ -17,6 +17,9 @@ describe('new dropdown component', () => {
vm.$store.state.currentProjectId = 'abcproject';
vm.$store.state.path = '';
vm.$store.state.trees['abcproject/mybranch'] = {
tree: [],
};
vm.$mount();
});
......@@ -74,4 +77,123 @@ describe('new dropdown component', () => {
.catch(done.fail);
});
});
// TODO: move all this to the action spec
describe('createTempEntry', () => {
['tree', 'blob'].forEach((type) => {
if (type === 'blob') {
it('creates new file', (done) => {
vm.createTempEntry({
branchId: 'mybranch',
name: 'testing',
type,
}).then(() => {
const baseTree = vm.$store.state.trees['abcproject/mybranch'].tree;
expect(baseTree.length).toBe(1);
expect(baseTree[0].name).toBe('testing');
expect(baseTree[0].type).toBe('blob');
expect(baseTree[0].tempFile).toBeTruthy();
done();
})
.catch(done.fail);
});
it('does not create temp file when file already exists', (done) => {
const baseTree = vm.$store.state.trees['abcproject/mybranch'].tree;
baseTree.push(file('testing', '1', type));
vm.createTempEntry({
branchId: 'mybranch',
name: 'testing',
type,
})
.then(() => {
expect(baseTree.length).toBe(1);
expect(baseTree[0].name).toBe('testing');
expect(baseTree[0].type).toBe('blob');
expect(baseTree[0].tempFile).toBeFalsy();
done();
})
.catch(done.fail);
});
} else {
it('creates new tree', (done) => {
vm.createTempEntry({
branchId: 'mybranch',
name: 'testing',
type,
})
.then(() => {
const baseTree = vm.$store.state.trees['abcproject/mybranch'].tree;
expect(baseTree.length).toBe(1);
expect(baseTree[0].name).toBe('testing');
expect(baseTree[0].type).toBe('tree');
expect(baseTree[0].tempFile).toBeTruthy();
done();
})
.catch(done.fail);
});
it('creates multiple trees when entryName has slashes', (done) => {
vm.createTempEntry({
branchId: 'mybranch',
name: 'app/test',
type,
})
.then(() => {
const baseTree = vm.$store.state.trees['abcproject/mybranch'].tree;
expect(baseTree.length).toBe(1);
expect(baseTree[0].name).toBe('app');
done();
})
.catch(done.fail);
});
it('creates tree in existing tree', (done) => {
const f = file('app', '1', 'tree');
const baseTree = vm.$store.state.trees['abcproject/mybranch'].tree;
baseTree.push(f);
vm.$store.state.entries[f.path] = f;
vm.entryName = 'app/test';
vm.createTempEntry({
branchId: 'mybranch',
name: 'app/test',
type,
}).then(() => {
expect(baseTree.length).toBe(1);
// console.log(baseTree[0].tree);
expect(baseTree[0].name).toBe('app');
expect(baseTree[0].tempFile).toBeFalsy();
expect(baseTree[0].tree[0].tempFile).toBeTruthy();
expect(baseTree[0].tree[0].name).toBe('test');
done();
}).catch(done.fail);
});
it('does not create new tree when already exists', (done) => {
const baseTree = vm.$store.state.trees['abcproject/mybranch'].tree;
baseTree.push(file('app', '1', 'tree'));
vm.createTempEntry({
branchId: 'mybranch',
name: 'app',
type,
}).then(() => {
expect(baseTree.length).toBe(1);
expect(baseTree[0].name).toBe('app');
expect(baseTree[0].tempFile).toBeFalsy();
expect(baseTree[0].tree.length).toBe(0);
done();
}).catch(done.fail);
});
}
});
});
});
import Vue from 'vue';
import store from 'ee/ide/stores';
import service from 'ee/ide/services';
import modal from 'ee/ide/components/new_dropdown/modal.vue';
import router from 'ee/ide/ide_router';
import { createComponentWithStore } from 'spec/helpers/vue_mount_component_helper';
import { file, resetStore } from '../../helpers';
import createComponent from 'spec/helpers/vue_mount_component_helper';
describe('new file modal component', () => {
const Component = Vue.extend(modal);
let vm;
let projectTree;
beforeEach(() => {
spyOn(service, 'getProjectData').and.returnValue(Promise.resolve({
data: {
id: '123',
},
}));
spyOn(service, 'getBranchData').and.returnValue(Promise.resolve({
data: {
commit: {
id: '123branch',
},
},
}));
spyOn(service, 'getTreeData').and.returnValue(Promise.resolve({
headers: {
'page-title': 'test',
},
json: () => Promise.resolve({
last_commit_path: 'last_commit_path',
parent_tree_url: 'parent_tree_url',
path: '/',
trees: [{ name: 'tree' }],
blobs: [{ name: 'blob' }],
submodules: [{ name: 'submodule' }],
}),
}));
spyOn(router, 'push');
});
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
['tree', 'blob'].forEach((type) => {
describe(type, () => {
beforeEach(() => {
store.state.projects.abcproject = {
web_url: '',
};
store.state.trees = [];
store.state.trees['abcproject/mybranch'] = {
tree: [],
};
projectTree = store.state.trees['abcproject/mybranch'];
store.state.currentProjectId = 'abcproject';
vm = createComponentWithStore(Component, store, {
vm = createComponent(Component, {
type,
branchId: 'master',
path: '',
parent: projectTree,
});
vm.entryName = 'testing';
vm.$mount();
});
it(`sets modal title as ${type}`, () => {
......@@ -93,122 +41,17 @@ describe('new file modal component', () => {
});
describe('createEntryInStore', () => {
it('calls createTempEntry', () => {
spyOn(vm, 'createTempEntry');
it('$emits create', () => {
spyOn(vm, '$emit');
vm.createEntryInStore();
expect(vm.createTempEntry).toHaveBeenCalledWith({
projectId: 'abcproject',
expect(vm.$emit).toHaveBeenCalledWith('create', {
branchId: 'master',
parent: projectTree,
name: 'testing',
type,
});
});
it('sets editMode to true', (done) => {
vm.createEntryInStore();
setTimeout(() => {
expect(vm.$store.state.editMode).toBeTruthy();
done();
});
});
it('opens newly created file', (done) => {
if (type === 'blob') {
vm.createEntryInStore();
setTimeout(() => {
expect(vm.$store.state.openFiles.length).toBe(1);
expect(vm.$store.state.openFiles[0].name).toBe(type === 'blob' ? 'testing' : '.gitkeep');
done();
});
} else {
done();
}
});
if (type === 'blob') {
it('creates new file', (done) => {
vm.createEntryInStore();
setTimeout(() => {
const baseTree = vm.$store.state.trees['abcproject/mybranch'].tree;
expect(baseTree.length).toBe(1);
expect(baseTree[0].name).toBe('testing');
expect(baseTree[0].type).toBe('blob');
expect(baseTree[0].tempFile).toBeTruthy();
done();
});
});
it('does not create temp file when file already exists', (done) => {
const baseTree = vm.$store.state.trees['abcproject/mybranch'].tree;
baseTree.push(file('testing', '1', type));
vm.createEntryInStore();
setTimeout(() => {
expect(baseTree.length).toBe(1);
expect(baseTree[0].name).toBe('testing');
expect(baseTree[0].type).toBe('blob');
expect(baseTree[0].tempFile).toBeFalsy();
done();
});
});
} else {
it('creates new tree', () => {
vm.createEntryInStore();
const baseTree = vm.$store.state.trees['abcproject/mybranch'].tree;
expect(baseTree.length).toBe(1);
expect(baseTree[0].name).toBe('testing');
expect(baseTree[0].type).toBe('tree');
expect(baseTree[0].tempFile).toBeTruthy();
});
it('creates multiple trees when entryName has slashes', () => {
vm.entryName = 'app/test';
vm.createEntryInStore();
const baseTree = vm.$store.state.trees['abcproject/mybranch'].tree;
expect(baseTree.length).toBe(1);
expect(baseTree[0].name).toBe('app');
});
it('creates tree in existing tree', () => {
const baseTree = vm.$store.state.trees['abcproject/mybranch'].tree;
baseTree.push(file('app', '1', 'tree'));
vm.entryName = 'app/test';
vm.createEntryInStore();
expect(baseTree.length).toBe(1);
expect(baseTree[0].name).toBe('app');
expect(baseTree[0].tempFile).toBeFalsy();
expect(baseTree[0].tree[0].tempFile).toBeTruthy();
expect(baseTree[0].tree[0].name).toBe('test');
});
it('does not create new tree when already exists', () => {
const baseTree = vm.$store.state.trees['abcproject/mybranch'].tree;
baseTree.push(file('app', '1', 'tree'));
vm.entryName = 'app';
vm.createEntryInStore();
expect(baseTree.length).toBe(1);
expect(baseTree[0].name).toBe('app');
expect(baseTree[0].tempFile).toBeFalsy();
expect(baseTree[0].tree.length).toBe(0);
});
}
});
});
});
......@@ -216,12 +59,11 @@ describe('new file modal component', () => {
it('focuses field on mount', () => {
document.body.innerHTML += '<div class="js-test"></div>';
vm = createComponentWithStore(Component, store, {
vm = createComponent(Component, {
type: 'tree',
projectId: 'abcproject',
branchId: 'master',
path: '',
}).$mount('.js-test');
}, '.js-test');
expect(document.activeElement).toBe(vm.$refs.fieldName);
......
import Vue from 'vue';
import upload from 'ee/ide/components/new_dropdown/upload.vue';
import store from 'ee/ide/stores';
import service from 'ee/ide/services';
import router from 'ee/ide/ide_router';
import { createComponentWithStore } from 'spec/helpers/vue_mount_component_helper';
import { resetStore } from '../../helpers';
import createComponent from 'spec/helpers/vue_mount_component_helper';
describe('new dropdown upload', () => {
let vm;
let projectTree;
beforeEach(() => {
spyOn(service, 'getProjectData').and.returnValue(Promise.resolve({
data: {
id: '123',
},
}));
spyOn(service, 'getBranchData').and.returnValue(Promise.resolve({
data: {
commit: {
id: '123branch',
},
},
}));
spyOn(service, 'getTreeData').and.returnValue(Promise.resolve({
headers: {
'page-title': 'test',
},
json: () => Promise.resolve({
last_commit_path: 'last_commit_path',
parent_tree_url: 'parent_tree_url',
path: '/',
trees: [{ name: 'tree' }],
blobs: [{ name: 'blob' }],
submodules: [{ name: 'submodule' }],
}),
}));
spyOn(router, 'push');
const Component = Vue.extend(upload);
store.state.projects.abcproject = {
web_url: '',
};
store.state.currentProjectId = 'abcproject';
store.state.trees = [];
store.state.trees['abcproject/mybranch'] = {
tree: [],
};
projectTree = store.state.trees['abcproject/mybranch'];
vm = createComponentWithStore(Component, store, {
vm = createComponent(Component, {
branchId: 'master',
path: '',
parent: projectTree,
});
vm.entryName = 'testing';
vm.$mount();
spyOn(vm, '$emit');
});
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
describe('readFile', () => {
......@@ -108,53 +60,27 @@ describe('new dropdown upload', () => {
name: 'file',
};
it('creates new file', (done) => {
it('creates new file', () => {
vm.createFile(target, file, true);
vm.$nextTick(() => {
const baseTree = vm.$store.state.trees['abcproject/mybranch'].tree;
expect(baseTree.length).toBe(1);
expect(baseTree[0].name).toBe(file.name);
expect(baseTree[0].content).toBe(target.result);
done();
expect(vm.$emit).toHaveBeenCalledWith('create', {
name: file.name,
branchId: 'master',
type: 'blob',
content: target.result,
base64: false,
});
});
it('creates new file in path', (done) => {
const baseTree = vm.$store.state.trees['abcproject/mybranch'].tree;
const tree = {
type: 'tree',
name: 'testing',
path: 'testing',
tree: [],
};
baseTree.push(tree);
vm.parent = tree;
vm.createFile(target, file, true);
vm.$nextTick(() => {
expect(baseTree.length).toBe(1);
expect(baseTree[0].tree[0].name).toBe(file.name);
expect(baseTree[0].tree[0].content).toBe(target.result);
expect(baseTree[0].tree[0].path).toBe(`testing/${file.name}`);
done();
});
});
it('splits content on base64 if binary', (done) => {
it('splits content on base64 if binary', () => {
vm.createFile(binaryTarget, file, false);
vm.$nextTick(() => {
const baseTree = vm.$store.state.trees['abcproject/mybranch'].tree;
expect(baseTree.length).toBe(1);
expect(baseTree[0].name).toBe(file.name);
expect(baseTree[0].content).toBe(binaryTarget.result.split('base64,')[1]);
expect(baseTree[0].base64).toBe(true);
done();
expect(vm.$emit).toHaveBeenCalledWith('create', {
name: file.name,
branchId: 'master',
type: 'blob',
content: binaryTarget.result.split('base64,')[1],
base64: true,
});
});
});
......
......@@ -3,6 +3,7 @@ import store from 'ee/ide/stores';
import repoEditor from 'ee/ide/components/repo_editor.vue';
import monacoLoader from 'ee/ide/monaco_loader';
import Editor from 'ee/ide/lib/editor';
import { createComponentWithStore } from '../../helpers/vue_mount_component_helper';
import { file, resetStore } from '../helpers';
describe('RepoEditor', () => {
......@@ -12,14 +13,15 @@ describe('RepoEditor', () => {
const f = file();
const RepoEditor = Vue.extend(repoEditor);
vm = new RepoEditor({
store,
vm = createComponentWithStore(RepoEditor, store, {
file: f,
});
f.active = true;
f.tempFile = true;
f.html = 'testing';
vm.$store.state.openFiles.push(f);
vm.$store.getters.activeFile.html = 'testing';
vm.$store.state.entries[f.path] = f;
vm.monaco = true;
vm.$mount();
......@@ -47,9 +49,9 @@ describe('RepoEditor', () => {
describe('when open file is binary and not raw', () => {
beforeEach((done) => {
vm.$store.getters.activeFile.binary = true;
vm.file.binary = true;
Vue.nextTick(done);
vm.$nextTick(done);
});
it('does not render the IDE', () => {
......@@ -69,7 +71,7 @@ describe('RepoEditor', () => {
vm.setupEditor();
expect(vm.editor.createModel).toHaveBeenCalledWith(vm.$store.getters.activeFile);
expect(vm.editor.createModel).toHaveBeenCalledWith(vm.file);
expect(vm.model).not.toBeNull();
});
......@@ -98,7 +100,7 @@ describe('RepoEditor', () => {
vm.model.setValue('testing 123');
setTimeout(() => {
expect(vm.$store.getters.activeFile.content).toBe('testing 123');
expect(vm.file.content).toBe('testing 123');
done();
});
......
import Vue from 'vue';
import store from 'ee/ide/stores';
import repoFileButtons from 'ee/ide/components/repo_file_buttons.vue';
import { file, resetStore } from '../helpers';
import createVueComponent from '../../helpers/vue_mount_component_helper';
import { file } from '../helpers';
describe('RepoFileButtons', () => {
const activeFile = file();
......@@ -13,18 +13,14 @@ describe('RepoFileButtons', () => {
activeFile.rawPath = 'test';
activeFile.blamePath = 'test';
activeFile.commitsPath = 'test';
activeFile.active = true;
store.state.openFiles.push(activeFile);
return new RepoFileButtons({
store,
}).$mount();
return createVueComponent(RepoFileButtons, {
file: activeFile,
});
}
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
it('renders Raw, Blame, History, Permalink and Preview toggle', (done) => {
......
import Vue from 'vue';
import store from 'ee/ide/stores';
import repoFile from 'ee/ide/components/repo_file.vue';
import { file, resetStore } from '../helpers';
import router from 'ee/ide/ide_router';
import { createComponentWithStore } from '../../helpers/vue_mount_component_helper';
import { file } from '../helpers';
describe('RepoFile', () => {
const updated = 'updated';
let vm;
function createComponent(propsData) {
const RepoFile = Vue.extend(repoFile);
return new RepoFile({
store,
propsData,
}).$mount();
vm = createComponentWithStore(RepoFile, store, propsData);
vm.$mount();
}
afterEach(() => {
resetStore(vm.$store);
vm.$destroy();
});
it('renders link, icon and name', () => {
const RepoFile = Vue.extend(repoFile);
vm = new RepoFile({
store,
propsData: {
file: file('t4'),
},
createComponent({
file: file('t4'),
level: 0,
});
spyOn(vm, 'timeFormated').and.returnValue(updated);
vm.$mount();
const name = vm.$el.querySelector('.ide-file-name');
......@@ -37,59 +32,16 @@ describe('RepoFile', () => {
expect(name.textContent.trim()).toEqual(vm.file.name);
});
it('does render if hasFiles is true and is loading tree', () => {
vm = createComponent({
file: file('t1'),
});
expect(vm.$el.querySelector('.fa-spin.fa-spinner')).toBeFalsy();
});
it('does not render commit message and datetime if mini', (done) => {
vm = createComponent({
file: file('t2'),
});
vm.$store.state.openFiles.push(vm.file);
vm.$nextTick(() => {
expect(vm.$el.querySelector('.commit-message')).toBeFalsy();
expect(vm.$el.querySelector('.commit-update')).toBeFalsy();
done();
});
});
it('fires clickFile when the link is clicked', () => {
vm = createComponent({
spyOn(router, 'push');
createComponent({
file: file('t3'),
level: 0,
});
spyOn(vm, 'clickFile');
vm.$el.querySelector('.file-name').click();
expect(vm.clickFile).toHaveBeenCalledWith(vm.file);
});
describe('submodule', () => {
let f;
beforeEach(() => {
f = file('submodule name', '123456789');
f.type = 'submodule';
vm = createComponent({
file: f,
});
});
afterEach(() => {
vm.$destroy();
});
it('renders submodule short ID', () => {
expect(vm.$el.querySelector('.commit-sha').textContent.trim()).toBe('12345678');
});
expect(router.push).toHaveBeenCalledWith(`/project${vm.file.url}`);
});
describe('locked file', () => {
......@@ -104,15 +56,12 @@ describe('RepoFile', () => {
},
};
vm = createComponent({
createComponent({
file: f,
level: 0,
});
});
afterEach(() => {
vm.$destroy();
});
it('renders lock icon', () => {
expect(vm.$el.querySelector('.file-status-icon')).not.toBeNull();
});
......
......@@ -21,6 +21,8 @@ describe('RepoTab', () => {
});
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
......@@ -57,7 +59,7 @@ describe('RepoTab', () => {
vm.$el.querySelector('.multi-file-tab-close').click();
expect(vm.closeFile).toHaveBeenCalledWith(vm.tab);
expect(vm.closeFile).toHaveBeenCalledWith(vm.tab.path);
});
it('changes icon on hover', (done) => {
......@@ -125,7 +127,8 @@ describe('RepoTab', () => {
});
vm.$store.state.openFiles.push(tab);
vm.$store.state.changedFiles.push(tab);
vm.$store.dispatch('setFileActive', tab);
vm.$store.state.entries[tab.path] = tab;
vm.$store.dispatch('setFileActive', tab.path);
vm.$el.querySelector('.multi-file-tab-close').click();
......@@ -144,7 +147,8 @@ describe('RepoTab', () => {
tab,
});
vm.$store.state.openFiles.push(tab);
vm.$store.dispatch('setFileActive', tab);
vm.$store.state.entries[tab.path] = tab;
vm.$store.dispatch('setFileActive', tab.path);
vm.$el.querySelector('.multi-file-tab-close').click();
......
import Vue from 'vue';
import store from 'ee/ide/stores';
import repoTabs from 'ee/ide/components/repo_tabs.vue';
import { file, resetStore } from '../helpers';
import createComponent from '../../helpers/vue_mount_component_helper';
import { file } from '../helpers';
describe('RepoTabs', () => {
const openedFiles = [file('open1'), file('open2')];
const RepoTabs = Vue.extend(repoTabs);
let vm;
function createComponent() {
const RepoTabs = Vue.extend(repoTabs);
return new RepoTabs({
store,
}).$mount();
}
afterEach(() => {
resetStore(vm.$store);
vm.$destroy();
});
it('renders a list of tabs', (done) => {
vm = createComponent();
vm = createComponent(RepoTabs, {
files: openedFiles,
});
openedFiles[0].active = true;
vm.$store.state.openFiles = openedFiles;
vm.$nextTick(() => {
const tabs = [...vm.$el.querySelectorAll('.multi-file-tab')];
expect(tabs.length).toEqual(2);
expect(tabs[0].classList.contains('active')).toBeTruthy();
expect(tabs[1].classList.contains('active')).toBeFalsy();
expect(tabs[0].classList.contains('active')).toEqual(true);
expect(tabs[1].classList.contains('active')).toEqual(false);
done();
});
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment