Commit 8957947e authored by Filipa Lacerda's avatar Filipa Lacerda

Merge branch 'ph-ajax-into-axios' into 'master'

More $.ajax conversions to axios

See merge request gitlab-org/gitlab-ce!16761
parents 8e7c7f92 dc996051
...@@ -2,6 +2,7 @@ ...@@ -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() { ...@@ -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() { // Fetch the data through ajax if the data is a string
if (_this.options.beforeSend) { return axios.get(this.dataEndpoint)
return _this.options.beforeSend(); .then(({ data }) => {
} if (this.options.success) {
}; return this.options.success(data);
})(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
}; };
return GitLabDropdownRemote; return GitLabDropdownRemote;
......
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', () => { ...@@ -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.')));
}); });
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 { ...@@ -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', this.toggleSubscriptionButtons();
url, this.$unsubscribeButtons.removeAttr('data-url');
}).done(() => { })
this.toggleSubscriptionButtons(); .catch(() => flash(__('There was an error when unsubscribing from this label.')));
this.$unsubscribeButtons.removeAttr('data-url');
});
} }
subscribe(event) { subscribe(event) {
...@@ -31,12 +33,9 @@ export default class GroupLabelSubscription { ...@@ -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() {
......
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,29 +96,26 @@ export default class IntegrationSettingsForm { ...@@ -95,29 +96,26 @@ 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) => { title: 'Save anyway',
if (res.error) { clickHandler: (e) => {
new Flash(`${res.message} ${res.service_response}`, 'alert', document, { e.preventDefault();
title: 'Save anyway', this.$form.submit();
clickHandler: (e) => { },
e.preventDefault(); });
this.$form.submit(); } else {
}, this.$form.submit();
}); }
} else {
this.$form.submit(); this.toggleSubmitBtnState(false);
} })
}) .catch(() => {
.fail(() => { flash('Something went wrong on our end.');
new Flash('Something went wrong on our end.'); this.toggleSubmitBtnState(false);
}) });
.always(() => {
this.toggleSubmitBtnState(false);
});
} }
} }
/* 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 { ...@@ -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() {
......
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,23 +23,24 @@ export default class IssuableIndex { ...@@ -20,23 +23,24 @@ 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');
}, });
});
}); });
} }
} }
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', () => { ...@@ -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); it('should make an ajax request with provided `formData`', (done) => {
integrationSettingsForm.testSettings(formData)
.then(() => {
expect(axios.put).toHaveBeenCalledWith(integrationSettingsForm.testEndPoint, formData);
expect($.ajax).toHaveBeenCalledWith({ done();
type: 'PUT', })
url: integrationSettingsForm.testEndPoint, .catch(done.fail);
data: formData,
});
}); });
it('should show error Flash with `Save anyway` action if ajax request responds with error in test', () => { 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');
expect($flashContainer.find('.flash-text').text().trim()).toEqual('Test failed. some error');
expect($flashContainer.find('.flash-action')).toBeDefined();
expect($flashContainer.find('.flash-action').text().trim()).toEqual('Save anyway');
const $flashContainer = $('.flash-container'); done();
expect($flashContainer.find('.flash-text').text().trim()).toEqual('Test failed. some error'); })
expect($flashContainer.find('.flash-action')).toBeDefined(); .catch(done.fail);
expect($flashContainer.find('.flash-action').text().trim()).toEqual('Save anyway');
}); });
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(integrationSettingsForm.$form, 'submit');
spyOn($, 'ajax').and.returnValue(deferred.promise());
integrationSettingsForm.testSettings(formData); mock.onPut(integrationSettingsForm.testEndPoint).reply(200, {
error: false,
});
spyOn(integrationSettingsForm.$form, 'submit'); integrationSettingsForm.testSettings(formData)
deferred.resolve({ error: false }); .then(() => {
expect(integrationSettingsForm.$form.submit).toHaveBeenCalled();
expect(integrationSettingsForm.$form.submit).toHaveBeenCalled(); done();
})
.catch(done.fail);
}); });
it('should submit form when clicked on `Save anyway` action of error Flash', () => { it('should submit form when clicked on `Save anyway` action of error Flash', (done) => {
const errorMessage = 'Test failed.'; spyOn(integrationSettingsForm.$form, 'submit');
const deferred = $.Deferred();
spyOn($, 'ajax').and.returnValue(deferred.promise());
integrationSettingsForm.testSettings(formData); const errorMessage = 'Test failed.';
mock.onPut(integrationSettingsForm.testEndPoint).reply(200, {
error: true,
message: errorMessage,
});
deferred.resolve({ error: true, message: errorMessage }); integrationSettingsForm.testSettings(formData)
.then(() => {
const $flashAction = $('.flash-container .flash-action');
expect($flashAction).toBeDefined();
const $flashAction = $('.flash-container .flash-action'); $flashAction.get(0).click();
expect($flashAction).toBeDefined(); })
.then(() => {
expect(integrationSettingsForm.$form.submit).toHaveBeenCalled();
spyOn(integrationSettingsForm.$form, 'submit'); done();
$flashAction.get(0).click(); })
expect(integrationSettingsForm.$form.submit).toHaveBeenCalled(); .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();
expect(integrationSettingsForm.toggleSubmitBtnState).toHaveBeenCalledWith(false); integrationSettingsForm.testSettings(formData)
.then(() => {
expect(integrationSettingsForm.toggleSubmitBtnState).toHaveBeenCalledWith(false);
done();
})
.catch(done.fail);
}); });
}); });
}); });
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', () => { ...@@ -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', () => { ...@@ -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();
});
}); });
}); });
}); });
......
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