Converted integration_settings_form to axios
This commit is contained in:
parent
5792faf4ae
commit
0c2c8773fb
|
@ -1,4 +1,5 @@
|
|||
import Flash from '../flash';
|
||||
import axios from '../lib/utils/axios_utils';
|
||||
import flash from '../flash';
|
||||
|
||||
export default class IntegrationSettingsForm {
|
||||
constructor(formSelector) {
|
||||
|
@ -95,14 +96,11 @@ export default class IntegrationSettingsForm {
|
|||
*/
|
||||
testSettings(formData) {
|
||||
this.toggleSubmitBtnState(true);
|
||||
$.ajax({
|
||||
type: 'PUT',
|
||||
url: this.testEndPoint,
|
||||
data: formData,
|
||||
})
|
||||
.done((res) => {
|
||||
if (res.error) {
|
||||
new Flash(`${res.message} ${res.service_response}`, 'alert', document, {
|
||||
|
||||
return axios.put(this.testEndPoint, formData)
|
||||
.then(({ data }) => {
|
||||
if (data.error) {
|
||||
flash(`${data.message} ${data.service_response}`, 'alert', document, {
|
||||
title: 'Save anyway',
|
||||
clickHandler: (e) => {
|
||||
e.preventDefault();
|
||||
|
@ -112,11 +110,11 @@ export default class IntegrationSettingsForm {
|
|||
} else {
|
||||
this.$form.submit();
|
||||
}
|
||||
|
||||
this.toggleSubmitBtnState(false);
|
||||
})
|
||||
.fail(() => {
|
||||
new Flash('Something went wrong on our end.');
|
||||
})
|
||||
.always(() => {
|
||||
.catch(() => {
|
||||
flash('Something went wrong on our end.');
|
||||
this.toggleSubmitBtnState(false);
|
||||
});
|
||||
}
|
||||
|
|
|
@ -1,3 +1,5 @@
|
|||
import MockAdaptor from 'axios-mock-adapter';
|
||||
import axios from '~/lib/utils/axios_utils';
|
||||
import IntegrationSettingsForm from '~/integrations/integration_settings_form';
|
||||
|
||||
describe('IntegrationSettingsForm', () => {
|
||||
|
@ -109,91 +111,117 @@ describe('IntegrationSettingsForm', () => {
|
|||
describe('testSettings', () => {
|
||||
let integrationSettingsForm;
|
||||
let formData;
|
||||
let mock;
|
||||
|
||||
beforeEach(() => {
|
||||
mock = new MockAdaptor(axios);
|
||||
|
||||
spyOn(axios, 'put').and.callThrough();
|
||||
|
||||
integrationSettingsForm = new IntegrationSettingsForm('.js-integration-settings-form');
|
||||
formData = integrationSettingsForm.$form.serialize();
|
||||
});
|
||||
|
||||
it('should make an ajax request with provided `formData`', () => {
|
||||
const deferred = $.Deferred();
|
||||
spyOn($, 'ajax').and.returnValue(deferred.promise());
|
||||
|
||||
integrationSettingsForm.testSettings(formData);
|
||||
|
||||
expect($.ajax).toHaveBeenCalledWith({
|
||||
type: 'PUT',
|
||||
url: integrationSettingsForm.testEndPoint,
|
||||
data: formData,
|
||||
});
|
||||
afterEach(() => {
|
||||
mock.restore();
|
||||
});
|
||||
|
||||
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 deferred = $.Deferred();
|
||||
spyOn($, 'ajax').and.returnValue(deferred.promise());
|
||||
|
||||
integrationSettingsForm.testSettings(formData);
|
||||
|
||||
deferred.resolve({ error: true, message: errorMessage, service_response: 'some error' });
|
||||
mock.onPut(integrationSettingsForm.testEndPoint).reply(200, {
|
||||
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');
|
||||
|
||||
done();
|
||||
})
|
||||
.catch(done.fail);
|
||||
});
|
||||
|
||||
it('should submit form if ajax request responds without any error in test', () => {
|
||||
const deferred = $.Deferred();
|
||||
spyOn($, 'ajax').and.returnValue(deferred.promise());
|
||||
|
||||
integrationSettingsForm.testSettings(formData);
|
||||
|
||||
it('should submit form if ajax request responds without any error in test', (done) => {
|
||||
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 deferred = $.Deferred();
|
||||
spyOn($, 'ajax').and.returnValue(deferred.promise());
|
||||
|
||||
integrationSettingsForm.testSettings(formData);
|
||||
|
||||
deferred.resolve({ error: true, message: errorMessage });
|
||||
mock.onPut(integrationSettingsForm.testEndPoint).reply(200, {
|
||||
error: true,
|
||||
message: errorMessage,
|
||||
});
|
||||
|
||||
integrationSettingsForm.testSettings(formData)
|
||||
.then(() => {
|
||||
const $flashAction = $('.flash-container .flash-action');
|
||||
expect($flashAction).toBeDefined();
|
||||
|
||||
spyOn(integrationSettingsForm.$form, 'submit');
|
||||
$flashAction.get(0).click();
|
||||
})
|
||||
.then(() => {
|
||||
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 deferred = $.Deferred();
|
||||
spyOn($, 'ajax').and.returnValue(deferred.promise());
|
||||
|
||||
integrationSettingsForm.testSettings(formData);
|
||||
|
||||
deferred.reject();
|
||||
mock.onPut(integrationSettingsForm.testEndPoint).networkError();
|
||||
|
||||
integrationSettingsForm.testSettings(formData)
|
||||
.then(() => {
|
||||
expect($('.flash-container .flash-text').text().trim()).toEqual(errorMessage);
|
||||
|
||||
done();
|
||||
})
|
||||
.catch(done.fail);
|
||||
});
|
||||
|
||||
it('should always call `toggleSubmitBtnState` with `false` once request is completed', () => {
|
||||
const deferred = $.Deferred();
|
||||
spyOn($, 'ajax').and.returnValue(deferred.promise());
|
||||
|
||||
integrationSettingsForm.testSettings(formData);
|
||||
it('should always call `toggleSubmitBtnState` with `false` once request is completed', (done) => {
|
||||
mock.onPut(integrationSettingsForm.testEndPoint).networkError();
|
||||
|
||||
spyOn(integrationSettingsForm, 'toggleSubmitBtnState');
|
||||
deferred.reject();
|
||||
|
||||
integrationSettingsForm.testSettings(formData)
|
||||
.then(() => {
|
||||
expect(integrationSettingsForm.toggleSubmitBtnState).toHaveBeenCalledWith(false);
|
||||
|
||||
done();
|
||||
})
|
||||
.catch(done.fail);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
Loading…
Reference in New Issue