Commit 331fc541 authored by Natalia Tepluhina's avatar Natalia Tepluhina

Merge branch 'jdb/jestodus-tree-list-spec' into 'master'

Migrate tree_list_spec from karma to jest

See merge request gitlab-org/gitlab!26681
parents de66a69b 58196322
import Vue from 'vue';
import Vuex from 'vuex';
import { mountComponentWithStore } from 'spec/helpers/vue_mount_component_helper';
import { mount, createLocalVue } from '@vue/test-utils';
import TreeList from '~/diffs/components/tree_list.vue';
import createStore from '~/diffs/store/modules';
describe('Diffs tree list component', () => {
let Component;
let vm;
beforeAll(() => {
Component = Vue.extend(TreeList);
});
beforeEach(() => {
Vue.use(Vuex);
let wrapper;
const getFileRows = () => wrapper.findAll('.file-row');
const localVue = createLocalVue();
localVue.use(Vuex);
const createComponent = state => {
const store = new Vuex.Store({
modules: {
diffs: createStore(),
......@@ -22,26 +17,38 @@ describe('Diffs tree list component', () => {
});
// Setup initial state
store.state.diffs.addedLines = 10;
store.state.diffs.removedLines = 20;
store.state.diffs.diffFiles.push('test');
store.state.diffs = {
addedLines: 10,
removedLines: 20,
...store.state.diffs,
...state,
};
wrapper = mount(TreeList, {
store,
localVue,
propsData: { hideFileStats: false },
});
};
beforeEach(() => {
localStorage.removeItem('mr_diff_tree_list');
vm = mountComponentWithStore(Component, { store, props: { hideFileStats: false } });
createComponent();
});
afterEach(() => {
vm.$destroy();
wrapper.destroy();
});
it('renders empty text', () => {
expect(vm.$el.textContent).toContain('No files found');
expect(wrapper.text()).toContain('No files found');
});
describe('with files', () => {
beforeEach(done => {
Object.assign(vm.$store.state.diffs.treeEntries, {
beforeEach(() => {
const treeEntries = {
'index.js': {
addedLines: 0,
changed: true,
......@@ -62,64 +69,69 @@ describe('Diffs tree list component', () => {
type: 'tree',
tree: [],
},
};
createComponent({
treeEntries,
tree: [treeEntries['index.js'], treeEntries.app],
});
vm.$store.state.diffs.tree = [
vm.$store.state.diffs.treeEntries['index.js'],
vm.$store.state.diffs.treeEntries.app,
];
vm.$nextTick(done);
return wrapper.vm.$nextTick();
});
it('renders tree', () => {
expect(vm.$el.querySelectorAll('.file-row').length).toBe(2);
expect(vm.$el.querySelectorAll('.file-row')[0].textContent).toContain('index.js');
expect(vm.$el.querySelectorAll('.file-row')[1].textContent).toContain('app');
expect(getFileRows()).toHaveLength(2);
expect(
getFileRows()
.at(0)
.text(),
).toContain('index.js');
expect(
getFileRows()
.at(1)
.text(),
).toContain('app');
});
it('hides file stats', done => {
vm.hideFileStats = true;
vm.$nextTick(() => {
expect(vm.$el.querySelector('.file-row-stats')).toBe(null);
it('hides file stats', () => {
wrapper.setProps({ hideFileStats: true });
done();
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.find('.file-row-stats').exists()).toBe(false);
});
});
it('calls toggleTreeOpen when clicking folder', () => {
spyOn(vm.$store, 'dispatch').and.stub();
jest.spyOn(wrapper.vm.$store, 'dispatch').mockReturnValue(undefined);
vm.$el.querySelectorAll('.file-row')[1].click();
getFileRows()
.at(1)
.trigger('click');
expect(vm.$store.dispatch).toHaveBeenCalledWith('diffs/toggleTreeOpen', 'app');
expect(wrapper.vm.$store.dispatch).toHaveBeenCalledWith('diffs/toggleTreeOpen', 'app');
});
it('calls scrollToFile when clicking blob', () => {
spyOn(vm.$store, 'dispatch').and.stub();
jest.spyOn(wrapper.vm.$store, 'dispatch').mockReturnValue(undefined);
vm.$el.querySelector('.file-row').click();
wrapper.find('.file-row').trigger('click');
expect(vm.$store.dispatch).toHaveBeenCalledWith('diffs/scrollToFile', 'app/index.js');
expect(wrapper.vm.$store.dispatch).toHaveBeenCalledWith('diffs/scrollToFile', 'app/index.js');
});
it('renders as file list when renderTreeList is false', done => {
vm.$store.state.diffs.renderTreeList = false;
it('renders as file list when renderTreeList is false', () => {
wrapper.vm.$store.state.diffs.renderTreeList = false;
vm.$nextTick(() => {
expect(vm.$el.querySelectorAll('.file-row').length).toBe(1);
done();
return wrapper.vm.$nextTick().then(() => {
expect(getFileRows()).toHaveLength(1);
});
});
it('renders file paths when renderTreeList is false', done => {
vm.$store.state.diffs.renderTreeList = false;
vm.$nextTick(() => {
expect(vm.$el.querySelector('.file-row').textContent).toContain('index.js');
it('renders file paths when renderTreeList is false', () => {
wrapper.vm.$store.state.diffs.renderTreeList = false;
done();
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.find('.file-row').text()).toContain('index.js');
});
});
});
......
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