debian-mirror-gitlab/spec/frontend/gl_form_spec.js

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

184 lines
6.2 KiB
JavaScript
Raw Normal View History

2018-03-27 19:54:05 +05:30
import autosize from 'autosize';
2021-03-11 19:13:27 +05:30
import $ from 'jquery';
2018-03-17 18:26:18 +05:30
import GLForm from '~/gl_form';
2017-09-10 17:25:29 +05:30
import '~/lib/utils/text_utility';
import '~/lib/utils/common_utils';
2017-08-17 22:00:37 +05:30
describe('GLForm', () => {
2020-06-23 00:09:42 +05:30
const testContext = {};
2023-04-23 21:23:45 +05:30
const mockGl = {
GfmAutoComplete: {
dataSources: {
commands: '/group/projects/-/autocomplete_sources/commands',
},
},
};
describe('Setting up GfmAutoComplete', () => {
describe('setupForm', () => {
let setupFormSpy;
beforeEach(() => {
setupFormSpy = jest.spyOn(GLForm.prototype, 'setupForm');
testContext.form = $('<form class="gfm-form"><textarea class="js-gfm-input"></form>');
testContext.textarea = testContext.form.find('textarea');
});
it('should be called with the global data source `windows.gl`', () => {
window.gl = { ...mockGl };
testContext.glForm = new GLForm(testContext.form, {}, false);
expect(setupFormSpy).toHaveBeenCalledTimes(1);
expect(setupFormSpy).toHaveBeenCalledWith(window.gl.GfmAutoComplete.dataSources, false);
});
it('should be called with the provided custom data source', () => {
window.gl = { ...mockGl };
const customDataSources = {
foobar: '/group/projects/-/autocomplete_sources/foobar',
};
testContext.glForm = new GLForm(testContext.form, {}, false, customDataSources);
expect(setupFormSpy).toHaveBeenCalledTimes(1);
expect(setupFormSpy).toHaveBeenCalledWith(customDataSources, false);
});
});
});
2020-06-23 00:09:42 +05:30
describe('when instantiated', () => {
2022-04-04 11:22:00 +05:30
beforeEach(() => {
2020-07-28 23:09:34 +05:30
window.gl = window.gl || {};
2020-06-23 00:09:42 +05:30
testContext.form = $('<form class="gfm-form"><textarea class="js-gfm-input"></form>');
testContext.textarea = testContext.form.find('textarea');
jest.spyOn($.prototype, 'off').mockReturnValue(testContext.textarea);
jest.spyOn($.prototype, 'on').mockReturnValue(testContext.textarea);
jest.spyOn($.prototype, 'css').mockImplementation(() => {});
testContext.glForm = new GLForm(testContext.form, false);
2017-08-17 22:00:37 +05:30
});
2017-09-10 17:25:29 +05:30
describe('setupAutosize', () => {
2022-04-04 11:22:00 +05:30
beforeEach(() => {
2020-06-23 00:09:42 +05:30
testContext.glForm.setupAutosize();
2017-08-17 22:00:37 +05:30
});
it('should register an autosize event handler on the textarea', () => {
expect($.prototype.off).toHaveBeenCalledWith('autosize:resized');
2020-06-23 00:09:42 +05:30
expect($.prototype.on).toHaveBeenCalledWith('autosize:resized', expect.any(Function));
2017-08-17 22:00:37 +05:30
});
it('should register a mouseup event handler on the textarea', () => {
expect($.prototype.off).toHaveBeenCalledWith('mouseup.autosize');
2020-06-23 00:09:42 +05:30
expect($.prototype.on).toHaveBeenCalledWith('mouseup.autosize', expect.any(Function));
2017-08-17 22:00:37 +05:30
});
it('should set the resize css property to vertical', () => {
2020-06-23 00:09:42 +05:30
jest.runOnlyPendingTimers();
2017-08-17 22:00:37 +05:30
expect($.prototype.css).toHaveBeenCalledWith('resize', 'vertical');
});
});
2017-09-10 17:25:29 +05:30
describe('setHeightData', () => {
2017-08-17 22:00:37 +05:30
beforeEach(() => {
2020-06-23 00:09:42 +05:30
jest.spyOn($.prototype, 'data').mockImplementation(() => {});
jest.spyOn($.prototype, 'outerHeight').mockReturnValue(200);
testContext.glForm.setHeightData();
2017-08-17 22:00:37 +05:30
});
it('should set the height data attribute', () => {
expect($.prototype.data).toHaveBeenCalledWith('height', 200);
});
it('should call outerHeight', () => {
expect($.prototype.outerHeight).toHaveBeenCalled();
});
});
2017-09-10 17:25:29 +05:30
describe('destroyAutosize', () => {
2017-08-17 22:00:37 +05:30
describe('when called', () => {
beforeEach(() => {
2020-06-23 00:09:42 +05:30
jest.spyOn($.prototype, 'data').mockImplementation(() => {});
jest.spyOn($.prototype, 'outerHeight').mockReturnValue(200);
window.outerHeight = () => 400;
jest.spyOn(autosize, 'destroy').mockImplementation(() => {});
2017-08-17 22:00:37 +05:30
2020-06-23 00:09:42 +05:30
testContext.glForm.destroyAutosize();
2017-08-17 22:00:37 +05:30
});
it('should call outerHeight', () => {
expect($.prototype.outerHeight).toHaveBeenCalled();
});
it('should get data-height attribute', () => {
expect($.prototype.data).toHaveBeenCalledWith('height');
});
it('should call autosize destroy', () => {
2020-06-23 00:09:42 +05:30
expect(autosize.destroy).toHaveBeenCalledWith(testContext.textarea);
2017-08-17 22:00:37 +05:30
});
it('should set the data-height attribute', () => {
expect($.prototype.data).toHaveBeenCalledWith('height', 200);
});
it('should set the outerHeight', () => {
expect($.prototype.outerHeight).toHaveBeenCalledWith(200);
});
it('should set the css', () => {
expect($.prototype.css).toHaveBeenCalledWith('max-height', window.outerHeight);
});
});
it('should return undefined if the data-height equals the outerHeight', () => {
2020-06-23 00:09:42 +05:30
jest.spyOn($.prototype, 'outerHeight').mockReturnValue(200);
jest.spyOn($.prototype, 'data').mockReturnValue(200);
jest.spyOn(autosize, 'destroy').mockImplementation(() => {});
2018-12-13 13:39:08 +05:30
2020-06-23 00:09:42 +05:30
expect(testContext.glForm.destroyAutosize()).toBeUndefined();
2018-03-27 19:54:05 +05:30
expect(autosize.destroy).not.toHaveBeenCalled();
2017-08-17 22:00:37 +05:30
});
});
2020-07-28 23:09:34 +05:30
2021-03-08 18:12:59 +05:30
describe('autofocus', () => {
it('focus the textarea when autofocus is true', () => {
testContext.textarea.data('autofocus', true);
jest.spyOn($.prototype, 'focus');
testContext.glForm = new GLForm(testContext.form, false);
expect($.prototype.focus).toHaveBeenCalled();
});
it("doesn't focus the textarea when autofocus is false", () => {
testContext.textarea.data('autofocus', false);
jest.spyOn($.prototype, 'focus');
testContext.glForm = new GLForm(testContext.form, false);
expect($.prototype.focus).not.toHaveBeenCalled();
});
});
2020-07-28 23:09:34 +05:30
describe('supportsQuickActions', () => {
it('should return false if textarea does not support quick actions', () => {
const glForm = new GLForm(testContext.form, false);
expect(glForm.supportsQuickActions).toEqual(false);
});
it('should return true if textarea supports quick actions', () => {
testContext.textarea.attr('data-supports-quick-actions', true);
const glForm = new GLForm(testContext.form, false);
expect(glForm.supportsQuickActions).toEqual(true);
});
});
2017-08-17 22:00:37 +05:30
});
});