debian-mirror-gitlab/spec/javascripts/boards/board_new_issue_spec.js

204 lines
4.9 KiB
JavaScript
Raw Normal View History

2017-08-17 22:00:37 +05:30
/* global List */
import Vue from 'vue';
2018-03-17 18:26:18 +05:30
import MockAdapter from 'axios-mock-adapter';
import axios from '~/lib/utils/axios_utils';
2018-03-27 19:54:05 +05:30
import boardNewIssue from '~/boards/components/board_new_issue.vue';
2017-08-17 22:00:37 +05:30
2017-09-10 17:25:29 +05:30
import '~/boards/models/list';
2018-03-17 18:26:18 +05:30
import { listObj, boardsMockInterceptor, mockBoardService } from './mock_data';
2017-08-17 22:00:37 +05:30
describe('Issue boards new issue form', () => {
let vm;
let list;
2018-03-17 18:26:18 +05:30
let mock;
2017-09-10 17:25:29 +05:30
let newIssueMock;
2017-08-17 22:00:37 +05:30
const promiseReturn = {
2018-03-17 18:26:18 +05:30
data: {
iid: 100,
2017-08-17 22:00:37 +05:30
},
};
2017-09-10 17:25:29 +05:30
2017-08-17 22:00:37 +05:30
const submitIssue = () => {
2017-09-10 17:25:29 +05:30
const dummySubmitEvent = {
preventDefault() {},
};
vm.$refs.submitButton = vm.$el.querySelector('.btn-success');
return vm.submit(dummySubmitEvent);
2017-08-17 22:00:37 +05:30
};
beforeEach((done) => {
2018-03-17 18:26:18 +05:30
setFixtures('<div class="test-container"></div>');
2017-08-17 22:00:37 +05:30
const BoardNewIssueComp = Vue.extend(boardNewIssue);
2018-03-17 18:26:18 +05:30
mock = new MockAdapter(axios);
mock.onAny().reply(boardsMockInterceptor);
gl.boardService = mockBoardService();
2017-08-17 22:00:37 +05:30
gl.issueBoards.BoardsStore.create();
gl.IssueBoardsApp = new Vue();
2017-09-10 17:25:29 +05:30
list = new List(listObj);
newIssueMock = Promise.resolve(promiseReturn);
spyOn(list, 'newIssue').and.callFake(() => newIssueMock);
vm = new BoardNewIssueComp({
propsData: {
list,
},
2018-03-17 18:26:18 +05:30
}).$mount(document.querySelector('.test-container'));
2017-09-10 17:25:29 +05:30
Vue.nextTick()
.then(done)
.catch(done.fail);
2017-08-17 22:00:37 +05:30
});
2018-03-17 18:26:18 +05:30
afterEach(() => {
vm.$destroy();
mock.restore();
});
2017-09-10 17:25:29 +05:30
it('calls submit if submit button is clicked', (done) => {
2018-03-17 18:26:18 +05:30
spyOn(vm, 'submit').and.callFake(e => e.preventDefault());
2017-09-10 17:25:29 +05:30
vm.title = 'Testing Title';
Vue.nextTick()
.then(() => {
vm.$el.querySelector('.btn-success').click();
expect(vm.submit.calls.count()).toBe(1);
expect(vm.$refs['submit-button']).toBe(vm.$el.querySelector('.btn-success'));
})
.then(done)
.catch(done.fail);
2017-08-17 22:00:37 +05:30
});
it('disables submit button if title is empty', () => {
expect(vm.$el.querySelector('.btn-success').disabled).toBe(true);
});
it('enables submit button if title is not empty', (done) => {
vm.title = 'Testing Title';
2017-09-10 17:25:29 +05:30
Vue.nextTick()
.then(() => {
expect(vm.$el.querySelector('.form-control').value).toBe('Testing Title');
expect(vm.$el.querySelector('.btn-success').disabled).not.toBe(true);
})
.then(done)
.catch(done.fail);
2017-08-17 22:00:37 +05:30
});
it('clears title after clicking cancel', (done) => {
vm.$el.querySelector('.btn-default').click();
2017-09-10 17:25:29 +05:30
Vue.nextTick()
.then(() => {
expect(vm.title).toBe('');
})
.then(done)
.catch(done.fail);
2017-08-17 22:00:37 +05:30
});
it('does not create new issue if title is empty', (done) => {
2017-09-10 17:25:29 +05:30
submitIssue()
.then(() => {
expect(list.newIssue).not.toHaveBeenCalled();
})
.then(done)
.catch(done.fail);
2017-08-17 22:00:37 +05:30
});
describe('submit success', () => {
it('creates new issue', (done) => {
vm.title = 'submit title';
2017-09-10 17:25:29 +05:30
Vue.nextTick()
.then(submitIssue)
.then(() => {
expect(list.newIssue).toHaveBeenCalled();
})
.then(done)
.catch(done.fail);
2017-08-17 22:00:37 +05:30
});
it('enables button after submit', (done) => {
vm.title = 'submit issue';
2017-09-10 17:25:29 +05:30
Vue.nextTick()
.then(submitIssue)
.then(() => {
expect(vm.$el.querySelector('.btn-success').disabled).toBe(false);
})
.then(done)
.catch(done.fail);
2017-08-17 22:00:37 +05:30
});
it('clears title after submit', (done) => {
vm.title = 'submit issue';
2017-09-10 17:25:29 +05:30
Vue.nextTick()
.then(submitIssue)
.then(() => {
expect(vm.title).toBe('');
})
.then(done)
.catch(done.fail);
2017-08-17 22:00:37 +05:30
});
it('sets detail issue after submit', (done) => {
2017-09-10 17:25:29 +05:30
expect(gl.issueBoards.BoardsStore.detail.issue.title).toBe(undefined);
2017-08-17 22:00:37 +05:30
vm.title = 'submit issue';
2017-09-10 17:25:29 +05:30
Vue.nextTick()
.then(submitIssue)
.then(() => {
expect(gl.issueBoards.BoardsStore.detail.issue.title).toBe('submit issue');
})
.then(done)
.catch(done.fail);
2017-08-17 22:00:37 +05:30
});
it('sets detail list after submit', (done) => {
vm.title = 'submit issue';
2017-09-10 17:25:29 +05:30
Vue.nextTick()
.then(submitIssue)
.then(() => {
expect(gl.issueBoards.BoardsStore.detail.list.id).toBe(list.id);
})
.then(done)
.catch(done.fail);
2017-08-17 22:00:37 +05:30
});
});
describe('submit error', () => {
2017-09-10 17:25:29 +05:30
beforeEach(() => {
newIssueMock = Promise.reject(new Error('My hovercraft is full of eels!'));
2017-08-17 22:00:37 +05:30
vm.title = 'error';
2017-09-10 17:25:29 +05:30
});
2017-08-17 22:00:37 +05:30
2017-09-10 17:25:29 +05:30
it('removes issue', (done) => {
Vue.nextTick()
.then(submitIssue)
.then(() => {
2017-08-17 22:00:37 +05:30
expect(list.issues.length).toBe(1);
2017-09-10 17:25:29 +05:30
})
.then(done)
.catch(done.fail);
2017-08-17 22:00:37 +05:30
});
it('shows error', (done) => {
2017-09-10 17:25:29 +05:30
Vue.nextTick()
.then(submitIssue)
.then(() => {
2017-08-17 22:00:37 +05:30
expect(vm.error).toBe(true);
2017-09-10 17:25:29 +05:30
})
.then(done)
.catch(done.fail);
2017-08-17 22:00:37 +05:30
});
});
});