2018-03-09 15:18:59 -05:00
|
|
|
import $ from 'jquery';
|
2018-01-29 08:00:15 -05:00
|
|
|
import MockAdaptor from 'axios-mock-adapter';
|
|
|
|
import axios from '~/lib/utils/axios_utils';
|
2017-05-30 07:30:26 -04:00
|
|
|
import IntegrationSettingsForm from '~/integrations/integration_settings_form';
|
|
|
|
|
|
|
|
describe('IntegrationSettingsForm', () => {
|
2019-03-22 07:03:15 -04:00
|
|
|
const FIXTURE = 'services/edit_service.html.raw';
|
2017-05-30 07:30:26 -04:00
|
|
|
preloadFixtures(FIXTURE);
|
|
|
|
|
|
|
|
beforeEach(() => {
|
|
|
|
loadFixtures(FIXTURE);
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('contructor', () => {
|
|
|
|
let integrationSettingsForm;
|
|
|
|
|
|
|
|
beforeEach(() => {
|
|
|
|
integrationSettingsForm = new IntegrationSettingsForm('.js-integration-settings-form');
|
|
|
|
spyOn(integrationSettingsForm, 'init');
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should initialize form element refs on class object', () => {
|
|
|
|
// Form Reference
|
|
|
|
expect(integrationSettingsForm.$form).toBeDefined();
|
|
|
|
expect(integrationSettingsForm.$form.prop('nodeName')).toEqual('FORM');
|
|
|
|
|
|
|
|
// Form Child Elements
|
|
|
|
expect(integrationSettingsForm.$serviceToggle).toBeDefined();
|
|
|
|
expect(integrationSettingsForm.$submitBtn).toBeDefined();
|
|
|
|
expect(integrationSettingsForm.$submitBtnLoader).toBeDefined();
|
|
|
|
expect(integrationSettingsForm.$submitBtnLabel).toBeDefined();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should initialize form metadata on class object', () => {
|
2017-05-31 03:18:02 -04:00
|
|
|
expect(integrationSettingsForm.testEndPoint).toBeDefined();
|
2017-05-30 07:30:26 -04:00
|
|
|
expect(integrationSettingsForm.canTestService).toBeDefined();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('toggleServiceState', () => {
|
|
|
|
let integrationSettingsForm;
|
|
|
|
|
|
|
|
beforeEach(() => {
|
|
|
|
integrationSettingsForm = new IntegrationSettingsForm('.js-integration-settings-form');
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should remove `novalidate` attribute to form when called with `true`', () => {
|
|
|
|
integrationSettingsForm.toggleServiceState(true);
|
|
|
|
|
|
|
|
expect(integrationSettingsForm.$form.attr('novalidate')).not.toBeDefined();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should set `novalidate` attribute to form when called with `false`', () => {
|
|
|
|
integrationSettingsForm.toggleServiceState(false);
|
|
|
|
|
|
|
|
expect(integrationSettingsForm.$form.attr('novalidate')).toBeDefined();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('toggleSubmitBtnLabel', () => {
|
|
|
|
let integrationSettingsForm;
|
|
|
|
|
|
|
|
beforeEach(() => {
|
|
|
|
integrationSettingsForm = new IntegrationSettingsForm('.js-integration-settings-form');
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should set Save button label to "Test settings and save changes" when serviceActive & canTestService are `true`', () => {
|
2017-05-31 03:18:02 -04:00
|
|
|
integrationSettingsForm.canTestService = true;
|
2017-05-30 07:30:26 -04:00
|
|
|
|
2017-05-31 03:18:02 -04:00
|
|
|
integrationSettingsForm.toggleSubmitBtnLabel(true);
|
2018-10-09 14:03:09 -04:00
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
expect(integrationSettingsForm.$submitBtnLabel.text()).toEqual(
|
|
|
|
'Test settings and save changes',
|
|
|
|
);
|
2017-05-30 07:30:26 -04:00
|
|
|
});
|
|
|
|
|
|
|
|
it('should set Save button label to "Save changes" when either serviceActive or canTestService (or both) is `false`', () => {
|
2017-05-31 03:18:02 -04:00
|
|
|
integrationSettingsForm.canTestService = false;
|
2017-05-30 07:30:26 -04:00
|
|
|
|
2017-05-31 03:18:02 -04:00
|
|
|
integrationSettingsForm.toggleSubmitBtnLabel(false);
|
2018-10-09 14:03:09 -04:00
|
|
|
|
2017-05-30 07:30:26 -04:00
|
|
|
expect(integrationSettingsForm.$submitBtnLabel.text()).toEqual('Save changes');
|
|
|
|
|
2017-05-31 03:18:02 -04:00
|
|
|
integrationSettingsForm.toggleSubmitBtnLabel(true);
|
2018-10-09 14:03:09 -04:00
|
|
|
|
2017-05-30 07:30:26 -04:00
|
|
|
expect(integrationSettingsForm.$submitBtnLabel.text()).toEqual('Save changes');
|
|
|
|
|
2017-05-31 03:18:02 -04:00
|
|
|
integrationSettingsForm.canTestService = true;
|
|
|
|
|
|
|
|
integrationSettingsForm.toggleSubmitBtnLabel(false);
|
2018-10-09 14:03:09 -04:00
|
|
|
|
2017-05-30 07:30:26 -04:00
|
|
|
expect(integrationSettingsForm.$submitBtnLabel.text()).toEqual('Save changes');
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('toggleSubmitBtnState', () => {
|
|
|
|
let integrationSettingsForm;
|
|
|
|
|
|
|
|
beforeEach(() => {
|
|
|
|
integrationSettingsForm = new IntegrationSettingsForm('.js-integration-settings-form');
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should disable Save button and show loader animation when called with `true`', () => {
|
|
|
|
integrationSettingsForm.toggleSubmitBtnState(true);
|
|
|
|
|
|
|
|
expect(integrationSettingsForm.$submitBtn.is(':disabled')).toBeTruthy();
|
|
|
|
expect(integrationSettingsForm.$submitBtnLoader.hasClass('hidden')).toBeFalsy();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should enable Save button and hide loader animation when called with `false`', () => {
|
|
|
|
integrationSettingsForm.toggleSubmitBtnState(false);
|
|
|
|
|
|
|
|
expect(integrationSettingsForm.$submitBtn.is(':disabled')).toBeFalsy();
|
|
|
|
expect(integrationSettingsForm.$submitBtnLoader.hasClass('hidden')).toBeTruthy();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('testSettings', () => {
|
|
|
|
let integrationSettingsForm;
|
|
|
|
let formData;
|
2018-01-29 08:00:15 -05:00
|
|
|
let mock;
|
2017-05-30 07:30:26 -04:00
|
|
|
|
|
|
|
beforeEach(() => {
|
2018-01-29 08:00:15 -05:00
|
|
|
mock = new MockAdaptor(axios);
|
|
|
|
|
|
|
|
spyOn(axios, 'put').and.callThrough();
|
|
|
|
|
2017-05-30 07:30:26 -04:00
|
|
|
integrationSettingsForm = new IntegrationSettingsForm('.js-integration-settings-form');
|
|
|
|
formData = integrationSettingsForm.$form.serialize();
|
|
|
|
});
|
|
|
|
|
2018-01-29 08:00:15 -05:00
|
|
|
afterEach(() => {
|
|
|
|
mock.restore();
|
|
|
|
});
|
2017-05-30 07:30:26 -04:00
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
it('should make an ajax request with provided `formData`', done => {
|
|
|
|
integrationSettingsForm
|
|
|
|
.testSettings(formData)
|
2018-01-29 08:00:15 -05:00
|
|
|
.then(() => {
|
|
|
|
expect(axios.put).toHaveBeenCalledWith(integrationSettingsForm.testEndPoint, formData);
|
2017-05-30 07:30:26 -04:00
|
|
|
|
2018-01-29 08:00:15 -05:00
|
|
|
done();
|
|
|
|
})
|
|
|
|
.catch(done.fail);
|
2017-05-30 07:30:26 -04:00
|
|
|
});
|
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
it('should show error Flash with `Save anyway` action if ajax request responds with error in test', done => {
|
2017-05-30 07:30:26 -04:00
|
|
|
const errorMessage = 'Test failed.';
|
2018-01-29 08:00:15 -05:00
|
|
|
mock.onPut(integrationSettingsForm.testEndPoint).reply(200, {
|
|
|
|
error: true,
|
|
|
|
message: errorMessage,
|
|
|
|
service_response: 'some error',
|
2018-06-01 07:43:53 -04:00
|
|
|
test_failed: true,
|
2018-01-29 08:00:15 -05:00
|
|
|
});
|
2017-05-30 07:30:26 -04:00
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
integrationSettingsForm
|
|
|
|
.testSettings(formData)
|
2018-01-29 08:00:15 -05:00
|
|
|
.then(() => {
|
|
|
|
const $flashContainer = $('.flash-container');
|
2018-10-09 14:03:09 -04:00
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
expect(
|
|
|
|
$flashContainer
|
|
|
|
.find('.flash-text')
|
|
|
|
.text()
|
|
|
|
.trim(),
|
|
|
|
).toEqual('Test failed. some error');
|
2018-10-17 03:21:28 -04:00
|
|
|
|
2018-01-29 08:00:15 -05:00
|
|
|
expect($flashContainer.find('.flash-action')).toBeDefined();
|
2018-10-17 03:13:26 -04:00
|
|
|
expect(
|
|
|
|
$flashContainer
|
|
|
|
.find('.flash-action')
|
|
|
|
.text()
|
|
|
|
.trim(),
|
|
|
|
).toEqual('Save anyway');
|
2017-05-30 07:30:26 -04:00
|
|
|
|
2018-01-29 08:00:15 -05:00
|
|
|
done();
|
|
|
|
})
|
|
|
|
.catch(done.fail);
|
2017-05-30 07:30:26 -04:00
|
|
|
});
|
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
it('should not show error Flash with `Save anyway` action if ajax request responds with error in validation', done => {
|
2018-06-01 07:43:53 -04:00
|
|
|
const errorMessage = 'Validations failed.';
|
|
|
|
mock.onPut(integrationSettingsForm.testEndPoint).reply(200, {
|
|
|
|
error: true,
|
|
|
|
message: errorMessage,
|
|
|
|
service_response: 'some error',
|
|
|
|
test_failed: false,
|
|
|
|
});
|
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
integrationSettingsForm
|
|
|
|
.testSettings(formData)
|
2018-06-01 07:43:53 -04:00
|
|
|
.then(() => {
|
|
|
|
const $flashContainer = $('.flash-container');
|
2018-10-09 14:03:09 -04:00
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
expect(
|
|
|
|
$flashContainer
|
|
|
|
.find('.flash-text')
|
|
|
|
.text()
|
|
|
|
.trim(),
|
|
|
|
).toEqual('Validations failed. some error');
|
2018-10-17 03:21:28 -04:00
|
|
|
|
2018-06-01 07:43:53 -04:00
|
|
|
expect($flashContainer.find('.flash-action')).toBeDefined();
|
2018-10-17 03:13:26 -04:00
|
|
|
expect(
|
|
|
|
$flashContainer
|
|
|
|
.find('.flash-action')
|
|
|
|
.text()
|
|
|
|
.trim(),
|
|
|
|
).toEqual('');
|
2018-06-01 07:43:53 -04:00
|
|
|
|
|
|
|
done();
|
|
|
|
})
|
|
|
|
.catch(done.fail);
|
|
|
|
});
|
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
it('should submit form if ajax request responds without any error in test', done => {
|
2018-01-29 08:00:15 -05:00
|
|
|
spyOn(integrationSettingsForm.$form, 'submit');
|
2017-05-30 07:30:26 -04:00
|
|
|
|
2018-01-29 08:00:15 -05:00
|
|
|
mock.onPut(integrationSettingsForm.testEndPoint).reply(200, {
|
|
|
|
error: false,
|
|
|
|
});
|
2017-05-30 07:30:26 -04:00
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
integrationSettingsForm
|
|
|
|
.testSettings(formData)
|
2018-01-29 08:00:15 -05:00
|
|
|
.then(() => {
|
|
|
|
expect(integrationSettingsForm.$form.submit).toHaveBeenCalled();
|
2017-05-30 07:30:26 -04:00
|
|
|
|
2018-01-29 08:00:15 -05:00
|
|
|
done();
|
|
|
|
})
|
|
|
|
.catch(done.fail);
|
2017-05-30 07:30:26 -04:00
|
|
|
});
|
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
it('should submit form when clicked on `Save anyway` action of error Flash', done => {
|
2018-01-29 08:00:15 -05:00
|
|
|
spyOn(integrationSettingsForm.$form, 'submit');
|
2017-05-30 07:30:26 -04:00
|
|
|
|
2018-01-29 08:00:15 -05:00
|
|
|
const errorMessage = 'Test failed.';
|
|
|
|
mock.onPut(integrationSettingsForm.testEndPoint).reply(200, {
|
|
|
|
error: true,
|
|
|
|
message: errorMessage,
|
2018-06-01 07:43:53 -04:00
|
|
|
test_failed: true,
|
2018-01-29 08:00:15 -05:00
|
|
|
});
|
2017-05-30 07:30:26 -04:00
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
integrationSettingsForm
|
|
|
|
.testSettings(formData)
|
2018-01-29 08:00:15 -05:00
|
|
|
.then(() => {
|
|
|
|
const $flashAction = $('.flash-container .flash-action');
|
2018-10-09 14:03:09 -04:00
|
|
|
|
2018-01-29 08:00:15 -05:00
|
|
|
expect($flashAction).toBeDefined();
|
2017-05-30 07:30:26 -04:00
|
|
|
|
2018-01-29 08:00:15 -05:00
|
|
|
$flashAction.get(0).click();
|
|
|
|
})
|
|
|
|
.then(() => {
|
|
|
|
expect(integrationSettingsForm.$form.submit).toHaveBeenCalled();
|
2017-05-30 07:30:26 -04:00
|
|
|
|
2018-01-29 08:00:15 -05:00
|
|
|
done();
|
|
|
|
})
|
|
|
|
.catch(done.fail);
|
2017-05-30 07:30:26 -04:00
|
|
|
});
|
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
it('should show error Flash if ajax request failed', done => {
|
2017-05-30 07:30:26 -04:00
|
|
|
const errorMessage = 'Something went wrong on our end.';
|
|
|
|
|
2018-01-29 08:00:15 -05:00
|
|
|
mock.onPut(integrationSettingsForm.testEndPoint).networkError();
|
2017-05-30 07:30:26 -04:00
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
integrationSettingsForm
|
|
|
|
.testSettings(formData)
|
2018-01-29 08:00:15 -05:00
|
|
|
.then(() => {
|
2018-10-17 03:13:26 -04:00
|
|
|
expect(
|
|
|
|
$('.flash-container .flash-text')
|
|
|
|
.text()
|
|
|
|
.trim(),
|
|
|
|
).toEqual(errorMessage);
|
2017-05-30 07:30:26 -04:00
|
|
|
|
2018-01-29 08:00:15 -05:00
|
|
|
done();
|
|
|
|
})
|
|
|
|
.catch(done.fail);
|
2017-05-30 07:30:26 -04:00
|
|
|
});
|
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
it('should always call `toggleSubmitBtnState` with `false` once request is completed', done => {
|
2018-01-29 08:00:15 -05:00
|
|
|
mock.onPut(integrationSettingsForm.testEndPoint).networkError();
|
2017-05-30 07:30:26 -04:00
|
|
|
|
|
|
|
spyOn(integrationSettingsForm, 'toggleSubmitBtnState');
|
|
|
|
|
2018-10-17 03:13:26 -04:00
|
|
|
integrationSettingsForm
|
|
|
|
.testSettings(formData)
|
2018-01-29 08:00:15 -05:00
|
|
|
.then(() => {
|
|
|
|
expect(integrationSettingsForm.toggleSubmitBtnState).toHaveBeenCalledWith(false);
|
|
|
|
|
|
|
|
done();
|
|
|
|
})
|
|
|
|
.catch(done.fail);
|
2017-05-30 07:30:26 -04:00
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|