Commit 49b42dff authored by Kushal Pandya's avatar Kushal Pandya

Merge branch 'himkp-jest-operations-2' into 'master'

Migrate ee/operations specs to Jest

Closes #194299

See merge request gitlab-org/gitlab!34164
parents f71b8620 09375740
......@@ -4,8 +4,8 @@ import Vuex from 'vuex';
import Project from 'ee/operations/components/dashboard/project.vue';
import Dashboard from 'ee/operations/components/dashboard/dashboard.vue';
import createStore from 'ee/vue_shared/dashboards/store';
import timeoutPromise from 'spec/helpers/set_timeout_promise_helper';
import { trimText } from 'spec/helpers/text_helper';
import waitForPromises from 'helpers/wait_for_promises';
import { trimText } from 'helpers/text_helper';
import axios from '~/lib/utils/axios_utils';
import { mockProjectData, mockText } from '../../mock_data';
......@@ -15,13 +15,12 @@ localVue.use(Vuex);
describe('dashboard component', () => {
const mockAddEndpoint = 'mock-addPath';
const mockListEndpoint = 'mock-listPath';
const DashboardComponent = localVue.extend(Dashboard);
const store = createStore();
let wrapper;
let mockAxios;
const mountComponent = () =>
mount(DashboardComponent, {
mount(Dashboard, {
store,
localVue,
propsData: {
......@@ -67,26 +66,25 @@ describe('dashboard component', () => {
});
describe('when a project is added', () => {
it('immediately requests the project list again', done => {
it('immediately requests the project list again', () => {
mockAxios.reset();
mockAxios.onGet(mockListEndpoint).replyOnce(200, { projects: mockProjectData(2) });
mockAxios.onPost(mockAddEndpoint).replyOnce(200, { added: [1], invalid: [] });
wrapper.vm
return wrapper.vm
.$nextTick()
.then(() => {
wrapper.vm.projectClicked({ id: 1 });
})
.then(timeoutPromise)
.then(waitForPromises)
.then(() => {
wrapper.vm.onOk();
})
.then(timeoutPromise)
.then(waitForPromises)
.then(() => {
expect(store.state.projects.length).toEqual(2);
expect(wrapper.findAll(Project).length).toEqual(2);
done();
})
.catch(done.fail);
});
});
});
});
......@@ -104,7 +102,7 @@ describe('dashboard component', () => {
it('includes a dashboard project component for each project', () => {
const projectComponents = wrapper.findAll(Project);
expect(projectComponents.length).toBe(projectCount);
expect(projectComponents).toHaveLength(projectCount);
});
it('passes each project to the dashboard project component', () => {
......@@ -115,7 +113,7 @@ describe('dashboard component', () => {
});
it('dispatches setProjects when projects changes', () => {
const dispatch = spyOn(wrapper.vm.$store, 'dispatch');
const dispatch = jest.spyOn(wrapper.vm.$store, 'dispatch').mockImplementation(() => {});
const projects = mockProjectData(3);
wrapper.vm.projects = projects;
......@@ -124,20 +122,17 @@ describe('dashboard component', () => {
});
describe('when a project is removed', () => {
it('immediately requests the project list again', done => {
it('immediately requests the project list again', () => {
mockAxios.reset();
mockAxios.onDelete(store.state.projects[0].remove_path).reply(200);
mockAxios.onGet(mockListEndpoint).replyOnce(200, { projects: [] });
wrapper.find('button.js-remove-button').vm.$emit('click');
timeoutPromise()
.then(() => {
expect(store.state.projects.length).toEqual(0);
expect(wrapper.findAll(Project).length).toEqual(0);
done();
})
.catch(done.fail);
return waitForPromises().then(() => {
expect(store.state.projects.length).toEqual(0);
expect(wrapper.findAll(Project).length).toEqual(0);
});
});
});
});
......@@ -148,69 +143,64 @@ describe('dashboard component', () => {
store.state.selectedProjects = mockProjectData(1);
});
it('clears state when adding a valid project', done => {
it('clears state when adding a valid project', () => {
mockAxios.onPost(mockAddEndpoint).replyOnce(200, { added: [1], invalid: [] });
wrapper.vm
return wrapper.vm
.$nextTick()
.then(() => {
wrapper.vm.onOk();
})
.then(timeoutPromise)
.then(waitForPromises)
.then(() => {
expect(store.state.projectSearchResults.length).toEqual(0);
expect(store.state.selectedProjects.length).toEqual(0);
done();
})
.catch(done.fail);
expect(store.state.projectSearchResults).toHaveLength(0);
expect(store.state.selectedProjects).toHaveLength(0);
});
});
it('clears state when adding an invalid project', done => {
it('clears state when adding an invalid project', () => {
mockAxios.onPost(mockAddEndpoint).replyOnce(200, { added: [], invalid: [1] });
wrapper.vm
return wrapper.vm
.$nextTick()
.then(() => {
wrapper.vm.onOk();
})
.then(timeoutPromise)
.then(waitForPromises)
.then(() => {
expect(store.state.projectSearchResults.length).toEqual(0);
expect(store.state.selectedProjects.length).toEqual(0);
done();
})
.catch(done.fail);
expect(store.state.projectSearchResults).toHaveLength(0);
expect(store.state.selectedProjects).toHaveLength(0);
});
});
it('clears state when canceled', done => {
wrapper.vm
it('clears state when canceled', () => {
return wrapper.vm
.$nextTick()
.then(() => {
wrapper.vm.onCancel();
})
.then(timeoutPromise)
.then(waitForPromises)
.then(() => {
expect(store.state.projectSearchResults.length).toEqual(0);
expect(store.state.selectedProjects.length).toEqual(0);
done();
})
.catch(done.fail);
expect(store.state.projectSearchResults).toHaveLength(0);
expect(store.state.selectedProjects).toHaveLength(0);
});
});
it('clears state on error', done => {
it('clears state on error', () => {
mockAxios.onPost(mockAddEndpoint).replyOnce(500, {});
wrapper.vm
return wrapper.vm
.$nextTick()
.then(() => {
expect(store.state.projectSearchResults.length).not.toEqual(0);
expect(store.state.selectedProjects.length).not.toEqual(0);
expect(store.state.projectSearchResults.length).not.toBe(0);
expect(store.state.selectedProjects.length).not.toBe(0);
wrapper.vm.onOk();
})
.then(timeoutPromise)
.then(waitForPromises)
.then(() => {
expect(store.state.projectSearchResults.length).toEqual(0);
expect(store.state.selectedProjects.length).toEqual(0);
done();
})
.catch(done.fail);
expect(store.state.projectSearchResults).toHaveLength(0);
expect(store.state.selectedProjects).toHaveLength(0);
});
});
});
......
......@@ -11,11 +11,10 @@ const localVue = createLocalVue();
localVue.use(Vuex);
describe('project component', () => {
const ProjectComponent = localVue.extend(Project);
let wrapper;
const createComponent = (props = {}) => {
wrapper = shallowMount(ProjectComponent, {
wrapper = shallowMount(Project, {
store,
localVue,
propsData: {
......
// No new code should be added to this file. Instead, modify the
// file this one re-exports from. For more detail about why, see:
// https://gitlab.com/gitlab-org/gitlab-foss/merge_requests/31349
export * from '../../frontend/operations/mock_data';
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