Merge branch 'ph-ajax-into-axios' into 'master'
More $.ajax conversions to axios See merge request gitlab-org/gitlab-ce!16761
This commit is contained in:
commit
8957947e80
|
@ -2,6 +2,7 @@
|
||||||
/* global fuzzaldrinPlus */
|
/* global fuzzaldrinPlus */
|
||||||
import _ from 'underscore';
|
import _ from 'underscore';
|
||||||
import fuzzaldrinPlus from 'fuzzaldrin-plus';
|
import fuzzaldrinPlus from 'fuzzaldrin-plus';
|
||||||
|
import axios from './lib/utils/axios_utils';
|
||||||
import { visitUrl } from './lib/utils/url_utility';
|
import { visitUrl } from './lib/utils/url_utility';
|
||||||
import { isObject } from './lib/utils/type_utility';
|
import { isObject } from './lib/utils/type_utility';
|
||||||
|
|
||||||
|
@ -212,25 +213,17 @@ GitLabDropdownRemote = (function() {
|
||||||
};
|
};
|
||||||
|
|
||||||
GitLabDropdownRemote.prototype.fetchData = function() {
|
GitLabDropdownRemote.prototype.fetchData = function() {
|
||||||
return $.ajax({
|
if (this.options.beforeSend) {
|
||||||
url: this.dataEndpoint,
|
this.options.beforeSend();
|
||||||
dataType: this.options.dataType,
|
|
||||||
beforeSend: (function(_this) {
|
|
||||||
return function() {
|
|
||||||
if (_this.options.beforeSend) {
|
|
||||||
return _this.options.beforeSend();
|
|
||||||
}
|
}
|
||||||
};
|
|
||||||
})(this),
|
|
||||||
success: (function(_this) {
|
|
||||||
return function(data) {
|
|
||||||
if (_this.options.success) {
|
|
||||||
return _this.options.success(data);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
})(this)
|
|
||||||
});
|
|
||||||
// Fetch the data through ajax if the data is a string
|
// Fetch the data through ajax if the data is a string
|
||||||
|
return axios.get(this.dataEndpoint)
|
||||||
|
.then(({ data }) => {
|
||||||
|
if (this.options.success) {
|
||||||
|
return this.options.success(data);
|
||||||
|
}
|
||||||
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
return GitLabDropdownRemote;
|
return GitLabDropdownRemote;
|
||||||
|
|
|
@ -1,11 +1,13 @@
|
||||||
|
import flash from '../flash';
|
||||||
|
import { __ } from '../locale';
|
||||||
|
import axios from '../lib/utils/axios_utils';
|
||||||
import ContributorsStatGraph from './stat_graph_contributors';
|
import ContributorsStatGraph from './stat_graph_contributors';
|
||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', () => {
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
$.ajax({
|
const url = document.querySelector('.js-graphs-show').dataset.projectGraphPath;
|
||||||
type: 'GET',
|
|
||||||
url: document.querySelector('.js-graphs-show').dataset.projectGraphPath,
|
axios.get(url)
|
||||||
dataType: 'json',
|
.then(({ data }) => {
|
||||||
success(data) {
|
|
||||||
const graph = new ContributorsStatGraph();
|
const graph = new ContributorsStatGraph();
|
||||||
graph.init(data);
|
graph.init(data);
|
||||||
|
|
||||||
|
@ -16,6 +18,6 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
|
||||||
$('.stat-graph').fadeIn();
|
$('.stat-graph').fadeIn();
|
||||||
$('.loading-graph').hide();
|
$('.loading-graph').hide();
|
||||||
},
|
})
|
||||||
});
|
.catch(() => flash(__('Error fetching contributors data.')));
|
||||||
});
|
});
|
||||||
|
|
|
@ -1,3 +1,7 @@
|
||||||
|
import axios from './lib/utils/axios_utils';
|
||||||
|
import flash from './flash';
|
||||||
|
import { __ } from './locale';
|
||||||
|
|
||||||
export default class GroupLabelSubscription {
|
export default class GroupLabelSubscription {
|
||||||
constructor(container) {
|
constructor(container) {
|
||||||
const $container = $(container);
|
const $container = $(container);
|
||||||
|
@ -13,14 +17,12 @@ export default class GroupLabelSubscription {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
|
|
||||||
const url = this.$unsubscribeButtons.attr('data-url');
|
const url = this.$unsubscribeButtons.attr('data-url');
|
||||||
|
axios.post(url)
|
||||||
$.ajax({
|
.then(() => {
|
||||||
type: 'POST',
|
|
||||||
url,
|
|
||||||
}).done(() => {
|
|
||||||
this.toggleSubscriptionButtons();
|
this.toggleSubscriptionButtons();
|
||||||
this.$unsubscribeButtons.removeAttr('data-url');
|
this.$unsubscribeButtons.removeAttr('data-url');
|
||||||
});
|
})
|
||||||
|
.catch(() => flash(__('There was an error when unsubscribing from this label.')));
|
||||||
}
|
}
|
||||||
|
|
||||||
subscribe(event) {
|
subscribe(event) {
|
||||||
|
@ -31,12 +33,9 @@ export default class GroupLabelSubscription {
|
||||||
|
|
||||||
this.$unsubscribeButtons.attr('data-url', url);
|
this.$unsubscribeButtons.attr('data-url', url);
|
||||||
|
|
||||||
$.ajax({
|
axios.post(url)
|
||||||
type: 'POST',
|
.then(() => this.toggleSubscriptionButtons())
|
||||||
url,
|
.catch(() => flash(__('There was an error when subscribing to this label.')));
|
||||||
}).done(() => {
|
|
||||||
this.toggleSubscriptionButtons();
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
toggleSubscriptionButtons() {
|
toggleSubscriptionButtons() {
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import Flash from '../flash';
|
import axios from '../lib/utils/axios_utils';
|
||||||
|
import flash from '../flash';
|
||||||
|
|
||||||
export default class IntegrationSettingsForm {
|
export default class IntegrationSettingsForm {
|
||||||
constructor(formSelector) {
|
constructor(formSelector) {
|
||||||
|
@ -95,14 +96,11 @@ export default class IntegrationSettingsForm {
|
||||||
*/
|
*/
|
||||||
testSettings(formData) {
|
testSettings(formData) {
|
||||||
this.toggleSubmitBtnState(true);
|
this.toggleSubmitBtnState(true);
|
||||||
$.ajax({
|
|
||||||
type: 'PUT',
|
return axios.put(this.testEndPoint, formData)
|
||||||
url: this.testEndPoint,
|
.then(({ data }) => {
|
||||||
data: formData,
|
if (data.error) {
|
||||||
})
|
flash(`${data.message} ${data.service_response}`, 'alert', document, {
|
||||||
.done((res) => {
|
|
||||||
if (res.error) {
|
|
||||||
new Flash(`${res.message} ${res.service_response}`, 'alert', document, {
|
|
||||||
title: 'Save anyway',
|
title: 'Save anyway',
|
||||||
clickHandler: (e) => {
|
clickHandler: (e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
@ -112,11 +110,11 @@ export default class IntegrationSettingsForm {
|
||||||
} else {
|
} else {
|
||||||
this.$form.submit();
|
this.$form.submit();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this.toggleSubmitBtnState(false);
|
||||||
})
|
})
|
||||||
.fail(() => {
|
.catch(() => {
|
||||||
new Flash('Something went wrong on our end.');
|
flash('Something went wrong on our end.');
|
||||||
})
|
|
||||||
.always(() => {
|
|
||||||
this.toggleSubmitBtnState(false);
|
this.toggleSubmitBtnState(false);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
/* eslint-disable comma-dangle, quotes, consistent-return, func-names, array-callback-return, space-before-function-paren, prefer-arrow-callback, max-len, no-unused-expressions, no-sequences, no-underscore-dangle, no-unused-vars, no-param-reassign */
|
/* eslint-disable comma-dangle, quotes, consistent-return, func-names, array-callback-return, space-before-function-paren, prefer-arrow-callback, max-len, no-unused-expressions, no-sequences, no-underscore-dangle, no-unused-vars, no-param-reassign */
|
||||||
import _ from 'underscore';
|
import _ from 'underscore';
|
||||||
|
import axios from './lib/utils/axios_utils';
|
||||||
import Flash from './flash';
|
import Flash from './flash';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
@ -22,15 +23,9 @@ export default {
|
||||||
},
|
},
|
||||||
|
|
||||||
submit() {
|
submit() {
|
||||||
const _this = this;
|
axios[this.form.attr('method')](this.form.attr('action'), this.getFormDataAsObject())
|
||||||
const xhr = $.ajax({
|
.then(() => window.location.reload())
|
||||||
url: this.form.attr('action'),
|
.catch(() => this.onFormSubmitFailure());
|
||||||
method: this.form.attr('method'),
|
|
||||||
dataType: 'JSON',
|
|
||||||
data: this.getFormDataAsObject()
|
|
||||||
});
|
|
||||||
xhr.done(() => window.location.reload());
|
|
||||||
xhr.fail(() => this.onFormSubmitFailure());
|
|
||||||
},
|
},
|
||||||
|
|
||||||
onFormSubmitFailure() {
|
onFormSubmitFailure() {
|
||||||
|
|
|
@ -1,3 +1,6 @@
|
||||||
|
import axios from './lib/utils/axios_utils';
|
||||||
|
import flash from './flash';
|
||||||
|
import { __ } from './locale';
|
||||||
import IssuableBulkUpdateSidebar from './issuable_bulk_update_sidebar';
|
import IssuableBulkUpdateSidebar from './issuable_bulk_update_sidebar';
|
||||||
import IssuableBulkUpdateActions from './issuable_bulk_update_actions';
|
import IssuableBulkUpdateActions from './issuable_bulk_update_actions';
|
||||||
|
|
||||||
|
@ -20,22 +23,23 @@ export default class IssuableIndex {
|
||||||
}
|
}
|
||||||
|
|
||||||
static resetIncomingEmailToken() {
|
static resetIncomingEmailToken() {
|
||||||
$('.incoming-email-token-reset').on('click', (e) => {
|
const $resetToken = $('.incoming-email-token-reset');
|
||||||
|
|
||||||
|
$resetToken.on('click', (e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
|
||||||
$.ajax({
|
$resetToken.text('resetting...');
|
||||||
type: 'PUT',
|
|
||||||
url: $('.incoming-email-token-reset').attr('href'),
|
axios.put($resetToken.attr('href'))
|
||||||
dataType: 'json',
|
.then(({ data }) => {
|
||||||
success(response) {
|
$('#issuable_email').val(data.new_address).focus();
|
||||||
$('#issuable_email').val(response.new_address).focus();
|
|
||||||
},
|
$resetToken.text('reset it');
|
||||||
beforeSend() {
|
})
|
||||||
$('.incoming-email-token-reset').text('resetting...');
|
.catch(() => {
|
||||||
},
|
flash(__('There was an error when reseting email token.'));
|
||||||
complete() {
|
|
||||||
$('.incoming-email-token-reset').text('reset it');
|
$resetToken.text('reset it');
|
||||||
},
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,3 +1,5 @@
|
||||||
|
import MockAdaptor from 'axios-mock-adapter';
|
||||||
|
import axios from '~/lib/utils/axios_utils';
|
||||||
import IntegrationSettingsForm from '~/integrations/integration_settings_form';
|
import IntegrationSettingsForm from '~/integrations/integration_settings_form';
|
||||||
|
|
||||||
describe('IntegrationSettingsForm', () => {
|
describe('IntegrationSettingsForm', () => {
|
||||||
|
@ -109,91 +111,117 @@ describe('IntegrationSettingsForm', () => {
|
||||||
describe('testSettings', () => {
|
describe('testSettings', () => {
|
||||||
let integrationSettingsForm;
|
let integrationSettingsForm;
|
||||||
let formData;
|
let formData;
|
||||||
|
let mock;
|
||||||
|
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
|
mock = new MockAdaptor(axios);
|
||||||
|
|
||||||
|
spyOn(axios, 'put').and.callThrough();
|
||||||
|
|
||||||
integrationSettingsForm = new IntegrationSettingsForm('.js-integration-settings-form');
|
integrationSettingsForm = new IntegrationSettingsForm('.js-integration-settings-form');
|
||||||
formData = integrationSettingsForm.$form.serialize();
|
formData = integrationSettingsForm.$form.serialize();
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should make an ajax request with provided `formData`', () => {
|
afterEach(() => {
|
||||||
const deferred = $.Deferred();
|
mock.restore();
|
||||||
spyOn($, 'ajax').and.returnValue(deferred.promise());
|
|
||||||
|
|
||||||
integrationSettingsForm.testSettings(formData);
|
|
||||||
|
|
||||||
expect($.ajax).toHaveBeenCalledWith({
|
|
||||||
type: 'PUT',
|
|
||||||
url: integrationSettingsForm.testEndPoint,
|
|
||||||
data: formData,
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should show error Flash with `Save anyway` action if ajax request responds with error in test', () => {
|
it('should make an ajax request with provided `formData`', (done) => {
|
||||||
|
integrationSettingsForm.testSettings(formData)
|
||||||
|
.then(() => {
|
||||||
|
expect(axios.put).toHaveBeenCalledWith(integrationSettingsForm.testEndPoint, formData);
|
||||||
|
|
||||||
|
done();
|
||||||
|
})
|
||||||
|
.catch(done.fail);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should show error Flash with `Save anyway` action if ajax request responds with error in test', (done) => {
|
||||||
const errorMessage = 'Test failed.';
|
const errorMessage = 'Test failed.';
|
||||||
const deferred = $.Deferred();
|
mock.onPut(integrationSettingsForm.testEndPoint).reply(200, {
|
||||||
spyOn($, 'ajax').and.returnValue(deferred.promise());
|
error: true,
|
||||||
|
message: errorMessage,
|
||||||
integrationSettingsForm.testSettings(formData);
|
service_response: 'some error',
|
||||||
|
});
|
||||||
deferred.resolve({ error: true, message: errorMessage, service_response: 'some error' });
|
|
||||||
|
|
||||||
|
integrationSettingsForm.testSettings(formData)
|
||||||
|
.then(() => {
|
||||||
const $flashContainer = $('.flash-container');
|
const $flashContainer = $('.flash-container');
|
||||||
expect($flashContainer.find('.flash-text').text().trim()).toEqual('Test failed. some error');
|
expect($flashContainer.find('.flash-text').text().trim()).toEqual('Test failed. some error');
|
||||||
expect($flashContainer.find('.flash-action')).toBeDefined();
|
expect($flashContainer.find('.flash-action')).toBeDefined();
|
||||||
expect($flashContainer.find('.flash-action').text().trim()).toEqual('Save anyway');
|
expect($flashContainer.find('.flash-action').text().trim()).toEqual('Save anyway');
|
||||||
|
|
||||||
|
done();
|
||||||
|
})
|
||||||
|
.catch(done.fail);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should submit form if ajax request responds without any error in test', () => {
|
it('should submit form if ajax request responds without any error in test', (done) => {
|
||||||
const deferred = $.Deferred();
|
|
||||||
spyOn($, 'ajax').and.returnValue(deferred.promise());
|
|
||||||
|
|
||||||
integrationSettingsForm.testSettings(formData);
|
|
||||||
|
|
||||||
spyOn(integrationSettingsForm.$form, 'submit');
|
spyOn(integrationSettingsForm.$form, 'submit');
|
||||||
deferred.resolve({ error: false });
|
|
||||||
|
|
||||||
expect(integrationSettingsForm.$form.submit).toHaveBeenCalled();
|
mock.onPut(integrationSettingsForm.testEndPoint).reply(200, {
|
||||||
|
error: false,
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should submit form when clicked on `Save anyway` action of error Flash', () => {
|
integrationSettingsForm.testSettings(formData)
|
||||||
|
.then(() => {
|
||||||
|
expect(integrationSettingsForm.$form.submit).toHaveBeenCalled();
|
||||||
|
|
||||||
|
done();
|
||||||
|
})
|
||||||
|
.catch(done.fail);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should submit form when clicked on `Save anyway` action of error Flash', (done) => {
|
||||||
|
spyOn(integrationSettingsForm.$form, 'submit');
|
||||||
|
|
||||||
const errorMessage = 'Test failed.';
|
const errorMessage = 'Test failed.';
|
||||||
const deferred = $.Deferred();
|
mock.onPut(integrationSettingsForm.testEndPoint).reply(200, {
|
||||||
spyOn($, 'ajax').and.returnValue(deferred.promise());
|
error: true,
|
||||||
|
message: errorMessage,
|
||||||
integrationSettingsForm.testSettings(formData);
|
});
|
||||||
|
|
||||||
deferred.resolve({ error: true, message: errorMessage });
|
|
||||||
|
|
||||||
|
integrationSettingsForm.testSettings(formData)
|
||||||
|
.then(() => {
|
||||||
const $flashAction = $('.flash-container .flash-action');
|
const $flashAction = $('.flash-container .flash-action');
|
||||||
expect($flashAction).toBeDefined();
|
expect($flashAction).toBeDefined();
|
||||||
|
|
||||||
spyOn(integrationSettingsForm.$form, 'submit');
|
|
||||||
$flashAction.get(0).click();
|
$flashAction.get(0).click();
|
||||||
|
})
|
||||||
|
.then(() => {
|
||||||
expect(integrationSettingsForm.$form.submit).toHaveBeenCalled();
|
expect(integrationSettingsForm.$form.submit).toHaveBeenCalled();
|
||||||
|
|
||||||
|
done();
|
||||||
|
})
|
||||||
|
.catch(done.fail);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should show error Flash if ajax request failed', () => {
|
it('should show error Flash if ajax request failed', (done) => {
|
||||||
const errorMessage = 'Something went wrong on our end.';
|
const errorMessage = 'Something went wrong on our end.';
|
||||||
const deferred = $.Deferred();
|
|
||||||
spyOn($, 'ajax').and.returnValue(deferred.promise());
|
|
||||||
|
|
||||||
integrationSettingsForm.testSettings(formData);
|
mock.onPut(integrationSettingsForm.testEndPoint).networkError();
|
||||||
|
|
||||||
deferred.reject();
|
|
||||||
|
|
||||||
|
integrationSettingsForm.testSettings(formData)
|
||||||
|
.then(() => {
|
||||||
expect($('.flash-container .flash-text').text().trim()).toEqual(errorMessage);
|
expect($('.flash-container .flash-text').text().trim()).toEqual(errorMessage);
|
||||||
|
|
||||||
|
done();
|
||||||
|
})
|
||||||
|
.catch(done.fail);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should always call `toggleSubmitBtnState` with `false` once request is completed', () => {
|
it('should always call `toggleSubmitBtnState` with `false` once request is completed', (done) => {
|
||||||
const deferred = $.Deferred();
|
mock.onPut(integrationSettingsForm.testEndPoint).networkError();
|
||||||
spyOn($, 'ajax').and.returnValue(deferred.promise());
|
|
||||||
|
|
||||||
integrationSettingsForm.testSettings(formData);
|
|
||||||
|
|
||||||
spyOn(integrationSettingsForm, 'toggleSubmitBtnState');
|
spyOn(integrationSettingsForm, 'toggleSubmitBtnState');
|
||||||
deferred.reject();
|
|
||||||
|
|
||||||
|
integrationSettingsForm.testSettings(formData)
|
||||||
|
.then(() => {
|
||||||
expect(integrationSettingsForm.toggleSubmitBtnState).toHaveBeenCalledWith(false);
|
expect(integrationSettingsForm.toggleSubmitBtnState).toHaveBeenCalledWith(false);
|
||||||
|
|
||||||
|
done();
|
||||||
|
})
|
||||||
|
.catch(done.fail);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -1,3 +1,5 @@
|
||||||
|
import MockAdaptor from 'axios-mock-adapter';
|
||||||
|
import axios from '~/lib/utils/axios_utils';
|
||||||
import IssuableIndex from '~/issuable_index';
|
import IssuableIndex from '~/issuable_index';
|
||||||
|
|
||||||
describe('Issuable', () => {
|
describe('Issuable', () => {
|
||||||
|
@ -19,6 +21,8 @@ describe('Issuable', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('resetIncomingEmailToken', () => {
|
describe('resetIncomingEmailToken', () => {
|
||||||
|
let mock;
|
||||||
|
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
const element = document.createElement('a');
|
const element = document.createElement('a');
|
||||||
element.classList.add('incoming-email-token-reset');
|
element.classList.add('incoming-email-token-reset');
|
||||||
|
@ -30,14 +34,28 @@ describe('Issuable', () => {
|
||||||
document.body.appendChild(input);
|
document.body.appendChild(input);
|
||||||
|
|
||||||
Issuable = new IssuableIndex('issue_');
|
Issuable = new IssuableIndex('issue_');
|
||||||
|
|
||||||
|
mock = new MockAdaptor(axios);
|
||||||
|
|
||||||
|
mock.onPut('foo').reply(200, {
|
||||||
|
new_address: 'testing123',
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should send request to reset email token', () => {
|
afterEach(() => {
|
||||||
spyOn(jQuery, 'ajax').and.callThrough();
|
mock.restore();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should send request to reset email token', (done) => {
|
||||||
|
spyOn(axios, 'put').and.callThrough();
|
||||||
document.querySelector('.incoming-email-token-reset').click();
|
document.querySelector('.incoming-email-token-reset').click();
|
||||||
|
|
||||||
expect(jQuery.ajax).toHaveBeenCalled();
|
setTimeout(() => {
|
||||||
expect(jQuery.ajax.calls.argsFor(0)[0].url).toEqual('foo');
|
expect(axios.put).toHaveBeenCalledWith('foo');
|
||||||
|
expect($('#issuable_email').val()).toBe('testing123');
|
||||||
|
|
||||||
|
done();
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in New Issue