2017-04-06 01:13:06 +00:00
|
|
|
import Vue from 'vue';
|
2017-04-25 16:31:15 +00:00
|
|
|
import '~/render_math';
|
|
|
|
import '~/render_gfm';
|
2017-12-07 12:30:53 +00:00
|
|
|
import * as urlUtils from '~/lib/utils/url_utility';
|
2017-05-10 14:05:58 +00:00
|
|
|
import issuableApp from '~/issue_show/components/app.vue';
|
2017-05-12 10:23:30 +00:00
|
|
|
import eventHub from '~/issue_show/event_hub';
|
2017-05-10 14:05:58 +00:00
|
|
|
import issueShowData from '../mock_data';
|
2017-12-08 12:26:39 +00:00
|
|
|
import setTimeoutPromise from '../../helpers/set_timeout_promise_helper';
|
2017-04-25 16:31:15 +00:00
|
|
|
|
2017-05-18 12:24:34 +00:00
|
|
|
function formatText(text) {
|
|
|
|
return text.trim().replace(/\s\s+/g, ' ');
|
|
|
|
}
|
|
|
|
|
2017-05-11 08:32:41 +00:00
|
|
|
describe('Issuable output', () => {
|
2017-07-12 14:47:09 +00:00
|
|
|
let requestData = issueShowData.initialRequest;
|
|
|
|
|
2017-05-04 13:24:47 +00:00
|
|
|
document.body.innerHTML = '<span id="task_status"></span>';
|
|
|
|
|
2017-07-12 14:47:09 +00:00
|
|
|
const interceptor = (request, next) => {
|
|
|
|
next(request.respondWith(JSON.stringify(requestData), {
|
|
|
|
status: 200,
|
|
|
|
}));
|
|
|
|
};
|
|
|
|
|
2017-05-10 14:05:58 +00:00
|
|
|
let vm;
|
2017-04-06 01:13:06 +00:00
|
|
|
|
2017-07-12 14:47:09 +00:00
|
|
|
beforeEach((done) => {
|
2017-05-12 10:23:30 +00:00
|
|
|
spyOn(eventHub, '$emit');
|
2017-06-23 09:28:19 +00:00
|
|
|
|
|
|
|
const IssuableDescriptionComponent = Vue.extend(issuableApp);
|
2017-05-12 10:23:30 +00:00
|
|
|
|
2017-07-12 14:47:09 +00:00
|
|
|
requestData = issueShowData.initialRequest;
|
|
|
|
Vue.http.interceptors.push(interceptor);
|
|
|
|
|
2017-05-10 14:05:58 +00:00
|
|
|
vm = new IssuableDescriptionComponent({
|
2017-04-06 01:13:06 +00:00
|
|
|
propsData: {
|
2017-05-10 14:05:58 +00:00
|
|
|
canUpdate: true,
|
2017-05-12 10:58:48 +00:00
|
|
|
canDestroy: true,
|
2017-05-13 20:19:49 +00:00
|
|
|
endpoint: '/gitlab-org/gitlab-shell/issues/9/realtime_changes',
|
2017-11-29 09:29:06 +00:00
|
|
|
updateEndpoint: gl.TEST_HOST,
|
2017-05-10 14:05:58 +00:00
|
|
|
issuableRef: '#1',
|
2017-05-25 10:58:40 +00:00
|
|
|
initialTitleHtml: '',
|
|
|
|
initialTitleText: '',
|
2017-11-29 09:29:06 +00:00
|
|
|
initialDescriptionHtml: 'test',
|
|
|
|
initialDescriptionText: 'test',
|
2017-08-17 17:25:56 +00:00
|
|
|
markdownPreviewPath: '/',
|
|
|
|
markdownDocsPath: '/',
|
2017-05-25 10:58:40 +00:00
|
|
|
projectNamespace: '/',
|
|
|
|
projectPath: '/',
|
2017-04-06 01:13:06 +00:00
|
|
|
},
|
|
|
|
}).$mount();
|
2017-07-12 14:47:09 +00:00
|
|
|
|
|
|
|
setTimeout(done);
|
2017-05-10 14:05:58 +00:00
|
|
|
});
|
2017-04-06 01:13:06 +00:00
|
|
|
|
2017-07-12 14:47:09 +00:00
|
|
|
afterEach(() => {
|
|
|
|
Vue.http.interceptors = _.without(Vue.http.interceptors, interceptor);
|
2017-05-18 12:24:34 +00:00
|
|
|
|
2017-07-12 14:47:09 +00:00
|
|
|
vm.poll.stop();
|
2017-12-08 12:26:39 +00:00
|
|
|
|
|
|
|
vm.$destroy();
|
2017-07-12 14:47:09 +00:00
|
|
|
});
|
|
|
|
|
|
|
|
it('should render a title/description/edited and update title/description/edited on update', (done) => {
|
2017-06-23 09:28:19 +00:00
|
|
|
let editedText;
|
|
|
|
Vue.nextTick()
|
|
|
|
.then(() => {
|
|
|
|
editedText = vm.$el.querySelector('.edited-text');
|
|
|
|
})
|
|
|
|
.then(() => {
|
2017-05-02 21:01:23 +00:00
|
|
|
expect(document.querySelector('title').innerText).toContain('this is a title (#1)');
|
2017-05-10 14:05:58 +00:00
|
|
|
expect(vm.$el.querySelector('.title').innerHTML).toContain('<p>this is a title</p>');
|
|
|
|
expect(vm.$el.querySelector('.wiki').innerHTML).toContain('<p>this is a description!</p>');
|
2017-05-10 17:50:14 +00:00
|
|
|
expect(vm.$el.querySelector('.js-task-list-field').value).toContain('this is a description');
|
2017-05-18 12:24:34 +00:00
|
|
|
expect(formatText(editedText.innerText)).toMatch(/Edited[\s\S]+?by Some User/);
|
|
|
|
expect(editedText.querySelector('.author_link').href).toMatch(/\/some_user$/);
|
|
|
|
expect(editedText.querySelector('time')).toBeTruthy();
|
2017-06-23 09:28:19 +00:00
|
|
|
})
|
|
|
|
.then(() => {
|
2017-07-12 14:47:09 +00:00
|
|
|
requestData = issueShowData.secondRequest;
|
|
|
|
vm.poll.makeRequest();
|
2017-06-23 09:28:19 +00:00
|
|
|
})
|
2017-07-12 14:47:09 +00:00
|
|
|
.then(() => new Promise(resolve => setTimeout(resolve)))
|
2017-06-23 09:28:19 +00:00
|
|
|
.then(() => {
|
|
|
|
expect(document.querySelector('title').innerText).toContain('2 (#1)');
|
|
|
|
expect(vm.$el.querySelector('.title').innerHTML).toContain('<p>2</p>');
|
|
|
|
expect(vm.$el.querySelector('.wiki').innerHTML).toContain('<p>42</p>');
|
|
|
|
expect(vm.$el.querySelector('.js-task-list-field').value).toContain('42');
|
|
|
|
expect(vm.$el.querySelector('.edited-text')).toBeTruthy();
|
|
|
|
expect(formatText(vm.$el.querySelector('.edited-text').innerText)).toMatch(/Edited[\s\S]+?by Other User/);
|
|
|
|
expect(editedText.querySelector('.author_link').href).toMatch(/\/other_user$/);
|
|
|
|
expect(editedText.querySelector('time')).toBeTruthy();
|
|
|
|
})
|
|
|
|
.then(done)
|
|
|
|
.catch(done.fail);
|
2017-04-06 01:13:06 +00:00
|
|
|
});
|
2017-05-12 10:23:30 +00:00
|
|
|
|
2017-05-12 10:58:48 +00:00
|
|
|
it('shows actions if permissions are correct', (done) => {
|
|
|
|
vm.showForm = true;
|
|
|
|
|
|
|
|
Vue.nextTick(() => {
|
|
|
|
expect(
|
|
|
|
vm.$el.querySelector('.btn'),
|
|
|
|
).not.toBeNull();
|
|
|
|
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
it('does not show actions if permissions are incorrect', (done) => {
|
|
|
|
vm.showForm = true;
|
|
|
|
vm.canUpdate = false;
|
|
|
|
|
|
|
|
Vue.nextTick(() => {
|
|
|
|
expect(
|
|
|
|
vm.$el.querySelector('.btn'),
|
|
|
|
).toBeNull();
|
|
|
|
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2017-05-17 15:06:17 +00:00
|
|
|
it('does not update formState if form is already open', (done) => {
|
|
|
|
vm.openForm();
|
|
|
|
|
|
|
|
vm.state.titleText = 'testing 123';
|
|
|
|
|
|
|
|
vm.openForm();
|
|
|
|
|
|
|
|
Vue.nextTick(() => {
|
|
|
|
expect(
|
|
|
|
vm.store.formState.title,
|
|
|
|
).not.toBe('testing 123');
|
|
|
|
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2017-05-12 10:23:30 +00:00
|
|
|
describe('updateIssuable', () => {
|
2017-05-22 12:59:11 +00:00
|
|
|
it('fetches new data after update', (done) => {
|
2017-06-15 21:21:53 +00:00
|
|
|
spyOn(vm.service, 'getData').and.callThrough();
|
2017-05-22 12:59:11 +00:00
|
|
|
spyOn(vm.service, 'updateIssuable').and.callFake(() => new Promise((resolve) => {
|
|
|
|
resolve({
|
|
|
|
json() {
|
|
|
|
return {
|
|
|
|
confidential: false,
|
2017-05-25 10:20:52 +00:00
|
|
|
web_url: location.pathname,
|
2017-05-22 12:59:11 +00:00
|
|
|
};
|
|
|
|
},
|
|
|
|
});
|
|
|
|
}));
|
|
|
|
|
|
|
|
vm.updateIssuable();
|
|
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
expect(
|
|
|
|
vm.service.getData,
|
|
|
|
).toHaveBeenCalled();
|
|
|
|
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2017-05-12 10:23:30 +00:00
|
|
|
it('correctly updates issuable data', (done) => {
|
|
|
|
spyOn(vm.service, 'updateIssuable').and.callFake(() => new Promise((resolve) => {
|
|
|
|
resolve();
|
|
|
|
}));
|
|
|
|
|
|
|
|
vm.updateIssuable();
|
|
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
expect(
|
|
|
|
vm.service.updateIssuable,
|
|
|
|
).toHaveBeenCalledWith(vm.formState);
|
|
|
|
expect(
|
|
|
|
eventHub.$emit,
|
|
|
|
).toHaveBeenCalledWith('close.form');
|
|
|
|
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2017-05-17 12:01:24 +00:00
|
|
|
it('does not redirect if issue has not moved', (done) => {
|
2017-12-07 12:30:53 +00:00
|
|
|
spyOn(urlUtils, 'visitUrl');
|
2017-05-16 09:53:46 +00:00
|
|
|
spyOn(vm.service, 'updateIssuable').and.callFake(() => new Promise((resolve) => {
|
|
|
|
resolve({
|
|
|
|
json() {
|
|
|
|
return {
|
2017-05-25 10:20:52 +00:00
|
|
|
web_url: location.pathname,
|
2017-05-18 21:35:38 +00:00
|
|
|
confidential: vm.isConfidential,
|
|
|
|
};
|
|
|
|
},
|
|
|
|
});
|
2017-05-17 12:01:24 +00:00
|
|
|
}));
|
|
|
|
|
|
|
|
vm.updateIssuable();
|
|
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
expect(
|
2017-12-07 12:30:53 +00:00
|
|
|
urlUtils.visitUrl,
|
2017-05-17 12:01:24 +00:00
|
|
|
).not.toHaveBeenCalled();
|
|
|
|
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2017-08-14 07:26:19 +00:00
|
|
|
it('redirects if returned web_url has changed', (done) => {
|
2017-12-07 12:30:53 +00:00
|
|
|
spyOn(urlUtils, 'visitUrl');
|
2017-05-17 12:01:24 +00:00
|
|
|
spyOn(vm.service, 'updateIssuable').and.callFake(() => new Promise((resolve) => {
|
|
|
|
resolve({
|
|
|
|
json() {
|
|
|
|
return {
|
2017-05-25 10:20:52 +00:00
|
|
|
web_url: '/testing-issue-move',
|
2017-05-18 21:35:38 +00:00
|
|
|
confidential: vm.isConfidential,
|
2017-05-16 09:53:46 +00:00
|
|
|
};
|
|
|
|
},
|
|
|
|
});
|
|
|
|
}));
|
|
|
|
|
|
|
|
vm.updateIssuable();
|
|
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
expect(
|
2017-12-07 12:30:53 +00:00
|
|
|
urlUtils.visitUrl,
|
2017-05-17 12:01:24 +00:00
|
|
|
).toHaveBeenCalledWith('/testing-issue-move');
|
2017-05-16 09:53:46 +00:00
|
|
|
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2017-11-15 23:13:20 +00:00
|
|
|
describe('error when updating', () => {
|
|
|
|
beforeEach(() => {
|
|
|
|
spyOn(window, 'Flash').and.callThrough();
|
|
|
|
spyOn(vm.service, 'updateIssuable').and.callFake(() => new Promise((resolve, reject) => {
|
|
|
|
reject();
|
|
|
|
}));
|
|
|
|
});
|
2017-05-12 10:23:30 +00:00
|
|
|
|
2017-11-15 23:13:20 +00:00
|
|
|
it('closes form on error', (done) => {
|
|
|
|
vm.updateIssuable();
|
2017-05-12 10:23:30 +00:00
|
|
|
|
2017-11-15 23:13:20 +00:00
|
|
|
setTimeout(() => {
|
|
|
|
expect(
|
|
|
|
eventHub.$emit,
|
|
|
|
).toHaveBeenCalledWith('close.form');
|
|
|
|
expect(
|
|
|
|
window.Flash,
|
|
|
|
).toHaveBeenCalledWith('Error updating issue');
|
2017-05-12 10:23:30 +00:00
|
|
|
|
2017-11-15 23:13:20 +00:00
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
it('returns the correct error message for issuableType', (done) => {
|
|
|
|
vm.issuableType = 'merge request';
|
|
|
|
|
|
|
|
Vue.nextTick(() => {
|
|
|
|
vm.updateIssuable();
|
|
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
expect(
|
|
|
|
eventHub.$emit,
|
|
|
|
).toHaveBeenCalledWith('close.form');
|
|
|
|
expect(
|
|
|
|
window.Flash,
|
|
|
|
).toHaveBeenCalledWith('Error updating merge request');
|
|
|
|
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
2017-05-12 10:23:30 +00:00
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2017-12-08 12:26:39 +00:00
|
|
|
it('opens recaptcha dialog if update rejected as spam', (done) => {
|
|
|
|
function mockScriptSrc() {
|
|
|
|
const recaptchaChild = vm.$children
|
|
|
|
.find(child => child.$options._componentTag === 'recaptcha-dialog'); // eslint-disable-line no-underscore-dangle
|
|
|
|
|
|
|
|
recaptchaChild.scriptSrc = '//scriptsrc';
|
|
|
|
}
|
|
|
|
|
|
|
|
let modal;
|
|
|
|
const promise = new Promise((resolve) => {
|
|
|
|
resolve({
|
|
|
|
json() {
|
|
|
|
return {
|
|
|
|
recaptcha_html: '<div class="g-recaptcha">recaptcha_html</div>',
|
|
|
|
};
|
|
|
|
},
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
spyOn(vm.service, 'updateIssuable').and.returnValue(promise);
|
|
|
|
|
|
|
|
vm.canUpdate = true;
|
|
|
|
vm.showForm = true;
|
|
|
|
|
|
|
|
vm.$nextTick()
|
|
|
|
.then(() => mockScriptSrc())
|
|
|
|
.then(() => vm.updateIssuable())
|
|
|
|
.then(promise)
|
|
|
|
.then(() => setTimeoutPromise())
|
|
|
|
.then(() => {
|
|
|
|
modal = vm.$el.querySelector('.js-recaptcha-dialog');
|
|
|
|
|
|
|
|
expect(modal.style.display).not.toEqual('none');
|
|
|
|
expect(modal.querySelector('.g-recaptcha').textContent).toEqual('recaptcha_html');
|
|
|
|
expect(document.body.querySelector('.js-recaptcha-script').src).toMatch('//scriptsrc');
|
|
|
|
})
|
|
|
|
.then(() => modal.querySelector('.close').click())
|
|
|
|
.then(() => vm.$nextTick())
|
|
|
|
.then(() => {
|
|
|
|
expect(modal.style.display).toEqual('none');
|
|
|
|
expect(document.body.querySelector('.js-recaptcha-script')).toBeNull();
|
|
|
|
})
|
|
|
|
.then(done)
|
|
|
|
.catch(done.fail);
|
|
|
|
});
|
|
|
|
|
2017-05-12 10:23:30 +00:00
|
|
|
describe('deleteIssuable', () => {
|
|
|
|
it('changes URL when deleted', (done) => {
|
2017-12-07 12:30:53 +00:00
|
|
|
spyOn(urlUtils, 'visitUrl');
|
2017-05-12 10:23:30 +00:00
|
|
|
spyOn(vm.service, 'deleteIssuable').and.callFake(() => new Promise((resolve) => {
|
|
|
|
resolve({
|
2017-05-12 12:04:36 +00:00
|
|
|
json() {
|
2017-05-25 10:20:52 +00:00
|
|
|
return { web_url: '/test' };
|
2017-05-12 12:04:36 +00:00
|
|
|
},
|
2017-05-12 10:23:30 +00:00
|
|
|
});
|
|
|
|
}));
|
|
|
|
|
|
|
|
vm.deleteIssuable();
|
|
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
expect(
|
2017-12-07 12:30:53 +00:00
|
|
|
urlUtils.visitUrl,
|
2017-05-12 10:23:30 +00:00
|
|
|
).toHaveBeenCalledWith('/test');
|
|
|
|
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2017-05-30 10:58:50 +00:00
|
|
|
it('stops polling when deleting', (done) => {
|
2017-12-07 12:30:53 +00:00
|
|
|
spyOn(urlUtils, 'visitUrl');
|
2017-07-12 14:47:09 +00:00
|
|
|
spyOn(vm.poll, 'stop').and.callThrough();
|
2017-05-12 10:23:30 +00:00
|
|
|
spyOn(vm.service, 'deleteIssuable').and.callFake(() => new Promise((resolve) => {
|
|
|
|
resolve({
|
2017-05-12 12:04:36 +00:00
|
|
|
json() {
|
2017-05-25 10:20:52 +00:00
|
|
|
return { web_url: '/test' };
|
2017-05-12 12:04:36 +00:00
|
|
|
},
|
2017-05-12 10:23:30 +00:00
|
|
|
});
|
|
|
|
}));
|
|
|
|
|
|
|
|
vm.deleteIssuable();
|
|
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
expect(
|
|
|
|
vm.poll.stop,
|
|
|
|
).toHaveBeenCalledWith();
|
|
|
|
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
it('closes form on error', (done) => {
|
|
|
|
spyOn(window, 'Flash').and.callThrough();
|
|
|
|
spyOn(vm.service, 'deleteIssuable').and.callFake(() => new Promise((resolve, reject) => {
|
|
|
|
reject();
|
|
|
|
}));
|
|
|
|
|
|
|
|
vm.deleteIssuable();
|
|
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
expect(
|
|
|
|
eventHub.$emit,
|
|
|
|
).toHaveBeenCalledWith('close.form');
|
|
|
|
expect(
|
|
|
|
window.Flash,
|
|
|
|
).toHaveBeenCalledWith('Error deleting issue');
|
|
|
|
|
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
2017-05-18 16:37:37 +00:00
|
|
|
|
|
|
|
describe('open form', () => {
|
|
|
|
it('shows locked warning if form is open & data is different', (done) => {
|
|
|
|
Vue.nextTick()
|
|
|
|
.then(() => {
|
|
|
|
vm.openForm();
|
|
|
|
|
2017-07-12 14:47:09 +00:00
|
|
|
requestData = issueShowData.secondRequest;
|
|
|
|
vm.poll.makeRequest();
|
2017-05-18 16:37:37 +00:00
|
|
|
})
|
2017-07-12 14:47:09 +00:00
|
|
|
.then(() => new Promise(resolve => setTimeout(resolve)))
|
2017-05-18 16:37:37 +00:00
|
|
|
.then(() => {
|
|
|
|
expect(
|
|
|
|
vm.formState.lockedWarningVisible,
|
|
|
|
).toBeTruthy();
|
|
|
|
|
|
|
|
expect(
|
|
|
|
vm.$el.querySelector('.alert'),
|
|
|
|
).not.toBeNull();
|
|
|
|
})
|
2017-06-23 09:28:19 +00:00
|
|
|
.then(done)
|
2017-05-18 16:37:37 +00:00
|
|
|
.catch(done.fail);
|
|
|
|
});
|
|
|
|
});
|
2017-10-17 17:04:33 +00:00
|
|
|
|
|
|
|
describe('show inline edit button', () => {
|
|
|
|
it('should not render by default', () => {
|
|
|
|
expect(vm.$el.querySelector('.title-container .note-action-button')).toBeDefined();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should render if showInlineEditButton', () => {
|
|
|
|
vm.showInlineEditButton = true;
|
|
|
|
expect(vm.$el.querySelector('.title-container .note-action-button')).toBeDefined();
|
|
|
|
});
|
|
|
|
});
|
2017-04-06 01:13:06 +00:00
|
|
|
});
|